カラーコード変換
どんな形式で色を入力しても、ほかのすべての形式がすぐに表示され、そのままコピーできます。
このデバイス内で封印済み
ブラウザ内で動作します。何もアップロードされません。
封印済み
HEX、RGB、HSL、HWB、LAB、LCH、OKLCH、CMYK、または「tomato」のようなCSSの色名。
すべての形式
どの行を編集しても、ほかの行が連動します。
プレビュー
- 白とのコントラスト
- 黒とのコントラスト
- 最も近いCSS色名
この色は画面で表示できる範囲(sRGB)の外にあります。以下の値は、画面で表示できる最も近い色を使っています。
CMYKは印刷プロファイルを使わない簡易的な変換です。正確な値は印刷会社にご確認ください。
使い方
-
色を入力
どんな形式のカラーコードでも貼り付けるか、CSSの色名を入力するか、カラースウォッチで色を選びます。
-
すべての形式を確認
HEX、RGB、HSL、HWB、LAB、LCH、OKLCH、CMYKがすぐに更新されます。どの行も編集できます。
-
必要な値をコピー
ボタンで1つの値をコピーするか、メモやスタイルガイド用にすべての形式をまとめてコピーします。
よくある質問
HEXをRGBに変換するには?
HEXコードを # 付きでも # なしでも入力または貼り付けると、すぐにRGBの値が表示されます。HEXの2桁ずつが赤・緑・青の各チャンネルを表し、00~FFがRGBの0~255に対応します。
OKLCHとは何ですか? なぜ使うのですか?
OKLCHは、明度、彩度(鮮やかさ)、色相で色を表す形式で、人間の色の感じ方に沿っています。明度だけを変えても同じ色相に見えるため、色の濃淡やデザインシステムを作るのに最適です。最新のブラウザはCSSでOKLCHに対応しています。
CMYKの値はそのまま印刷に使えますか?
ICC印刷プロファイルを使わない計算上の変換なので、出発点としては役立ちますが、入稿用の値ではありません。印刷会社は用紙や印刷機に応じたプロファイルを使います。正確な値は印刷会社に確認するか、デザインソフトでそのプロファイルを使ってください。
色が調整されたと表示されるのはなぜですか?
OKLCH、LAB、LCHなどの形式は、標準的な画面(sRGB)で表示できるよりも鮮やかな色を表せます。HEXとRGBが有効な値になるよう、色相を保ったまま、表示できる最も近い色に置き換えています。
透明度にも対応していますか?
はい。#3442d980 や rgb(52 66 217 / 0.5) のようにアルファ値を持つ色は、透明度に対応するすべての形式でその値が保たれます。CMYKには透明度がないため、不透明な色として表示されます。
データはどこかに送信されますか?
いいえ。変換はすべてブラウザ内で行われます。入力した内容がアップロードや保存されることはありません。