search

google / material-design-icons

Material Design icons by Google (Material Symbols)
http://google.github.io/material-design-icons/
Apache License 2.0
50.71k stars 9.58k forks source link

A lot of images are blurry #103

Open Actine opened 9 years ago

Actine commented 9 years ago

First of all, thank you a ton for rendering these.

However, there are quite many images (e.g. ic_add*, the "plus" icon), which are crisp only for certain dpi and certain resolutions (e.g. 36dp are almost never crisp, so are most of hdpi icons). This violates the recommendations of the spec (http://www.google.com/design/spec/style/icons.html#icons-system-icons, placing icons not on pixel), and is generally a sadness for an OCD guy like me (kidding).

Is there any way this can be fixed?

jestelle commented 9 years ago

Thanks for the feedback @Actine

We highly recommend using 24dp icons, which is one of the reasons we haven't gotten to pixel aligning the 36dp variants.

We're certainly aware of this an intend to eventually get to all the icons, but for now we flag them as visual designers notice problematic blurry edges, and then fix them.

hdpi is generally a pain point when it comes to crisp icons, as the 1.5x multiplier causes havoc with our icon grid ;-)

Can you point me at specific icons you see as problematic and I'll see if we can get those addressed.

Thanks!

Actine commented 9 years ago

@jestelle The last thing I want you to do is walking over the icons I'd list and adjusting them manually ;) I added the issue for tracking, and maybe somehow/somewhere in the future this can be fixed in a painless way. For instance, a library/plugin/tool will be developed that will be able to scale icons and align them to pixel grid smartly, similarly to how type hinting works

jestelle commented 9 years ago

@Actine Unfortunately adjusting them manually is still the 'state-of-the-art' in pixel perfect, beautiful icons. Hinting in typography is often done manually too ;-) although TTF Autohint is a pretty viable automatic alternative.

This is something we'll keep working on – but identifying problem cases is certainly helpful, so do let me know if you have a few specific icons I can flag.

Actine commented 9 years ago

@jestelle Well then... for instance, ic_add_black_24dp (the one I mentioned in the original issue), and ic_add_circle_outline_black_24dp — both have blurry "+" in them. Strange that the former hasn't been flagged yet, since the "plus" icon is probably one of the most used. Other icons in my app are slanted, so misalignment is not obvious there. I'll add to this post if I notice something else, but probably since I only need a few, it's you who knows better what icons you've already fixed manually :)