vendredi 8 mai 2015

Change color of data url embedded SVG image

I have an SVG background image embedded in a CSS file as a data url:

.what { background: url('data: image/svg+xml; utf8, <svg> ... </svg') }

I want another element to have the same background image, only in a different color, but I don't want to repeat the whole SVG code.

<div class="what one">...</div>
<div class="what two">...</div>

So how do I change the color of a background SVG image?

No Javascript, please.


None of the other related questions answered this, because the solutions given there rely on serving two different files, which I want to avoid because I want to minimize file size for mobile users.

Aucun commentaire:

Enregistrer un commentaire