Forums

Give help. Get help.

  • # January 6, 2013 at 2:44 pm

    Hi there,

    A friend of mine had made some icons for me in Illustrator, vector format. The size is 22 x 22. The icons are really blurry. Do you have any tips on how to get them crisp?

    [http://www.gotmedia.org/back-rings-light.jpg](http://www.gotmedia.org/back-rings-light.jpg “http://www.gotmedia.org/back-rings-light.jpg”)

    [http://www.gotmedia.org/back-rings-thicker.png](http://www.gotmedia.org/back-rings-thicker.png “http://www.gotmedia.org/back-rings-thicker.png”)

    For example, these icons are even smaller and really crisp:
    [http://www.smashingmagazine.com/2013/01/06/freebie-gemicon-icon-set-600-psd-source-png/](http://www.smashingmagazine.com/2013/01/06/freebie-gemicon-icon-set-600-psd-source-png/ “http://www.smashingmagazine.com/2013/01/06/freebie-gemicon-icon-set-600-psd-source-png/”)

    How were those done?

    # January 6, 2013 at 3:18 pm

    Well, for one, you should be using either an svg or png format when adding them to your site. Not jpg.

    You should make them at least double the size you’ll be using them at. This is for retina and also for scaling if you need to. Proper placement of points is important as well.

    # January 6, 2013 at 4:06 pm

    @JamesMD Lol, It’s going to look pixelated when zooming in. It’s a png not svg.

    # January 7, 2013 at 3:17 pm

    I found this really interesting post [“Markup-free icon fonts with unicode range”](http://nimbupani.com/markup-free-icon-fonts-with-unicode-range.html) by Divya Manian… but it is only supported by webkit browsers so far =(

    # June 12, 2013 at 12:30 pm

    Hi.. you should re-drawn the icon, and make sure the grid are in the even count

    that’s it

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.

icon-anchoricon-closeicon-emailicon-linkicon-logo-staricon-menuicon-nav-guideicon-searchicon-staricon-tag