The thing about CSS is you can alter the properties very easily. You can use things like opacity to fake some things with gifs, but you can't change line thickness or color. My experience with SVG is that some things are easy to change with CSS and some aren't, depending on the browser. Support for SVG as background images is poor, so you have to have a bunch of tags declaring the file path or sprite in your markup if you need to use one graphic in multiple places. Using just CSS animation with pseudo elements, your graphic is declared in one place and can be easily changed and reused. Improvements to SVG support would make those advantages null, but that's why I have been using more CSS for small icons(eg indicators) and using SVGs for graphics(things like logos that will only show up on the page once).