プロが選ぶグレージュの配色美学！失敗しない指定数値と活用術

今注目を集めている プロが選ぶグレージュの配色美学！失敗しない指定数値と活用術について、多角的な視点を整理して公開しています。

Webやアプリ制作でグレージュを扱う際、最大の難所は作業環境による色のズレだ。Adobe Colorで設計した繊細なパレットが、Figmaにペーストした瞬間、あるいはクライアントの一般的なオフィスモニターに映し出された途端に、泥水のような黄ばみを帯びて見える事故が後を絶たない。

原因の多くはsRGBとDisplay P3の色空間プロファイルのミスマッチにある。FigmaでUIを組む場合、グレージュのような中間トーンは必ずsRGBを基準に固定し、コントラストチェッカーでW3CのWCAG基準（文字と背景のコントラスト比4.5:1以上）を死守しなければならない。薄いペールグレージュ（#ECE8E1）を背景にするなら、テキストは純黒（#000000）を避け、ディープ・スモーキーグレージュ（#4A4643付近）までトーンを落とすことで、目に刺さらない極上の可読性が生まれる。