color()
Experimental: これは実験的な機能です。
本番で使用する前にブラウザー互換性一覧表をチェックしてください。
関数記法 color()
により、他のほとんどの色関数が暗黙に処理する sRGB 色空間ではなく、特定の指定した色空間で色を指定することができます。
特定の色空間に対応しているかどうかは、CSS メディア特性の color-gamut
で検出することができます。
CSS アットルールの @color-profile
では、 color()
関数で色を指定するために使用する色プロファイルを定義し、名前を付けるために使用することができます。
構文
css
color(display-p3 1 0.5 0);
color(display-p3 1 0.5 0 / .5);
値
- 関数記法:
color( [ [<ident> | <dashed-ident>]? [ <number-percentage>+ | <string> ] [ / <alpha-value> ]? ] )
-
[<ident> | <dashed-ident>]
はオプションで、色空間を示す<ident>
または<dashed-ident>
(en-US) で す。もしこれが<ident>
であれば、定義済みの色空間の 1 つ(display-p3 など)を示します。もしこれが <dashed-ident> であれば、@color-profile
ルールで定義された、カスタム色空間であることを意味します。[ <number-percentage>+ | <string> ]
は、色空間が受け取る引数の値を提供する 1 つ以上の<number>
または<percentage>
値、または色空間が定義する色の名前を与える<string>
です。/ <alpha-value>
(アルファ)は<number>
で0
から1
の間、または<percentage>
で1
から100%
(完全に不透明)の間で、この色の透明度(またはアルファチャネル)を表します。
仕様書
Specification |
---|
CSS Color Module Level 4 # color-function |
ブラウザーの互換性
BCD tables only load in the browser