モダン CSS カラー
OKLCH 変換ツール - HEX・RGB・HSL を OKLCH に
HEX・RGB・HSL の色を OKLCH に変換し、モダンな CSS カラー構文を HEX、RGB、HSL、HSV の値と一緒にコピーできます。
明度
0.62
彩度 (Chroma)
0.188
色相
260
カラー形式
使い方
おなじみのカラー値を貼り付けると、OKLCH の明度・彩度・色相が分かります。明度の変化を予測しやすくしたいときや、モダンな CSS カラートークンを作りたいときに。
- 1 HEX、RGB、HSL のいずれかで色を入力します。
- 2 OKLCH の明度・彩度・色相を確認します。
- 3 CSS の oklch() 値をコピーするか、従来の形式と比較します。
よくある質問
OKLCH は何を表しますか？
知覚的な明度、彩度（Chroma）、色相を表すため、多くの調整が HSL よりも均一に感じられます。
RGB や HSL を貼り付けられますか？
はい。HEX、RGB/RGBA、HSL/HSLA の入力に対応し、OKLCH に変換します。
すべての HEX を OKLCH に置き換えるべき？
必ずしもそうではありません。HEX はコンパクトで広く理解されています。OKLCH は生成スケールや予測しやすい明度調整に最も役立ちます。
OKLCH で透明度を扱えますか？
CSS の oklch() にはアルファを含められます。入力に透明度がある場合、このツールはアルファを保持します。