Spriter: Easy CSS sprites

Posted on

CSS Sprites are really useful but tricky to maintain, so Craig Smith and I wrote a little Ruby gem to make it much easier to manage them.

Our CSS is now in .spriter files, and using a sprite is as easy as a normal CSS background image:

span.icon {
  -spriter-background: 'icon.png';
}

There's a Rack middleware that converts .spriter files to CSS and generates the sprite images on request which we use in development, and a few simple methods to create static assets that we use when deploying to production.

If you're interested you can read more on the Reevoo blog and used to be able to read more on the Reevoo blog, but whoever's in charge of it these days never read Cool URIs don't change, and the Internet Archive never got a copy. At least you can still get the code from GitHub.