Podemos usar SVG em CSS via dados URI, mas sem codificação, funciona apenas em navegadores baseados em Webkit. Se codificar SVG usando encodeURIComponent()
, ele funcionará em qualquer lugar.
O SVG deve ter o atributo xmlns desta maneira: xmlns='http: / /www.w3.org/2000/svg'
. Se não existir, ele será adicionado automagicamente.
SVGs codificados podem ser usado em background
, em border-image
ou em mask
(Demonstração).