ColorTool
ログイン
#D62DAD

#d62dad ≈ Shocking Pink

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

#d62dadはマゼンタ系の色です（明度：中程度、彩度：高め）。 RGBでは赤83.92%、緑17.65%、青67.84%で構成され、CMYK印刷ではシアン0%、マゼンタ78.97%、イエロー19.16%、ブラック16.08%を使います。 HSLでは色相角314.56°、彩度67.33%、明度50.78%です。 暖色と寒色の中間で、創造性、大胆さ、個性を連想させることが多い色です。 デザインでは主に美容・コスメ、クリエイティブスタジオ、ブランドのアクセントに使われます。 この色の上に黒の文字を置くとコントラスト比は4.84:1（WCAG AA）です。 最も近い色名はShocking Pink（#fc0fc0）で、ΔEは6.63です。

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

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

補色

  1. #d62dad
  2. #2dd656

分裂補色

  1. #d62dad
  2. #58d62d
  3. #2dd6ab

類似色

  1. #ab2dd6
  2. #d62dad
  3. #d62d58

トライアド

  1. #d62dad
  2. #add62d
  3. #2dadd6

テトラード

  1. #d62dad
  2. #d6562d
  3. #2dd656
  4. #2dadd6

スクエア

  1. #d62dad
  2. #d6ab2d
  3. #2dd656
  4. #2d58d6

モノクロマティック

  1. #591147
  2. #991e7b
  3. #d62dad
  4. #e26dc6
  5. #efaddf

シェード

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

  1. #d62dad
  2. #c1299c
  3. #ab248a
  4. #962079
  5. #801b68
  6. #6b1757
  7. #561245
  8. #400e34
  9. #2b0923
  10. #150511
  11. #000000

ティント

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

  1. #d62dad
  2. #da42b5
  3. #de57bd
  4. #e26cc6
  5. #e681ce
  6. #eb96d6
  7. #efabde
  8. #f3c0e6
  9. #f7d5ef
  10. #fbeaf7
  11. #ffffff

トーン

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

  1. #d62dad
  2. #cd35a9
  3. #c53ea4
  4. #bc46a0
  5. #b44e9b
  6. #ab5797
  7. #a25f92
  8. #9a678e
  9. #916f89
  10. #897885
  11. #808080

読みやすい文字 4.34:1 AA ✕ AA Large ✓ AAA ✕ AAA Large ✕
読みやすい文字 4.84:1 AA ✓ AA Large ✓ AAA ✕ AAA Large ✓

1色覚（全色盲） #797979 男性の約0.003%
不完全1色覚 #a76391 男性の約0.001%
1型2色覚（P型） #3b68b0 男性の約1.01%
2型2色覚（D型） #7483a9 男性の約1.27%
3型2色覚（T型） #e3336b 男性の約0.0001%
1型3色覚（P型弱） #9456af 男性の約1.08%
2型3色覚（D型弱） #a46bab 男性の約4.63%
3型3色覚（T型弱） #de318a 男性の約0.0002%
自分の画像でシミュレーション

この色の文字

この色の背景

この色の枠線

文字色
.text-d62dad {
  color: #d62dad;
}
背景色
.bg-d62dad {
  background-color: #d62dad;
  color: #000000;
}
枠線
.border-d62dad {
  border: 2px solid #d62dad;
}
CSS変数
:root {
  --color-primary: #d62dad;
  --color-primary-rgb: 214 45 173;
  --color-primary-hsl: 315 67% 51%;
}
グラデーション
.gradient-d62dad {
  background: linear-gradient(135deg, #d62dad, #d62d58);
}
色付きの影
.shadow-d62dad {
  box-shadow: 0 8px 24px rgb(214 45 173 / 0.35);
}

#fc0fc0 Shocking Pink ΔE 6.63 #c54b8c Mulberry ΔE 7.67 #c71585 Medium Violet Red ΔE 7.91 #fe28a2 Persian Rose ΔE 9.09 #ba55d3 Medium Orchid ΔE 9.74 #ff1493 Deep Pink ΔE 10.43 #ff43a4 Wild Strawberry ΔE 11.12 #29d252 反転色 #797979 グレースケール 

Shocking Pink
#d62dad  rgb(214, 45, 173)  hsl(315, 67%, 51%)  Shocking Pink
#2dd656  rgb(45, 214, 86)  hsl(135, 67%, 51%)  Malachite
#add62d  rgb(173, 214, 45)  hsl(75, 67%, 51%)  Yellow Green
#2dadd6  rgb(45, 173, 214)  hsl(195, 67%, 51%)  Moonstone Blue