カラーパレット

スレートグレー

屋根材や昔の学校の黒板に使われた岩、スレートにちなんだ名前です。青をベースにした中間のグレーです。CSSではslategrayと呼ばれます。

別名：スレート, 粘板岩色

スレートグレー · #708090

スレートグレーの基本情報

スレートグレー（#708090）は、寒色系・中くらいの明るさ・くすみ系の色です。グレー系の色のグループに属します。RGBの値は赤112・緑128・青144（各255段階）。主な用途：インテリア, 建築, ウェブ。

スレートグレーの濃淡：明るいトーンと暗いトーン

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

スレートグレーの配色ハーモニー

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

補色近い色：ストーングレー
類似色近い色：スモークグレー
トライアド近い色：グレー, セージグリーン
スプリット・コンプリメンタリー近い色：モカ, ストーングレー
テトラード近い色：ライラック, ストーングレー, セージグリーン

スレートグレーを使ったカラーパレット

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

モノクロマティックパレット · スレートグレー
類似色パレット · スレートグレー
補色パレット · スレートグレー
トライアドパレット · スレートグレー
ニュートラルカラー入りパレット · スレートグレー
アクセントカラー入りパレット · スレートグレー

スレートグレーと文字色のコントラスト

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

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

CSSコード

:root {
  --slate-gray: #708090;
  --slate-gray-rgb: 112, 128, 144;
}
.bg { background-color: var(--slate-gray); }
.text { color: var(--slate-gray); }

スレートグレーに近い色

スチールグレー鉛色グレーブルーグレースモークグレーストーングレーダークグレースチールブルーグラファイトセルリアンブルー

この色を使ったテーマ別パレット

ウェブサイトのカラーパレットクリニック・診療所のカラーパレットアパレルショップのカラーパレット家の外壁のカラーパレットホームオフィスのカラーパレットビンテージなカラーパレット

その他のグレー系の色

グレーライトグレーダークグレーシルバーチャコールグレーアッシュグレーパールグレーオックスフォードグレーグラファイトトープスチールグレー鉛色スモークグレーストーングレープラチナブルーグレーグレージュ

よくある質問

スレートグレーのカラーコードは？

スレートグレーのHEXコードは#708090です。RGBではrgb(112, 128, 144)、HSLではhsl(210, 13%, 50%)、CMYKでは22, 11, 0, 44となります。

スレートグレーの補色は何色ですか？

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

スレートグレーの上に白い文字を置いても読みやすいですか？

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