How to Invert an SVG image using CSS ?

You can invert your svg easily by using following css code

svg {
  -webkit-filter: invert(100%); /* safari 6.0 - 9.0 */
          filter: invert(100%);
}

From IE9 and above you can use SVG in <img src="" /> element.

<img class="svg" src="image.svg> </img>

(here src is the url to your svg image)

by using the below css you can easily invert your svg image ,

.svg {
  -webkit-filter: invert(100%); /* safari 6.0 - 9.0 */
          filter: invert(100%);
}