postcss-sass-color-functions

PostCSS plugin to transform SASS/compass color functions to more compatible CSS.

Inspired, and modified from, postcss-color-function.

Installation

$ npm install git://github.com/adam-h/postcss-sass-color-functions.git

Usage

// dependencies
var fs = require("fs")
var postcss = require("postcss")
var sassColorFunctions = require("postcss-sass-color-functions")
 
// css to be processed
var css = fs.readFileSync("input.css", "utf8")
 
// process css
var output = postcss()
  .use(sassColorFunctions())
  .process(css)
  .css

Using this input.css:

body {
  background-color: mix(#255073, #3c749e, 25%);
}
 

you will get:

body {
  background-color: rgb(54, 107, 147);
}

Checkout tests.js for examples.

Currently Supported functions

• mix(one, two, weight)
• rgba(color, alpha)
• darken(color, amount)
• lighten(color, amount)
• tint(color, amount)
• shade(color, amount)