Last Updated: February 25, 2016
· yoeran

Compass RGBA fallback

Do you just love using rgba for backgrounds in CSS, but hate to make decent fallbacks for non-supportive browsers?


rgbapng is a Compass plugin for providing cross-browser* compatible RGBA support. It works by creating single pixel alpha-transparent PNGs on the fly for browsers that don't support RGBA. It uses the pure Ruby ChunkyPNG library resulting in hassle-free installation and deployment.

Install the gem:
gem install compass-rgbapng

Use the mixin to get a nice png fallback:
@include rgba-background( rgba(0,0,0,.75) );

The result:
background: url('/images/rgbapng/000000bf.png?1282127952'); background: rgba(0, 0, 0, 0.75);