Invert svg image using css?

Just style the SVG element directly

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 { /* svg on an img tag */
  -webkit-filter: invert(.75); /* safari 6.0 - 9.0 */
          filter: invert(.75);
}

<img src="https://cdn.sstatic.net/Sites/stackoverflow/company/img/logos/so/so-logo.svg" />

You can set the amount as percentage or as number as this docs says

The amount of the conversion, specified as a <number> or a
<percentage>. A value of 100% is completely inverted, while a value of
0% leaves the input unchanged. Values between 0% and 100% are linear
multipliers on the effect. The lacuna value for interpolation is 0.