compass-magick: Extend Sass with power of ImageMagick

Compass delivers powerful features on top of Sass including support for CSS3 and image sprites. With Compass-Magick, Stan Angeloff pushes the envelope a bit and adds the power of ImageMagick (via RMagick), allowing you to create images for your stylesheets on the fly:

background: transparent magick-image('nav.png', 940px, 50px,
  magick-erase(blue),
  magick-linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0)),
  magick-top-left-corner(10px),
  magick-top-right-corner(10px)
);

In this example, the magick-image function creates an image with filename nav.png with a linear white gradient over blue background with top rounded corners. If a filename is not specified, the image is embedded directly into the stylesheet with data-uri.

Compass-Magick is a nifty way to dynamically create images to serve up for older browsers that do not support CSS3 rounded corners and gradients. Check out the Readme for a full list of functions and usage options.

[Source on GitHub]