画像
スクリーンショットを貼り付け(Ctrl+V)Windows は Win+Shift+S で範囲を選んでから Ctrl+V。画像のドロップ・クリックで選ぶこともできます
配色
画像を入れると、ここに色が並びます。
文字と背景のコントラスト
彩 Aa あ
この色の組み合わせで、文字が読めるかを確かめます(16px)。
大きな太字の見出し(18.66px 以上の太字)
小さな文字(12px)。細かい説明や注釈に使うなら、特に注意。
すべての組み合わせ(文字色 × 背景色)
◎ AAA(7:1 以上) ○ AA(4.5:1 以上) △ 大きな文字・図形だけ(3:1 以上) × 不足。マスを押すと、上の確認に入ります。
色覚の違いでの見え方
書き出し
使い方と、色が少しずれる理由
- スクリーンショットを貼り付けると、広い面積の色と、小さくても目立つ色(アクセント)を分けて取り出します。ベタ塗りの色は、混ざらずにそのままの値で出ます
- コントラスト比は WCAG 2.x の式です。表示は小数第 2 位の切り捨てで、4.499 を 4.50 とは見せません。基準を満たさない色には、明るさだけを動かした案を出します
- JPEG の画像は圧縮で、ディスプレイの色の設定(プロファイル)が違うときも、元の色から少しずれます。大切な色は、元のデザインデータや CSS で確かめてください
- 近い色の名前は、伝統色から選んだ目安です