This article contains resources and information to get you started with creating icons and illustrations with the right dimensions and artboard fit.

When creating vector art in Adobe Illustrator or another vector program, the artboard should be sized to fit the artwork in order to properly render the previews seen on Iconfinder. If your icon or illustration is very small on a large artboard, then its preview will be small relative to the background size. You can leave a few pixels of white space around your artwork as bounds, but only a few pixels are necessary.
​

For 3D icons, we recommend using an artboard size of 2000x2000.

For illustrations, we recommend an artboard of 1000x1000.

Always fit the icon / illustration to the artboard.

It is also important that the artwork is fully contained within the bounds of the artboard. If any part of the item is outside of the artboard edges, it will be cropped in the preview.
​

For best preview and raster image rendering, it is a best practice to always align the artboards to the pixel grid as seen below.
​

To help you out designing for specific devices, we have compiled a set of templates for Adobe illustrator, which are found at the end of the article.

iPad, iPhone, iPad mini
All of these uses 30/60 pixel icons
​Download 30x30.ai
​Download 60x60.ai

Samsung, HTC, LG, Sony, Others
All of these uses 24/48 pixel icons
​Download 24x24.ai

Download 48x48.ai

Websites, Web applications
Uses 8, 16, 24, 48, 64, 128, 256, 512px icons
​Download 8x8.ai
​Download 16x16.ai
​Download 24x24.ai
​Download 32x32.ai
​Download 48x48.ai
​Download 64x64.ai
​Download 128x128.ai
​Download 256x256.ai
​Download 512x512.ai

Nokia Lumia
Uses 62/62 pixel icons
​Download 62x62.ai

Download all files

The process/guides explained below is a work-in-progress. We're constantly refining the process and learning new tricks and experimenting with different approaches, combinations, and tweaking the grid.

You can use a 32 x 32 pixel grid but you don't have adhere exactly to the grid. if you feel like adhering to the grid to rigidly can hurt the aesthetic of the icon. So you can follow the grid more as a guide than a set rule. Going forward, you could be using two grids: 24 x 24 for Android, and 30 x 30 for iOS.

There are some odd ball icons that don't adhere to the grid at all. In some cases, you can abandon the grid if it doesn't work with a specific design. In other cases, the icons can be slightly larger than the grid for aesthetic reasons.

You can use three palettes for almost every icon: Pathfinder, Stroke, and Transform. Pathfinder is the most heavily used for joining and knocking out shapes. Use stroke in conjunction with the menu Object > Path > Outline Path. This allows you to quickly outline a shape, apply a stroke, outline the stroke in cases where you need to convert an outline to a vector area rather than a stroke. Transform contains the "Align to Pixel Grid" feature. This is especially useful for making icons pixel perfect, along with the View > Snap To Grid option. But, be careful with this one. Using "Align to Pixel Grid" on a curved vector can give you funky results.

Snap to Point - Snap to Grid - Smart Guides you should keep Snap to Point enabled at all times. You can alternate between Smart Guides and Snap to Grid. The latter two can confuse one another because illustrator can't figure out which one you want to apply when a point is close to an object with a similarly aligned point and close to a grid intersection or line.

You should try, as much as possible, to work with line weights that are multiples of two because the lines seem to scale better, both larger and smaller (it's easy math). But visually, you should use a combination of 2 pixel lines and 3 pixel lines. At 100% scale, 3 pixel lines render clearly provided that they are pixel perfect.
​