Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
pure ruby CSS Sprite generator
Ruby
branch: chunky

This branch is 14 commits behind master

Fetching latest commit…

Cannot retrieve the latest commit at this time

Failed to load latest commit information.
bin
examples
lib
spec
tasks
.gitignore
MIT-LICENSE
README.rdoc
Rakefile
VERSION
init.rb
spriter.gemspec

README.rdoc

CSS Spriter, a sprite generator

[ PNG, PNG, PNG ]  (°_°)
[ PNG, PNG, PNG ]  (° )
[ PNG, PNG, PNG ] )°)
[ PNG, PNG, )°)
[ PNG, )°)
[ )°)

 \(°_°)/ -> SPRITES!!!

Description

It takes your PNG's, chews them up and spits out sprites!

point bin/css-spriter at a directory, and watch it sprite away!

Installation - standalone

sudo gem install css-spriter

Usage - standalone

css-spriter <directory>

If you point the sprite command at a directory tree by default it will construct sprites for each of the sub directories and generate a single css to access all of the sprites which is placed in the root of the directory tree

For a full list of options:

css-spriter -h

Installation - Rails plugin

script/plugin install git://github.com/aberant/css-spriter.git

Usage - Rails plugin

Spittle assumes all of your sprites are located in the directory public/images/sprites. This directory should contain sub-directories for each sprite you wish to create. The css class names for an image in a sprite will take the form <directory_name>_<image_name>. Here is an example:

sprites /
  cars /
    ford.png
    chevy.png
  planes /
    boeing.png
    cesna.png

Running sprite:generate does all the work. Each sprite directory (cars, planes) will now contain a sprite.png. Spittle will also generate a sprites.css stylesheet in public/stylesheets/ that you should include in your layout. If you wished to use the ford image from the cars sprite you would give the 'cars_ford' class to the desired element in the view. That's it!

Check out examples/sprites if you want to see what spriter can do without doing any work.

Limitations

  • does not support color profiles (can cause a slight change in color from the source image)

  • does not support reading interlaced PNGs.

Features

  • automatically generates sprites from a set of PNG images

  • automatically generates css classes to access images within the sprite

  • customizable css templates

  • Rails plugin & rake tasks (sprite:generate & sprite:cleanup)

  • Supports varying dimensions in source images

  • Does not regenerate sprites that have not changed

  • Supports all PNG filter types to improve image compression

  • supports mixing RGB and RGBA color types

Roadmap - by priority

  • Reading interlaced images

  • allow a global css template override

  • allow per-sprite and global configuration

Authors

  • aberant - Colin Harris

  • tjennings - Tyler Jennings

Credits

  • thanks to mattpuchlerz for the socially acceptable project name

Something went wrong with that request. Please try again.