カラーコード変換
HEX、RGB、HSL、色名を貼り付けるだけで、すべての形式を一度に表示し、WCAGのコントラストも確認できます。
- お使いのデバイスで動作
- 会員登録不要
- 一度開けばオフラインでも使えます
—
#rgb、#rrggbb、#rrggbbaa、rgb()、rgba()、hsl()、hsla()、rebeccapurpleなどのCSS色名に対応しています。
HEX
—RGB
—HSL
—HSV
—CMYK （近似値）
—
明るい色と暗い色、タップでコピー
白
— ：1
- —
- —
- —
- —
黒
— ：1
- —
- —
- —
- —
選んだ背景
— ：1
- —
- —
- —
- —
各比率はWCAG 2.xに基づきます。大きな文字は24px以上、または18.66pxかつ太字です。合否は正確な比率で判定し、半透明の色は各背景に合成してから判定します。
カラーコードを変換する方法
- HEX、rgb()、hsl()、色名を入力するか、見本から色を選んでください。
- 5つの結果から必要な形式をコピーしてください。
- 白、黒、選んだ背景に対するコントラスト比と、AAまたはAAAの判定を確認してください。
よくある質問
CMYKの値が近似値なのはなぜですか？
CMYKは、印刷機のインク、用紙、カラープロファイルによって結果が変わります。このツールは単純な計算式で変換するため、これら3つは考慮されず、印刷された色は画面の色と異なる場合があります。大量に印刷する前に、印刷会社に校正刷りを依頼してください。
コントラスト比はどのように計算されますか？
WCAG 2.xでは、ガンマ補正後の赤・緑・青の値から各色の相対輝度を求めます。コントラスト比は、明るい方の相対輝度に0.05を加えた値を、暗い方の相対輝度に0.05を加えた値で割って求めます。黒と白の組み合わせは最大の21:1になります。
判定にはどの基準が使われますか？
WCAG 2.xでは、レベルAAで通常の文字に4.5:1以上、大きな文字に3:1以上を求めます。レベルAAAでは、それぞれ7:1と4.5:1以上が必要です。大きな文字とは、24px以上、または18.66pxかつ太字の文字を指します。
入力欄はどの色形式に対応していますか？
3桁、6桁、8桁のHEXコード、rgb()とrgba()、hsl()とhsla()、そしてrebeccapurpleなどのCSS色名に対応しています。ブラウザがCSSの色として解釈できる値であれば使えます。
レビュー
まだレビューはありません。最初のレビューを書いてみましょう。