PostCSS Opacity Percentage

Test Coverage Status Install size XO code style MIT license

PostCSS plugin to transform percentage-based opacity values to more compatible floating-point values.

Install

Using npm:

bash npm install --save-dev postcss postcss-opacity-percentage

Using yarn:

bash yarn add --dev postcss postcss-opacity-percentage

Example

css /* Input */ .foo { opacity: 45%; }

css /* Output */ .foo { opacity: 0.45; }

Usage

js postcss([ require('postcss-opacity-percentage'), ]);

See PostCSS documentation for examples for your environment.

postcss-preset-env

If you are using postcss-preset-env@>=7.3.0, you already have this plugin installed via this package.

Options

preserve

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

js // Keep the original notation postcss([ require('postcss-opacity-percentage')({preserve: true}), ]);

css /* Input */ .foo { opacity: 45%; }

css /* Output */ .foo { opacity: 0.45; opacity: 45%; }

License

MIT © Marc Görtz