Draw pixel-aligned paths for web workflows


Information in this article is relevant to Illustrator CC 2015.x and earlier versions. Beginning with the CC 2017 release, Illustrator features more predictable and precise functionality to align art with the pixel grid. See Draw pixel-perfect art for details.

Pixel-aligned is an object level property, which enables an object to have its vertical and horizontal paths aligned to the pixel grid. This property remains with the object when the object is modified. Any vertical or horizontal path in the object gets aligned to pixel grid as long as the property is set for it.

Pixel aligned paths in Illustrator
An illustration showing pixel-aligned objects and objects that are not pixel-aligned

A. Object is not pixel-aligned B. Object is pixel-aligned 

Aligning new objects to pixel grid

The Align New Objects to Pixel Grid option is available in the Advanced section of the New Document dialog box.

This option is also available in the Transform panel menu (flyout menu) of the Transform panel.

Align New Objects to Pixel Grid option in the Transform panel menu
Align New Objects to Pixel Grid option in the Transform panel menu

If you enable this option, any new objects that you draw have the pixel-aligned property set by default. For new documents created using the web document profile, this option is enabled by default.

The crisp appearance of pixel-aligned strokes is maintained in the raster output at a resolution of 72-ppi only. For other resolutions, there is a high possibility of such strokes producing anti-aliased results.

Objects that are pixel-aligned, but do not have any straight vertical or horizontal segments, are not modified to align to the pixel grid. For example, because a rotated rectangle does not have straight vertical or horizontal segments, it is not nudged to produce crisp paths, when the pixel-aligned property is set for it.


The document level property and pixel-aligned status of each object are saved in the .ai file.

For more information on aligning symbols to pixel grid, see Aligning symbols to pixel grid.

Aligning existing objects to pixel grid

An object with the Align to Pixel Grid option selected, is nudged to align to pixel grid whenever it is modified. For example, if you move or transform a pixel-aligned object, the object is realigned to pixel grid according to its new coordinates.

To align an existing object to pixel grid, select the object and check the Align to Pixel Grid check box at the bottom on the Transform panel.

Align to Pixel Grid option in the Transform panel
Align to Pixel Grid option in the Transform panel

When you select this option, the vertical and horizontal segments of the paths of the object are nudged. As a result, the appearance of such segments always shows crisp strokes, for all stroke widths and all locations. Objects with this option selected, always have stroke widths in full integer values.

Bringing non-aligned objects into documents with the Align New Objects to Pixel Grid option enabled, does not automatically pixel-align such objects. To make such objects pixel-aligned, select the object and then select the Align to Pixel Grid option from the Transform panel. You cannot pixel-align objects such as rasters, raster effects, and text objects because such objects do not have real paths.

Selecting objects not aligned to pixel grid

Click Select > Object > Not Aligned to Pixel Grid to select the objects.

Aligning symbols to pixel grid

To create a pixel-aligned symbol, select the Align to Pixel Grid option from the Symbol Options dialog box. Symbols aligned to pixel grid remain aligned to the pixel grid at all locations of the artboard, in their actual size.


A scaled symbol may not produce crisp paths although it is pixel-aligned by property.

For more information on aligning to pixel grid, see Drawing pixel-aligned paths for web workflows.


If the Reset button in the Control panel is active, it implies that the symbol has been transformed and is not in its actual size.

Viewing the pixel grid

To view the pixel grid, zoom to 600% or higher in Pixel Preview mode.

To set the preferences for viewing pixel grid, click Preferences> Guides & Grid. Select the Show Pixel Grid (Above 600% Zoom) option if it is not already selected.

Saving selected slices

To save only selected slices from the artwork, click File > Save Selected Slices.

Anti-aliasing options

Text anti-aliasing

The Character panel in Illustrator provides the following text anti-aliasing options:

  • None

  • Sharp

  • Crisp

  • Strong

Text anti-aliasing
Text anti-aliasing options in the Character panel

You can set anti-aliasing options for each text frame. These text anti-aliasing attributes get saved as part of the document. These options are also supported for PDF, AIT, and EPS formats. Text anti-aliasing options can be exported to or imported from PSD.

While exporting to BMP, PNG, Targa, JPEG, or TIFF formats the following options are available in the anti-aliasing drop-down list: None, Art Optimized and Type Optimized.

  • Art optimized option produces raster for each of these formats in the same way as in earlier versions. However, text anti-aliasing options are not honored while rasterizing the artwork in this case.

  • Type optimized option honors the newly introduced anti-aliasing options for the text frames in the raster produced.

These options are also available in Save for Web dialog box.

Adobe logo

Sign in to your account