CSS Sprite Generator

An online tool to generate image sprite and css for your everyday need. CSS sprites allow you to combine multiple images into a single file to speed up your website by reducing HTTP requests.

 


CSS Sprites: What They Are, Why They’re Cool, and How To Use Them
An image sprite is a collection of images put together into a single image. A web page with many images can take a longer time to load and require more HTTP requests. Using image sprites will reduce the number of HTTP requests and save bandwidth.

Note : Drag & drop image files onto the space below, or use the “Open” link to load images using the file browser. Then, click “Generate” to create a sprite sheet and stylesheet. This demo uses a couple of HTML5 APIs, and it is only compatible with modern browsers.