スチールブルー

鋼に反射する光のような、灰みをベースにした中間の青です。CSSではsteelblueと呼ばれます。落ち着いた技術的な印象で、インターフェースや工業系のブランドに役立ちます。

別名：鋼色, スチール

スチールブルー · #4682B4

スチールブルーの基本情報

スチールブルー（#4682B4）は、寒色系・中くらいの明るさ・中くらいの彩度の色です。青系の色のグループに属します。RGBの値は赤70・緑130・青180（各255段階）。主な用途：ウェブ, 工業, ファッション。

明るい色から暗い色の順に並んでいます。色をタップするとカラーコードをコピーできます。

色相環にもとづいた配色です。配色ハーモニーツールでさらに多くのパターンを試せます。

補色近い色：銅色

スプリット・コンプリメンタリー近い色：インディアンレッド, オールドゴールド

カラーコードをコピーするか、エディターで開いて自由に調整できます。

モノクロマティックパレット · スチールブルー

類似色パレット · スチールブルー

補色パレット · スチールブルー

トライアドパレット · スチールブルー

ニュートラルカラー入りパレット · スチールブルー

アクセントカラー入りパレット · スチールブルー

白い文字コントラスト比 4.1:1 · AA（大きな文字）

黒い文字コントラスト比 5.1:1 · AA

WCAG 2.1の基準にもとづいています。ほかの色の組み合わせはコントラストチェッカーで確認できます。

:root {
  --steel-blue: #4682B4;
  --steel-blue-rgb: 70, 130, 180;
}
.bg { background-color: var(--steel-blue); }
.text { color: var(--steel-blue); }

スチールブルーのカラーコードは？

スチールブルーのHEXコードは#4682B4です。RGBではrgb(70, 130, 180)、HSLではhsl(207, 44%, 49%)、CMYKでは61, 28, 0, 29となります。

スチールブルーの補色は何色ですか？

色相環で反対側にある補色は#B47846で、銅色に近い色合いです。少量をアクセントとして使うと、強いコントラストが生まれます。

スチールブルーの上に白い文字を置いても読みやすいですか？

黒い文字のほうがおすすめです。白とのコントラスト比は4.1:1しかありませんが、黒とは5.1:1になります。