gukbap-tools

カラーコード変換

HEX・RGB・HSL をワンクリックで相互変換

HEX(#3b82f6, #f00)、RGB(rgb(59,130,246))、HSL(hsl(217,91%,60%)) — どの形式でも認識します。

#3b82f6

HEX

#3b82f6

RGB

rgb(59, 130, 246)

HSL

hsl(217, 91%, 60%)

このカラーを文字に使ったときのコントラスト比 (WCAG)

あいうAg

白背景 · 3.68 · AA(大きい文字)

あいうAg

黒背景 · 5.71 · AA

AA は 4.5:1、AAA は 7:1 以上で合格です(標準テキスト基準)。

※ 整数 HSL への変換時、四捨五入によりごくわずかな誤差が生じることがあります。すべての処理はブラウザ内のみで行われます。

使い方

  1. HEX・RGB・HSL など任意の形式でカラーコードを入力するか、カラーピッカーで色を選びます。
  2. 入力と同時に HEX・RGB・HSL の各形式に変換された値が表示されます。
  3. コントラスト比(WCAG)も自動で計算され、白背景・黒背景での可読性をすぐに確認できます。

よくある質問

Q. どのカラー形式に対応していますか?
A. HEX(#3b82f6)、RGB(rgb(59,130,246))、HSL(hsl(217,91%,60%)) の入力に対応しています。透明度を含む RGBA・HSLA 形式にも対応しています。
Q. WCAG のコントラスト比はどう判定されますか?
A. AA は 4.5:1、AAA は 7:1 以上で合格です(標準テキスト基準)。白背景・黒背景の両方でのコントラスト比を即座に確認できます。
Q. 入力した色データはサーバーに送信されますか?
A. いいえ。すべての処理はブラウザ内のみで行われ、サーバーには送信されません。

この情報に誤りがありますか? お知らせください