HEX · RGB · HSL · HSV · CMYK

RGB・HEX色変換とコントラストチェッカー

HEX、RGB、HSL、HSV、CMYKを相互変換し、透明度、WCAGコントラスト、配色を確認してCSSコードをコピーできます。

HEX · RGB · HSL · HSV · CMYK · WCAG

RGB・HEX カラースタジオとコントラスト確認

HEX、RGB、HSL、HSV、CMYKを相互変換し、透明度、WCAGコントラスト、配色を確認してCSSコードをコピーできます。

現在の色

#FF6347
最も近い一般的なCSSカラー: tomato

RGBAチャンネル

カラーモデル

HSL

HSV

CMYK

カラー形式

UIライブプレビュー

ライト

ボタンのプレビュー

選択した色で文字の読みやすさを確認できます。

ダーク

ボタンのプレビュー

選択した色で文字の読みやすさを確認できます。

アクセシビリティとコントラスト

2.95:1
最適な文字色: #000000

選択した色で文字の読みやすさを確認できます。

色の調和

最近の色

カラー情報

相対輝度0.00
知覚的な明るさ0%
最も近い一般的なCSSカラーtomato

画面と印刷では色が異なる場合があります。このツールはsRGBで計算します。

RGB値はどのようにHEXへ変換されますか?

0~255の各チャンネルを2桁の16進数に変え、赤・緑・青を並べて#RRGGBBを作ります。

アルファ値とは何ですか?

アルファは完全な透明から不透明までを表します。8桁HEXでは最後の2桁に保存されます。

公開前にアクセシビリティを確認

WCAGの結果は文字でも表示します。AAには通常テキストで4.5:1、大きなテキストで3:1が必要です。

計算式

HEX = #RR GG BB [AA]q = ⌊x ÷ 16⌋ · r = x − 16q255 = 16 × 15 + 15 → FFコントラスト比 = (Lₘₐₓ + 0.05) ÷ (Lₘᵢₙ + 0.05)
W3C · HEX · アルファ付きW3C · WCAG · コントラスト比色と履歴はブラウザー内に保存されます。

RGB・HEX変換のよくある質問

RGB値はどのようにHEXへ変換されますか?

0~255の各チャンネルを2桁の16進数に変え、赤・緑・青を並べて#RRGGBBを作ります。

アルファ値とは何ですか?

アルファは完全な透明から不透明までを表します。8桁HEXでは最後の2桁に保存されます。

アクセシブルなパレットにするには?

文字と背景のコントラストを確認し、色だけに頼らず、操作状態もテストしてください。

印刷した色が画面と異なるのはなぜですか?

画面はRGBの光を出し、プリンターはインクを混ぜます。用紙、カラープロファイル、調整状態でも結果が変わります。