: Blurry vector graphics in web I'm using illustrator and I have a graphic that is 22 pixels by 22 pixels. I export it as a png with 72 resolution, and it constantly comes up blurry. Is it

@Barnes313

.SVG is the format for using vector graphics in the web! Look into the cool stuff people are doing with "scaleable vector graphics" in the web realm! That should solve your issue.

Happy hunting!

Vote Up Vote Down

@Bryan765

When you are saving the illustrator file as a png, what option is selected? Art Optimized or Text Optimized? I've found that these make a difference in how sharp the resulting image is.

If there is no text in your graphic, select "Art Optimized" and see if that helps.

Vote Up Vote Down

@Courtney577

Assuming you mean that "72 resolution" is DPI - Dots Per Inch, it's irrelevant when it comes to screen graphics (opposite to print graphics). Great article (and free ebook as well) on that topic here

Basically what that means is, that no matter how high DPI you set when exporting your graphics, it'll have no effect as you are working with digital units (pixels). Thus 22x22px graphic will look blurry. However, would you want it printed, that's where DPI comes necessary as it tells, in what ratio should pixels be converted to millimeters on physical - printed medium (eg. paper)

Vote Up Vote Down

@Marchetta832

Blurring problem you're describing is aliasing. Try exporting from Photoshop, you'll have more control in cleaning up your bitmap prior to export. Also, using limited color palette during export will eliminate gradations that create blurry edges.

Vote Up Vote Down