SpritePad: Easiest Way to Create your CSS Sprites

Posted on September 28, 2013, under Web Tools 

SpritePad is your free and easy-to-use web app for generating CSS spritemaps. It just needs seconds: Drag & drop your images onto the grid and have it instantly available as one PNG + CSS code. No messing in Photoshop, no manual assignment of CSS styles, no long-winded setups, SpritePad makes building spritemaps as easy as writing your next e-mail.

SpritePad is lightning fast

Optimized for speeeeed: No download, no setup, no long-winded uploads. SpritePad works hassle-free directly in your web browser, just drag & drop your images and you can right away work with them to create your exclusive CSS sprites.

Let SpritePad create the CSS for you

Each time you add a graphic, SpritePad produces a CSS code snippet. Move your images around, change options and let the CSS styles get updated immediately. You don’t need to work twice. CSS sprites the easy way.

Save even more time with automatic alignment

Sometimes creating the perfect sprite is similar to a jigsaw puzzle. That’s why we incorporated auto-alignment. Simply click on the button and all your images get aligned automatically, saving as much space as possible. Simply magic!

Work wherever and whenever you want

Download, load and save your CSS sprites anytime. SpritePad operates in every modern web browser. Sign up and store your CSS sprites as editable versions online within our cloud.

Collaborate with friends and colleagues

If you’re working with other people, it’s essential to share all resources within the team. Link your SpritePad account to as many folks as you like. Collaboration made simple.

As easy as writing emails

Rulers, guides, background grid, magnetic alignment, smart document fitting and more little helpers will enable you to easily create your CSS sprites.

Comment via Facebook


Leave a Reply

* = required fields

  (will not be published)

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Note: If you want to post CODE Snippets, please make them postable first!
(e.g. <br /> should be converted to &lt;br /&gt;)


  • The comment must be relevant with the topic of the post.
  • Only comments with real email addresses will get approved. So, emails like 'abc@domain.com' will not be accepted.
  • Do not post the same message in multiple articles through the site.
  • Do not post advertisements, junk mail or pyramid schemes.
  • In case you post a link to another site, please explain briefly where the link goes as a courtesy to other users.
  • Do not post comments such as: "Thank you", "Awesome", "Nice tutorial", "Merci", etc.