ColorTool
ログイン
#B52AE1

#b52ae1 ≈ Electric Purple

  • マゼンタ
  • 明度: 中程度
  • 彩度: 高め
  • 中間色
コントラストを確認 グラフで探索 ランダムな色

#b52ae1はマゼンタ系の色です（明度：中程度、彩度：高め）。 RGBでは赤70.98%、緑16.47%、青88.24%で構成され、CMYK印刷ではシアン19.56%、マゼンタ81.33%、イエロー0%、ブラック11.76%を使います。 HSLでは色相角285.57°、彩度75.31%、明度52.35%です。 暖色と寒色の中間で、創造性、大胆さ、個性を連想させることが多い色です。 デザインでは主に美容・コスメ、クリエイティブスタジオ、ブランドのアクセントに使われます。 この色の上に白の文字を置くとコントラスト比は4.79:1（WCAG AA）です。 最も近い色名はElectric Purple（#bf00ff）で、ΔEは3.75です。

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

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

補色

  1. #b52ae1
  2. #56e12a

分裂補色

  1. #b52ae1
  2. #b2e12a
  3. #2ae159

類似色

  1. #592ae1
  2. #b52ae1
  3. #e12ab2

トライアド

  1. #b52ae1
  2. #e1b52a
  3. #2ae1b5

テトラード

  1. #b52ae1
  2. #e12a56
  3. #56e12a
  4. #2ae1b5

スクエア

  1. #b52ae1
  2. #e1592a
  3. #56e12a
  4. #2ab2e1

モノクロマティック

  1. #4f0e64
  2. #8418a7
  3. #b52ae1
  4. #cc6dea
  5. #e4b0f4

シェード

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

  1. #b52ae1
  2. #a326cb
  3. #9122b4
  4. #7f1d9e
  5. #6d1987
  6. #5b1571
  7. #48115a
  8. #360d44
  9. #24082d
  10. #120417
  11. #000000

ティント

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

  1. #b52ae1
  2. #bc3fe4
  3. #c455e7
  4. #cb6aea
  5. #d37fed
  6. #da95f0
  7. #e1aaf3
  8. #e9bff6
  9. #f0d4f9
  10. #f8eafc
  11. #ffffff

トーン

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

  1. #b52ae1
  2. #b033d7
  3. #aa3bce
  4. #a544c4
  5. #a04cba
  6. #9b55b1
  7. #955ea7
  8. #90669d
  9. #8b6f93
  10. #85778a
  11. #808080

読みやすい文字 4.79:1 AA ✓ AA Large ✓ AAA ✕ AAA Large ✓
読みやすい文字 4.38:1 AA ✕ AA Large ✓ AAA ✕ AAA Large ✕

1色覚（全色盲） #727272 男性の約0.003%
不完全1色覚 #925eaa 男性の約0.001%
1型2色覚（P型） #006be6 男性の約1.01%
2型2色覚（D型） #2476dd 男性の約1.27%
3型2色覚（T型） #b25888 男性の約0.0001%
1型3色覚（P型弱） #6c58e4 男性の約1.08%
2型3色覚（D型弱） #7a60df 男性の約4.63%
3型3色覚（T型弱） #b349b3 男性の約0.0002%
自分の画像でシミュレーション

この色の文字

この色の背景

この色の枠線

文字色
.text-b52ae1 {
  color: #b52ae1;
}
背景色
.bg-b52ae1 {
  background-color: #b52ae1;
  color: #ffffff;
}
枠線
.border-b52ae1 {
  border: 2px solid #b52ae1;
}
CSS変数
:root {
  --color-primary: #b52ae1;
  --color-primary-rgb: 181 42 225;
  --color-primary-hsl: 286 75% 52%;
}
グラデーション
.gradient-b52ae1 {
  background: linear-gradient(135deg, #b52ae1, #e12ab2);
}
色付きの影
.shadow-b52ae1 {
  box-shadow: 0 8px 24px rgb(181 42 225 / 0.35);
}

#bf00ff Electric Purple ΔE 3.75 #9932cc Dark Orchid ΔE 5.36 #9f00ff Vivid Violet ΔE 6.27 #ba55d3 Medium Orchid ΔE 7.40 #8a2be2 Blue Violet ΔE 7.73 #9400d3 Dark Violet ΔE 8.25 #8f00ff Electric Violet ΔE 8.48 #4ad51e 反転色 #727272 グレースケール 

Electric Purple
#b52ae1  rgb(181, 42, 225)  hsl(286, 75%, 52%)  Electric Purple
#56e12a  rgb(86, 225, 42)  hsl(106, 75%, 52%)  Lime Green
#e1b52a  rgb(225, 181, 42)  hsl(46, 75%, 52%)  Meat Brown
#2ae1b5  rgb(42, 225, 181)  hsl(166, 75%, 52%)  Caribbean Green