You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

2.5 KiB

PostCSS Color Hex Alpha PostCSS Logo

npm version CSS Standard Status Build Status Discord

PostCSS Color Hex Alpha lets you use 4 & 8 character hex color notation in CSS, following the CSS Color Module specification.

body {
	background: #9d9c;
}

/* becomes */

body {
	background: rgba(153,221,153,0.8);
}

Usage

Add PostCSS Color Hex Alpha to your project:

npm install postcss postcss-color-hex-alpha --save-dev

Use it as a PostCSS plugin:

const postcss = require('postcss');
const postcssColorHexAlpha = require('postcss-color-hex-alpha');

postcss([
	postcssColorHexAlpha(/* pluginOptions */)
]).process(YOUR_CSS /*, processOptions */);

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

Node PostCSS CLI Webpack Create React App Gulp Grunt

Options

preserve

The preserve option determines whether the original notation is preserved. By default, it is not preserved.

postcssColorHexAlpha({ preserve: true })
body {
	background: #9d9c;
}

/* becomes */

body {
	background: rgba(153,221,153,0.8);
	background: #9d9c;
}