Miss any of our Open RFC calls?Watch the recordings here! »

postcss-short-color

4.0.0 • Public • Published

PostCSS Short Color PostCSS

NPM Version Build Status Support Chat

PostCSS Short Color lets you define background-color within the color property in CSS.

header {
  color: #abccfc #212231;
}
 
/* becomes */
 
header {
  background-color: #212231;
  color: #abccfc;
}

Usage

Add PostCSS Short Color to your project:

npm install postcss-short-color --save-dev

Use PostCSS Short Color to process your CSS:

const postcssShortColor = require('postcss-short-color');
 
postcssShortColor.process(YOUR_CSS /*, processOptions, pluginOptions */);

Or use it as a PostCSS plugin:

const postcss = require('postcss');
const postcssShortColor = require('postcss-short-color');
 
postcss([
  postcssShortColor(/* pluginOptions */)
]).process(YOUR_CSS /*, processOptions */);

PostCSS Short Color runs in all Node environments, with special instructions for:

Node PostCSS CLI Webpack Create React App Gulp Grunt

Options

prefix

The prefix option defines a prefix required by properties being transformed. Wrapping dashes are automatically applied, so that x would transform -x-color.

postcssShortColor({ prefix: 'x' });
header {
  -x-color: #abccfc #212231;
}
 
/* becomes */
 
header {
  background-color: #212231;
  color: #abccfc;
}

skip

The skip option defines the skip token used to ignore portions of the shorthand.

postcssShortColor({ skip: '-' });
header {
  color: - #212231;
}
 
/* becomes */
 
header {
  background-color: #212231;
}

Install

npm i postcss-short-color

DownloadsWeekly Downloads

1,276

Version

4.0.0

License

CC0-1.0

Unpacked Size

20.2 kB

Total Files

8

Last publish

Collaborators

  • avatar