1つの色の3つの書き方
| HEX | #2563D9 |
| RGB | rgb(37, 99, 217) |
| HSL | hsl(219, 71%, 50%) |
3つとも同じ青です。画面はすべての色を赤・緑・青の光の混ぜ具合で作っていて、それぞれの形式はその量を別の書き方で表しています。
RGBとHEX
RGBは赤・緑・青をそれぞれ0〜255で表します。HEXは同じ3つの数を16進数で2桁ずつ書いたもので、25は37、63は99、D9は217です。#FFFのような短縮形は各桁を2回繰り返したもの(#FFFFFF、白)で、4組目を付けると透明度を表せます(#2563D980はおよそ半透明)。
HSL
HSLは人の感覚に近い表し方です。色相は色相環上の角度(0が赤、120が緑、240が青)、彩度は色の鮮やかさ、明度は0%の黒から100%の白までです。色相と彩度をそのままに明度だけ変えれば、明るい色や暗い色を簡単に作れます。
CMYKは印刷用
プリンターは光ではなく、シアン、マゼンタ、イエロー、ブラックのインクを混ぜます。画面とインクで表現できる色の範囲はまったく同じではないため、RGBとCMYKの変換は近似になります。
文字のコントラスト
アクセシビリティのガイドラインWCAGのレベルAAでは、通常の文字で4.5:1以上、大きな文字で3:1以上のコントラストが求められます。カラーコード変換はこれらの形式を相互に変換し、白と黒の文字とのコントラストも確認できます。写真やスクリーンショットの色のコードを調べるには画像から色を抽出を使いましょう。