Drawing a single pixel path in Illustrator
Trying to get crisp single pixel lines in Illustrator can be a frustrating affair. Particularly when you need to produce high fidelity design mock-ups for a client; even if they don’t notice, having slightly ‘fuzzy’ lines can be very irritating (or maybe that’s just me…)
Photoshop, of course, gives you that pixel level control naturally but if, like me, you enjoy the flexibility and power that Illustrator gives you when playing with colour palettes and changes of mind then there are a couple of tips that help keep things pixel perfect.
Starting with a new document
Make sure that you open the advanced section of the new document dialog and check “Align New Objects to Pixel Grid” – this should be on by default for the “Web” document profile. In general, once that’s done those single pixel lines seem to work out just fine.
Adding new objects in an existing document
If you are adding new objects, then you can also toggle the alignment on and off as needed.
Select Window->Transform to show the Transform panel. Then select the flyout menu in the top-right corner and check “Align New Objects to Pixel Grid”
Aligning existing objects
Select Window->Transform to show the Transform panel. The make sure all the options are showing by clicking the little up/down button next to the Transform tab.
You should now see an “Align to Pixel Grid” option. Select the object and check this – your object should snap to the pixel grid. You can even turn it off again for that object so any subsequent changes no longer apply the snapping.
This might help if you don’t want pixel snapping
One tip that can work for the occasional line is to apply an “offset” effect to the stroke (Effect->Path->Offset Path) and set “offset” to 0.5px. That should give you sharper lines, although they may well appear thicker as well of course.
Checking the output
Either select File->Save for Web… and zoom around; taking a look.
Select View->Pixel Preview and again zoom in to see where your lines are going.
Now, I wrote this… then I discovered the link to the help But, I felt the summary might still be of use so there it is.