Combining multiple images into a single image is a good way to improve performance by reducing the number of http requests. But how do most webmasters manage their combined images?

Is there any software available that makes combining images into a single image easier? It would be nice to throw the software a set of images and have it combine them and then report on the X,Y,width,height offsets within the image.


You don't want to load all your images from sprites. It can slow your site down if the page that is loaded doesn't actually use the images. There is a clear balance of what needs to be on sprites and what doesn't.

What I recommend is:

  • Make sprites for images that appear on most pages.
  • Use a lazyload script to load other images when they are in focus.
  • Regular HTTP requests are also fairly light relative to the size of most image files. It's generally creating new connections that generates the most overhead per request. But if you enable persistent connections (which most browsers/clients do by default), it too shouldn't be a problem. Nov 6 '10 at 21:56
  • @Lese is exactly right.
    – Frank
    Nov 7 '10 at 2:47

FYI, they're called sprites and there's quite a few free ones available online.

  • the link searches for the terms "online sprite generator" - I'm pointing this out since it isn't humanly visible on this page. Nov 5 '10 at 15:15

Well, I use a GIMP script for taking care of that.


ImageMagick is a great image processing tool that can do this. It's command line only so isn't the easiest to use for non-programmers. For stitching images together, use the montage command:

montage -geometry +4+4 *.png

This won't generate the CSS for you, but unless you have more than 30 images that shouldn't be a problem.

There are many online tools that can do the CSS too, with class names based on the filenames. This one is very good.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.