PostCSS Color Summary

PostCSS plugin that extrat css colors and generate a summary file, which help you maintain your color palette.

Input

Style files be processed by postcss

a {
  color: red;
  color: aqua;
}
b {
  color: rgb(251, 0, 0);
}

Result

This plugin with generate a html file which summarize all css color used in your webapp.

Usage

Check you project for existed PostCSS config: postcss.config.js in the project root, "postcss" section in package.json or postcss in bundle config.

If you already use PostCSS, add the plugin to the end of your plugins list:

module.exports = {
  plugins: [
    require('autoprefixer')
+   require('postcss-color-summary'),
  ]
}

| Options | Usage | default value | | --------- | ----------------------------- | ---------------------------------- | | resultUrl | summary file output path | /src/css-color-summary.html | | threshold | similarity threshold, (0~100) | 3 |

If you do not use PostCSS, add it according to official docs and set this plugin in settings.