ColorTool
ログイン
#213FA2

#213fa2 ≈ Egyptian Blue

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

#213fa2は青系の色です（明度：低い、彩度：高め）。 RGBでは赤12.94%、緑24.71%、青63.53%で構成され、CMYK印刷ではシアン79.63%、マゼンタ61.11%、イエロー0%、ブラック36.47%を使います。 HSLでは色相角226.05°、彩度66.15%、明度38.24%です。 寒色で、信頼、安定、集中を連想させることが多い色です。 デザインでは主にテクノロジー製品、金融・銀行、ブランドのアクセントに使われます。 この色の上に白の文字を置くとコントラスト比は9.14:1（WCAG AAA）です。 最も近い色名はEgyptian Blue（#1034a6）で、ΔEは3.43です。

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

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

補色

  1. #213fa2
  2. #a28421

分裂補色

  1. #213fa2
  2. #a24421
  3. #80a221

類似色

  1. #2180a2
  2. #213fa2
  3. #4421a2

トライアド

  1. #213fa2
  2. #a2213f
  3. #3fa221

テトラード

  1. #213fa2
  2. #8421a2
  3. #a28421
  4. #3fa221

スクエア

  1. #213fa2
  2. #a22180
  3. #a28421
  4. #21a244

モノクロマティック

  1. #070e23
  2. #142662
  3. #213fa2
  4. #395ed7
  5. #7891e4

シェード

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

  1. #213fa2
  2. #1e3992
  3. #1a3282
  4. #172c71
  5. #142661
  6. #112051
  7. #0d1941
  8. #0a1331
  9. #070d20
  10. #030610
  11. #000000

ティント

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

  1. #213fa2
  2. #3752ab
  3. #4d65b5
  4. #6479be
  5. #7a8cc7
  6. #909fd1
  7. #a6b2da
  8. #bcc5e3
  9. #d3d9ec
  10. #e9ecf6
  11. #ffffff

トーン

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

  1. #213fa2
  2. #2b469f
  3. #344c9b
  4. #3e5398
  5. #475994
  6. #516091
  7. #5a668e
  8. #646d8a
  9. #6d7387
  10. #777a83
  11. #808080

読みやすい文字 9.14:1 AA ✓ AA Large ✓ AAA ✓ AAA Large ✓
読みやすい文字 2.3:1 AA ✕ AA Large ✕ AAA ✕ AAA Large ✕

1色覚（全色盲） #484848 男性の約0.003%
不完全1色覚 #3c4577 男性の約0.001%
1型2色覚（P型） #004ea5 男性の約1.01%
2型2色覚（D型） #0042a0 男性の約1.27%
3型2色覚（T型） #00586a 男性の約0.0001%
1型3色覚（P型弱） #0049a4 男性の約1.08%
2型3色覚（D型弱） #0041a1 男性の約4.63%
3型3色覚（T型弱） #004f84 男性の約0.0002%
自分の画像でシミュレーション

この色の文字

この色の背景

この色の枠線

文字色
.text-213fa2 {
  color: #213fa2;
}
背景色
.bg-213fa2 {
  background-color: #213fa2;
  color: #ffffff;
}
枠線
.border-213fa2 {
  border: 2px solid #213fa2;
}
CSS変数
:root {
  --color-primary: #213fa2;
  --color-primary-rgb: 33 63 162;
  --color-primary-hsl: 226 66% 38%;
}
グラデーション
.gradient-213fa2 {
  background: linear-gradient(135deg, #213fa2, #4421a2);
}
色付きの影
.shadow-213fa2 {
  box-shadow: 0 8px 24px rgb(33 63 162 / 0.35);
}

#1034a6 Egyptian Blue ΔE 3.43 #0047ab Cobalt Blue ΔE 3.64 #003399 Smalt ΔE 3.77 #1c39bb Persian Blue ΔE 4.19 #4f42b5 Ocean Blue ΔE 6.92 #0f52ba Sapphire ΔE 6.94 #0f4d92 Yale Blue ΔE 7.12 #dec05d 反転色 #484848 グレースケール 

Egyptian Blue
#213fa2  rgb(33, 63, 162)  hsl(226, 66%, 38%)  Egyptian Blue
#a28421  rgb(162, 132, 33)  hsl(46, 66%, 38%)  Dark Goldenrod
#a2213f  rgb(162, 33, 63)  hsl(346, 66%, 38%)  Vivid Burgundy
#3fa221  rgb(63, 162, 33)  hsl(106, 66%, 38%)  Islamic Green