ColorTool
ログイン
#342E57

#342e57 ≈ Oxford Blue

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

#342e57は青系の色です（明度：低い、彩度：低め）。 RGBでは赤20.39%、緑18.04%、青34.12%で構成され、CMYK印刷ではシアン40.23%、マゼンタ47.13%、イエロー0%、ブラック65.88%を使います。 HSLでは色相角248.78°、彩度30.83%、明度26.08%です。 寒色で、信頼、安定、集中を連想させることが多い色です。 デザインでは主にテクノロジー製品、金融・銀行、高級ブランドに使われます。 この色の上に白の文字を置くとコントラスト比は12.54:1（WCAG AAA）です。 最も近い色名はOxford Blue（#002147）で、ΔEは9.9です。

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

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

補色

  1. #342e57
  2. #51572e

分裂補色

  1. #342e57
  2. #57492e
  3. #3d572e

類似色

  1. #2e3d57
  2. #342e57
  3. #492e57

トライアド

  1. #342e57
  2. #57342e
  3. #2e5734

テトラード

  1. #342e57
  2. #572e51
  3. #51572e
  4. #2e5734

スクエア

  1. #342e57
  2. #572e3d
  3. #51572e
  4. #2e5749

モノクロマティック

  1. #08070d
  2. #161425
  3. #342e57
  4. #524889
  5. #776cb2

シェード

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

  1. #342e57
  2. #2f294e
  3. #2a2546
  4. #24203d
  5. #1f1c34
  6. #1a172c
  7. #151223
  8. #100e1a
  9. #0a0911
  10. #050509
  11. #000000

ティント

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

  1. #342e57
  2. #484368
  3. #5d5879
  4. #716d89
  5. #85829a
  6. #9a97ab
  7. #aeabbc
  8. #c2c0cd
  9. #d6d5dd
  10. #ebeaee
  11. #ffffff

トーン

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

  1. #342e57
  2. #3c365b
  3. #433e5f
  4. #4b4763
  5. #524f67
  6. #5a576c
  7. #625f70
  8. #696774
  9. #717078
  10. #78787c
  11. #808080

読みやすい文字 12.54:1 AA ✓ AA Large ✓ AAA ✓ AAA Large ✓
読みやすい文字 1.67:1 AA ✕ AA Large ✕ AAA ✕ AAA Large ✕

1色覚（全色盲） #343434 男性の約0.003%
不完全1色覚 #343144 男性の約0.001%
1型2色覚（P型） #203459 男性の約1.01%
2型2色覚（D型） #203356 男性の約1.27%
3型2色覚（T型） #2b363e 男性の約0.0001%
1型3色覚（P型弱） #293258 男性の約1.08%
2型3色覚（D型弱） #293156 男性の約4.63%
3型3色覚（T型弱） #2f3349 男性の約0.0002%
自分の画像でシミュレーション

この色の文字

この色の背景

この色の枠線

文字色
.text-342e57 {
  color: #342e57;
}
背景色
.bg-342e57 {
  background-color: #342e57;
  color: #ffffff;
}
枠線
.border-342e57 {
  border: 2px solid #342e57;
}
CSS変数
:root {
  --color-primary: #342e57;
  --color-primary-rgb: 52 46 87;
  --color-primary-hsl: 249 31% 26%;
}
グラデーション
.gradient-342e57 {
  background: linear-gradient(135deg, #342e57, #492e57);
}
色付きの影
.shadow-342e57 {
  box-shadow: 0 8px 24px rgb(52 46 87 / 0.35);
}

#002147 Oxford Blue ΔE 9.90 #483d8b Dark Slate Blue ΔE 10.39 #191970 Midnight Blue ΔE 10.92 #32127a Persian Indigo ΔE 12.36 #003153 Prussian Blue ΔE 12.79 #003399 Smalt ΔE 13.84 #6c3082 Eminence ΔE 13.98 #cbd1a8 反転色 #343434 グレースケール 

Oxford Blue
#342e57  rgb(52, 46, 87)  hsl(249, 31%, 26%)  Oxford Blue
#51572e  rgb(81, 87, 46)  hsl(69, 31%, 26%)  Army Green
#57342e  rgb(87, 52, 46)  hsl(9, 31%, 26%)  Caput Mortuum
#2e5734  rgb(46, 87, 52)  hsl(129, 31%, 26%)  Hunter Green