ColorTool
ログイン
#8774E2

#8774e2 ≈ Medium Purple

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

#8774e2は紫系の色です（明度：高い、彩度：中程度）。 RGBでは赤52.94%、緑45.49%、青88.63%で構成され、CMYK印刷ではシアン40.27%、マゼンタ48.67%、イエロー0%、ブラック11.37%を使います。 HSLでは色相角250.36°、彩度65.48%、明度67.06%です。 寒色で、想像力、神秘性、高級感を連想させることが多い色です。 デザインでは主に美容・コスメ、クリエイティブスタジオ、ブランドのアクセントに使われます。 この色の上に黒の文字を置くとコントラスト比は5.63:1（WCAG AA）です。 最も近い色名はMedium Purple（#9370db）で、ΔEは3.34です。

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

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

補色

  1. #8774e2
  2. #cfe274

分裂補色

  1. #8774e2
  2. #e2be74
  3. #98e274

類似色

  1. #7498e2
  2. #8774e2
  3. #be74e2

トライアド

  1. #8774e2
  2. #e28774
  3. #74e287

テトラード

  1. #8774e2
  2. #e274cf
  3. #cfe274
  4. #74e287

スクエア

  1. #8774e2
  2. #e27498
  3. #cfe274
  4. #74e2be

モノクロマティック

  1. #36219c
  2. #5035d5
  3. #8774e2
  4. #beb3ef
  5. #f0eefb

シェード

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

  1. #8774e2
  2. #7a68cb
  3. #6c5db5
  4. #5f519e
  5. #514688
  6. #443a71
  7. #362e5a
  8. #292344
  9. #1b172d
  10. #0e0c17
  11. #000000

ティント

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

  1. #8774e2
  2. #9382e5
  3. #9f90e8
  4. #ab9eeb
  5. #b7acee
  6. #c3baf1
  7. #cfc7f3
  8. #dbd5f6
  9. #e7e3f9
  10. #f3f1fc
  11. #ffffff

トーン

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

  1. #8774e2
  2. #8675d8
  3. #8676ce
  4. #8578c5
  5. #8479bb
  6. #847ab1
  7. #837ba7
  8. #827c9d
  9. #817e94
  10. #817f8a
  11. #808080

読みやすい文字 3.73:1 AA ✕ AA Large ✓ AAA ✕ AAA Large ✕
読みやすい文字 5.63:1 AA ✓ AA Large ✓ AAA ✕ AAA Large ✓

1色覚（全色盲） #848484 男性の約0.003%
不完全1色覚 #857eb2 男性の約0.001%
1型2色覚（P型） #4887e6 男性の約1.01%
2型2色覚（D型） #4981df 男性の約1.27%
3型2色覚（T型） #6e8aa0 男性の約0.0001%
1型3色覚（P型弱） #6780e4 男性の約1.08%
2型3色覚（D型弱） #677ce0 男性の約4.63%
3型3色覚（T型弱） #7982be 男性の約0.0002%
自分の画像でシミュレーション

この色の文字

この色の背景

この色の枠線

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

#9370db Medium Purple ΔE 3.34 #7b68ee Medium Slate Blue ΔE 4.42 #9966cc Amethyst ΔE 7.38 #6a5acd Slate Blue ΔE 9.94 #9678b6 Purple Mountain Majesty ΔE 10.27 #b57edc Floral Lavender ΔE 10.34 #4166f5 Ultramarine Blue ΔE 11.04 #788b1d 反転色 #848484 グレースケール 

Medium Purple
#8774e2  rgb(135, 116, 226)  hsl(250, 65%, 67%)  Medium Purple
#cfe274  rgb(207, 226, 116)  hsl(70, 65%, 67%)  June Bud
#e28774  rgb(226, 135, 116)  hsl(10, 65%, 67%)  Salmon
#74e287  rgb(116, 226, 135)  hsl(130, 65%, 67%)  Pastel Green