what is a sprite?

CSS Sprites Generator v.0.0.2-alfa

Upload your images:

(note: please don't upload HUGE files, it's not the purpose of the sprites technique)

need more
± options »
Padding between elements: px
Border around the whole image: px
Align elements:
Background color: (, , )
results

download PNG view example HTML



Set the background of your parent element to:

.parent-element {
      background:url(result.png);
}

Then use these offsets to display each image: