CSS3

CSS関数

oklch()

[Edge]⛌？。→●、mdn

OKLch 色指定。

<percentage> | <number> | none 1個目の引数 ⤴

OKLCH 明度（“L”）を指定し、oklab() のそれと同じに解釈される。

明度が 0% の場合、その［色相、色度］両成分とも無力になる。

<SPAN style="color:oklch(40.101% 0.12332 21.555);">■テスト</SPAN>

■テスト

¶

<SPAN style="color:oklch(50% 0.5 0);">■テスト</SPAN>

■テスト

¶

<percentage> | <number> | none ⤴

色度（“C”）を与える。その有用な最小値は 0 である一方、その最大は理論的には上限はない（が、実施においては、0.5 を超過しない）。供された値が負な場合、算出値の時点で 0 に切り詰められる。

色度が 0% の場合、その色相成分は無力になる。

<hue> | none ⤴

3 個目の引数は色相（“H”）角度を与え、［hsl()／lch()］の <hue> 引数と同様に解釈されるが、角度は同じ仕方では対応付けられず、次のようになる：

0deg は正な a 軸（purplish red へ向かう）、
90deg は正な b 軸（mustard yellow へ向かう）、
180deg は負な a 軸（greenish cyan へ向かう）、
270deg は負な b 軸（sky blue へ向かう）

[ / [<alpha-value> | none] ]? ⤴

alpha 値。rgb() における <alpha-value> と同じに解釈される。

none ● ⤴

oklch(40.101% 0.12332 21.555);
oklch(59.686% 0.15619 49.7694);
oklch(65.125% 0.13138 104.097);

テスト