カラーピッカー

好きな色を選んで HEX、RGB、HSL コード、明暗のバリエーション、文字のコントラストを取得。画像から色を拾うことも。何もアップロードされません。

白い文字 · 2.85:1 ✗

黒い文字 · 7.37:1 ✓ AA

明るい色と暗い色

画像から色を拾う

端末上で動作します。サーバーには何も送信されません。

使い方

カラーボックスを使うか HEX コードを入力します。RGB と HSL の値、明暗スケール、コントラスト判定がすぐに更新されます。必要な形式の「コピー」を押してください。

写真やスクリーンショットから色を拾うには、画像を選んでクリックします。画像は端末内に留まり、クリックしたピクセルから色を読み取ります。

コントラスト比とは？

選んだ色を白と黒の文字と比較します。アクセシビリティ指針では通常の文字に 4.5:1 以上が必要で、ここでは AA と表示されます。

HEX、RGB、HSL の違いは？

同じ色の別の表し方です。HEX はウェブ向けの短い形式、RGB は赤・緑・青を 0〜255 で表し、HSL は色相・彩度・明度で、目で調整しやすい形式です。