カラーピッカーと配色パレット

カラーコードの形式

読みやすい文字のためのコントラスト

Webアクセシビリティのガイドライン（WCAG）では、通常の文字には4.5:1以上（レベルAA）、レベルAAAでは7:1以上のコントラスト比が求められます。大きな文字なら3:1で足ります。このツールは白背景と黒背景それぞれでのコントラスト比を計算するので、文字色に使えるかすぐにわかります。

配色パレットを作る

• 濃淡：同じ色相を明るい色から暗い色まで。背景、枠線、ホバー時の色に。
• 補色：色相環で正反対の色。強いコントラストに。
• 類似色：となり合う色相。やわらかくまとまった配色に。
• トライアドとテトラード：色相環上に3色または4色を均等に配置。より豊かなパレットに。

パソコンでは、ブラウザが対応していれば、スポイトで画面上の好きな場所の色を取得できます。

よくある質問

HEXコードをRGBに変換するには？

HEXコードを入力欄に貼り付けるだけで、RGB・HSL・CMYKの値がすぐに表示されます。それぞれコピーボタン付きです。

読みやすい文字にはどのくらいのコントラストが必要ですか？

通常の文字なら文字と背景の間で4.5:1以上、大きな見出しなら3:1以上です。このツールで基準を満たしているか確認できます。

CMYKの値は印刷にそのまま使えますか？

あくまで参考値です。正確な変換は印刷会社のカラープロファイルによって変わります。忠実に仕上げたい場合は、プロファイルを問い合わせてください。