Evil Icons – Lightweight SVG icons for your web project
evil-icons.io
evil-icons.io
> Free ‘plug and play’ set of SVG icons designed specifically for web projects. Available as a Node.js package or a Ruby gem (for Rails). Just use icon names with your templates and styles — and all the rest will be done automagically.
But I don't use node or Ruby. Where can I download them?
1) Rather than efficiently referencing a single sprite.svg, the svg source must be inefficiently inlined, page after page.
2) Rather than use SVG's animated transforms, the spinners must be animated using CSS instead. Don't forget the CSS dependencies or the sprites won't animate!
3) Everything is flat. Not because that's the style, but because webkit won't properly render gradients, drop shadows, inner shadows, etc.
https://bugs.webkit.org/show_bug.cgi?id=105904
But hey, at least webkit does kinda work with <use> that reference an external file. I just checked, and Chrome/blink doesn't work at all. It seems Firefox doesn't do animated transforms anymore. It did once. Opera (before it switched to blink rendering engine) was the only browser that worked nearly flawlessly with SVG.
SVG would be so great, if it actually worked. Why do we need ruby/node to do this? See above.
As a (non Rails, non Node) developer, I will probably not bother looking into how I can extract things from a proprietary Adobe Illustrator-file when I don't have Adobe Illustrator.
Current versions of Windows (in Wordpad in 7+) and Office (especially in 2013, but with limited support in earlier versions) can open ODF.
Usually it is important to color and resize the icons depending on situation. That's why you can't just put the SVG into your project. And that's why we decided to make a sprite and to use inline SVG.
But raw inline SVG isn't the most convenient way of SVG graphics using. That's why we have written a couple of helpers.
Also you can download .ai file here https://github.com/outpunk/evil-icons/raw/master/icons-sourc.... Or separate SVG files https://github.com/outpunk/evil-icons/tree/master/app/assets... Or compiled sprite https://github.com/outpunk/evil-icons/blob/master/app/views/....
Right now anyone not using illustrator, node or rails is much more likely to dismiss this as something not worth looking into.
So far, I've been using iconmonstr —http://iconmonstr.com/ —for my icon source. He has a large variety of high-quality icons available as SVG or PNG.
File sizes can be better (though they're occasionally worse), and I'm not doing anything fancy enough to be straining any [CG]PU made in the past decade.
Also, I really like the fact that the image format more closely represents the actual intent of the image creator. "Draw a line from [ax, ay] to [bx, by]" is much more accurate than "Draw a pixel at [ax, ay], then draw a pixel at [ax+1, ay+2], then draw a pixel..."
SVG is plain text XML after all. Not binary blobs.
Fortunately once 2.3 and below disappear we won't have this problem again with Android, as 4.0 and above are Google Chrome for Android supported (and update via the Play Store). No more tying the OS version to the browser version, which was always a terrible idea (looking at you Microsoft!).
I mean, this hasn't really been the case ever. IE versions did historically only come out with new OSes, but once out, could be downloaded on the previous few OS versions. So I wouldn't call that tying the versions together.
Starting with IE2, which was included with Windows 95 OSR 1 and Windows NT 4.0 but compatible with 3.1 and stock 95, and going all the way to the latest version, IE11, which was released with 8.1 and Server 2012 R2, but can be installed on 7 and Server 2008 R2.
People on Windows XP cannot install Internet Explorer 9, 10, 11, or 12. People on Vista cannot install IE 8. People on Windows 8 cannot install IE 9.
Explain to me how this isn't tying one thing to another thing? If IE was stone alone it likely would be backwards compatible with XP.
> Starting with IE2, which was included with Windows 95 OSR 1 and Windows NT 4.0 but compatible with 3.1 and stock 95, and going all the way to the latest version, IE11, which was released with 8.1 and Server 2012 R2, but can be installed on 7 and Server 2008 R2.
They implement a single OS version backward compatibility, good for them. It doesn't disprove that the two are tied together. The fact you cannot install IE 9 on XP but can install Chrome or Firefox, kind of hurts your case.
The <object> element is the general-purpose way of embedding external files in HTML and XHTML... Any content in between the [start and end tags] will be rendered only if the object data itself cannot be displayed.
I prefer to keep my HTML semantic when I can, and <img/> is more accurate than <object/>. Since SVG support is now over 90% of deployed browsers, I'd rather use Javascript for the edge cases.
fallback image will always be loaded. To avoid this you need to use additional tricks like conditional comments... We need some more elegant trick to do that :)
Not exactly SVG <script> tag makes it slightly malicious. If you don't actually inspect the contents of your SVG file. Yes SVG supports executing javascript internally.
I originally thought this post was going to be about that as a few blog posts have popped up about the malicious things you can do with SVG.
[1]: http://fortawesome.github.io/Font-Awesome/examples/#spinning
They have a theme and the name made me interested.
Non-proprietary SVG will be available soon.
I would have preferred a color selection method, that would allow me to choose, if I would want to change the color.