ColorTool
ログイン
#424488

#424488 ≈ Dark Slate Blue

  • 青
  • 明度: 低い
  • 彩度: 中程度
  • 寒色
コントラストを確認 グラフで探索 ランダムな色

#424488は青系の色です（明度：低い、彩度：中程度）。 RGBでは赤25.88%、緑26.67%、青53.33%で構成され、CMYK印刷ではシアン51.47%、マゼンタ50%、イエロー0%、ブラック46.67%を使います。 HSLでは色相角238.29°、彩度34.65%、明度39.61%です。 寒色で、信頼、安定、集中を連想させることが多い色です。 デザインでは主にテクノロジー製品、金融・銀行、ブランドのアクセントに使われます。 この色の上に白の文字を置くとコントラスト比は8.7:1（WCAG AAA）です。 最も近い色名はDark Slate Blue（#483d8b）で、ΔEは3.28です。

この色の測定値から自動生成した説明です。

HEX
RGB
RGB（%）
CMY
CMYK
HSL
HSV / HSB
Webセーフ#333399
CIE-LAB
XYZ
xyY
CIE-LCH
CIE-LUV
Hunter-Lab
OKLab
2進数
10進数
相対輝度0.0707

補色

  1. #424488
  2. #888642

分裂補色

  1. #424488
  2. #886342
  3. #678842

類似色

  1. #426788
  2. #424488
  3. #634288

トライアド

  1. #424488
  2. #884244
  3. #448842

テトラード

  1. #424488
  2. #864288
  3. #888642
  4. #448842

スクエア

  1. #424488
  2. #884267
  3. #888642
  4. #428863

モノクロマティック

  1. #101021
  2. #292a55
  3. #424488
  4. #6365b3
  5. #9798cc

シェード

#424488に黒を段階的に混ぜた色です。

  1. #424488
  2. #3b3d7a
  3. #35366d
  4. #2e305f
  5. #282952
  6. #212244
  7. #1a1b36
  8. #141429
  9. #0d0e1b
  10. #07070e
  11. #000000

ティント

#424488に白を段階的に混ぜた色です。

  1. #424488
  2. #555794
  3. #6869a0
  4. #7b7cac
  5. #8e8fb8
  6. #a1a2c4
  7. #b3b4cf
  8. #c6c7db
  9. #d9dae7
  10. #ececf3
  11. #ffffff

トーン

#424488にグレーを段階的に混ぜた色です。

  1. #424488
  2. #484a87
  3. #4e5086
  4. #555686
  5. #5b5c85
  6. #616284
  7. #676883
  8. #6d6e82
  9. #747482
  10. #7a7a81
  11. #808080

読みやすい文字 8.7:1 AA ✓ AA Large ✓ AAA ✓ AAA Large ✓
読みやすい文字 2.41:1 AA ✕ AA Large ✕ AAA ✕ AAA Large ✕

1色覚（全色盲） #4b4b4b 男性の約0.003%
不完全1色覚 #484869 男性の約0.001%
1型2色覚（P型） #254e8a 男性の約1.01%
2型2色覚（D型） #1f4987 男性の約1.27%
3型2色覚（T型） #27535f 男性の約0.0001%
1型3色覚（P型弱） #334a89 男性の約1.08%
2型3色覚（D型弱） #304787 男性の約4.63%
3型3色覚（T型弱） #344d72 男性の約0.0002%
自分の画像でシミュレーション

この色の文字

この色の背景

この色の枠線

文字色
.text-424488 {
  color: #424488;
}
背景色
.bg-424488 {
  background-color: #424488;
  color: #ffffff;
}
枠線
.border-424488 {
  border: 2px solid #424488;
}
CSS変数
:root {
  --color-primary: #424488;
  --color-primary-rgb: 66 68 136;
  --color-primary-hsl: 238 35% 40%;
}
グラデーション
.gradient-424488 {
  background: linear-gradient(135deg, #424488, #634288);
}
色付きの影
.shadow-424488 {
  box-shadow: 0 8px 24px rgb(66 68 136 / 0.35);
}

#483d8b Dark Slate Blue ΔE 3.28 #4f42b5 Ocean Blue ΔE 7.86 #003399 Smalt ΔE 8.25 #1034a6 Egyptian Blue ΔE 8.44 #0047ab Cobalt Blue ΔE 8.53 #1c39bb Persian Blue ΔE 9.29 #0f4d92 Yale Blue ΔE 9.48 #bdbb77 反転色 #4b4b4b グレースケール 

Dark Slate Blue
#424488  rgb(66, 68, 136)  hsl(238, 35%, 40%)  Dark Slate Blue
#888642  rgb(136, 134, 66)  hsl(58, 35%, 40%)  Olive
#884244  rgb(136, 66, 68)  hsl(358, 35%, 40%)  Cordovan
#448842  rgb(68, 136, 66)  hsl(118, 35%, 40%)  Forest Green