カラーコード変換
HEX・RGB・HSL・HSV・OKLCH・CMYK を相互変換
- ファイルは端末の外に出ません
- ブラウザ内で処理
- 無料・登録不要・透かしなし
#FF8000oklch(73.19% 0.1858 52.98)
最も近い CSS カラー名
darkorangeΔE 3.9
形式
Lab と LCH は CSS の lab()・lch() と同じ D50 白色点を使います。 この CMYK は ICC プロファイルを使わない単純な計算値です。正確な値は印刷所に確認してください。
ティントとシェード
スウォッチをクリックすると HEX をコピーします。OKLab で白・黒と混ぜるので段階が均等に見えます。
カラーコード変換の使い方
HEX、RGB、HSL、HSV、HWB、OKLCH、OKLab、CIE Lab/LCH、CMYK、Display P3 の間で色を変換。どの形式を編集しても他が連動し、近い CSS カラー名や明暗の段階も表示します。
- 1
「任意の色を貼り付けまたは入力」に、#ff8000、rgb(255 128 0)、oklch(70% 0.19 50)、tomato などを入力します。
- 2
「カラーピッカーを開く」「画面から取得」「ランダムな色」から始めることもできます。
- 3
「形式」で値を確認・編集します。どの欄を変えても、ほかの欄がすべて更新されます。
- 4
「不透明度」スライダーで透明度を設定し、rgb(255 128 0 / 50%) のような空白区切りにしたいときは「モダン CSS 構文」をオンにします。
- 5
各形式の横のコピーアイコンを押すか、「ティントとシェード」の色をクリックして HEX をコピーします。
よくある質問
「sRGB の範囲外」と表示されるのはなぜですか？
OKLCH、Lab、Display P3 では、多くの画面で表示できない色も表せます。その場合 HEX・RGB・HSL などの sRGB 形式には、CSS の色域マッピングで明度と色相を保った最も近い表示可能色が入り、単純に切り詰めた場合の色も注記に示されます。
CMYK の値はそのまま印刷に使えますか？
使えません。ここでの CMYK は ICC プロファイルを使わない単純な計算式です。正確な値は印刷所に確認してください。
Lab と LCH の白色点は何ですか？
CSS の lab() と lch() と同じ D50 です。値をそのままスタイルシートに貼り付けられます。
「画面から取得」ボタンが表示されないのはなぜですか？
ブラウザの EyeDropper API を使っており、Chrome や Edge など Chromium 系ブラウザで利用できます。対応していない環境ではボタンが非表示になるので、カラーピッカーを使うか値を貼り付けてください。
何かデータは保存されますか？
最後に使った色と「モダン CSS 構文」の設定がブラウザのローカルストレージに保存され、次回も引き継がれます。サーバーには送信されません。