ColorTool
ログイン
#CA278E

#ca278e ≈ Medium Violet Red

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

#ca278eはローズ系の色です（明度：中程度、彩度：高め）。 RGBでは赤79.22%、緑15.29%、青55.69%で構成され、CMYK印刷ではシアン0%、マゼンタ80.69%、イエロー29.7%、ブラック20.78%を使います。 HSLでは色相角322.09°、彩度67.63%、明度47.25%です。 暖色と寒色の中間で、ロマンス、遊び心、愛情を連想させることが多い色です。 デザインでは主に食品ブランドやレストラン、セールやキャンペーン、ブランドのアクセントに使われます。 この色の上に白の文字を置くとコントラスト比は5.01:1（WCAG AA）です。 最も近い色名はMedium Violet Red（#c71585）で、ΔEは2.32です。

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

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

補色

  1. #ca278e
  2. #27ca63

分裂補色

  1. #ca278e
  2. #3cca27
  3. #27cab4

類似色

  1. #b427ca
  2. #ca278e
  3. #ca273c

トライアド

  1. #ca278e
  2. #8eca27
  3. #278eca

テトラード

  1. #ca278e
  2. #ca6327
  3. #27ca63
  4. #278eca

スクエア

  1. #ca278e
  2. #cab427
  3. #27ca63
  4. #273cca

モノクロマティック

  1. #4a0e34
  2. #8a1b61
  3. #ca278e
  4. #e05eb0
  5. #ec9ecf

シェード

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

  1. #ca278e
  2. #b62380
  3. #a21f72
  4. #8d1b63
  5. #791755
  6. #651447
  7. #511039
  8. #3d0c2b
  9. #28081c
  10. #14040e
  11. #000000

ティント

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

  1. #ca278e
  2. #cf3d99
  3. #d552a5
  4. #da68b0
  5. #df7dbb
  6. #e593c7
  7. #eaa9d2
  8. #efbedd
  9. #f4d4e8
  10. #fae9f4
  11. #ffffff

トーン

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

  1. #ca278e
  2. #c3308d
  3. #bb398b
  4. #b4428a
  5. #ac4b88
  6. #a55487
  7. #9e5c86
  8. #966584
  9. #8f6e83
  10. #877781
  11. #808080

読みやすい文字 5.01:1 AA ✓ AA Large ✓ AAA ✕ AAA Large ✓
読みやすい文字 4.19:1 AA ✕ AA Large ✓ AAA ✕ AAA Large ✕

1色覚（全色盲） #6f6f6f 男性の約0.003%
不完全1色覚 #9c5b7d 男性の約0.001%
1型2色覚（P型） #435d91 男性の約1.01%
2型2色覚（D型） #73798a 男性の約1.27%
3型2色覚（T型） #d91d59 男性の約0.0001%
1型3色覚（P型弱） #8e4d90 男性の約1.08%
2型3色覚（D型弱） #9e628c 男性の約4.63%
3型3色覚（T型弱） #d32272 男性の約0.0002%
自分の画像でシミュレーション

この色の文字

この色の背景

この色の枠線

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

#c71585 Medium Violet Red ΔE 2.32 #c54b8c Mulberry ΔE 5.42 #cf3476 Telemagenta ΔE 6.91 #d71868 Dogwood Rose ΔE 9.63 #ff1493 Deep Pink ΔE 10.79 #fe28a2 Persian Rose ΔE 10.93 #a50b5e Jazzberry Jam ΔE 11.12 #35d871 反転色 #6f6f6f グレースケール 

Medium Violet Red
#ca278e  rgb(202, 39, 142)  hsl(322, 68%, 47%)  Medium Violet Red
#27ca63  rgb(39, 202, 99)  hsl(142, 68%, 47%)  Emerald
#8eca27  rgb(142, 202, 39)  hsl(82, 68%, 47%)  Yellow Green
#278eca  rgb(39, 142, 202)  hsl(202, 68%, 47%)  Steel Blue