白と黒のちょうど中間の色です。ニュートラルでバランスがよく、ほかの色を引き立てます。補助的なテキストや定番の服、モダンなインテリアに使われます。
別名:灰色, グレイ
グレー(#808080)は、ニュートラル・中くらいの明るさ・ほぼ無彩色の色です。グレー系の色のグループに属します。RGBの値は赤128・緑128・青128(各255段階)。主な用途:ウェブ, インテリア, ファッション, ブランディング。
明るい色から暗い色の順に並んでいます。色をタップするとカラーコードをコピーできます。
色相環にもとづいた配色です。配色ハーモニーツールでさらに多くのパターンを試せます。
カラーコードをコピーするか、エディターで開いて自由に調整できます。
WCAG 2.1の基準にもとづいています。ほかの色の組み合わせはコントラストチェッカーで確認できます。
:root {
--gray: #808080;
--gray-rgb: 128, 128, 128;
}
.bg { background-color: var(--gray); }
.text { color: var(--gray); }グレーのHEXコードは#808080です。RGBではrgb(128, 128, 128)、HSLではhsl(0, 0%, 50%)、CMYKでは0, 0, 0, 50となります。
色相環で反対側にある補色は#808080で、グレーに近い色合いです。少量をアクセントとして使うと、強いコントラストが生まれます。
黒い文字のほうがおすすめです。白とのコントラスト比は3.9:1しかありませんが、黒とは5.3:1になります。
相性のよい色:白, 黒, 黄色, くすみピンク, ネイビー。青みのグレーと緑みのグレーのように、アンダートーンの違うグレー同士を混ぜるのは避けましょう。ちぐはぐに見えます。黄みの強いベージュとの組み合わせも、くすんで見えることがあります。