css set svg color code example

Example 1: set svg background color css

/* You can use CSS masks, With the 'mask' property, you create a mask that is applied to an element. */
background-color: red;
-webkit-mask-image: url(icon.svg);
mask-image: url(icon.svg);

Example 2: change svg color

filter: invert(100%) sepia(0%) saturate(7443%) hue-rotate(198deg) brightness(126%) contrast(112%);

Example 3: change svg color

<svg width="96px" height="96px" viewBox="0 0 512 512" enable-background="new 0 0 512 512" xml:space="preserve">
<path id="time-3-icon" .../>
</svg>

SVG are XML document so just add a style="fill:red"
on the SVG tag when you open the file

<image class="my-svg-alternate" width="96" height="96" src="ppngfallback.png" />

Tags:

Css Example