Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Use the gray() color function in CSS

License

NotificationsYou must be signed in to change notification settings

postcss/postcss-color-gray

Repository files navigation

NPM VersionCSS Standard StatusBuild StatusSupport Chat

PostCSS Gray lets you use thegray() color function in CSS, following the outdated version ofCSS Color Module Level 4 specification (05 November 2019).

⚠️gray() has been removed fromColor Module Level 4 specification.

body {background-color:gray(100);color:gray(0/90%);}/* becomes */body {background-color:rgb(255,255,255);color:rgba(0,0,0,.9);}

Usage

AddPostCSS Gray to your project:

npm install postcss postcss-color-gray --save-dev

UsePostCSS Gray to process your CSS:

importpostcssGrayfrom'postcss-color-gray';postcssGray.process(YOUR_CSS/*, processOptions, pluginOptions */);

Or use it as aPostCSS plugin:

importpostcssfrom'postcss';importpostcssGrayfrom'postcss-color-gray';postcss([postcssGray(/* pluginOptions */)]).process(YOUR_CSS/*, processOptions */);

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

NodeWebpackCreate React AppGulpGrunt

Options

preserve

Thepreserve option determines whether the originalgray() function shouldbe preserved or replaced. By default, thegray() function is replaced.

By settingpreserve totrue, the originalgray() function is preserved.

postcssGray({preserve:true});
body {background-color:gray(100);color:gray(0/90%);}/* becomes */body {background-color:gray(100);background-color:rgb(255,255,255);color:gray(0/90%);color:rgba(0,0,0,.9);}

[8]ページ先頭

©2009-2025 Movatter.jp