Creating CSS Sprites Using The Artboard Tool In Adobe Illustrator

by Gene Cotton

When your source files are in Adobe Illustrator, using the Artboard Tool is a huge time-saver. Very simply, what you do is create an artboard for each graphic you want to place on the sprite image, and it doesn’t matter what size they are. The trick is that you create a master artboard in which each of the graphic artboards is placed and sized so they land next to each other, sized correctly, and ready for web deployment. For best results, do not include a divider between your images, but land them directly against each other.