ColorTool
ログイン
#AA5085

#aa5085 ≈ Mulberry

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

#aa5085はローズ系の色です（明度：中程度、彩度：中程度）。 RGBでは赤66.67%、緑31.37%、青52.16%で構成され、CMYK印刷ではシアン0%、マゼンタ52.94%、イエロー21.76%、ブラック33.33%を使います。 HSLでは色相角324.67°、彩度36%、明度49.02%です。 暖色と寒色の中間で、ロマンス、遊び心、愛情を連想させることが多い色です。 デザインでは主に食品ブランドやレストラン、セールやキャンペーン、ブランドのアクセントに使われます。 この色の上に白の文字を置くとコントラスト比は5.01:1（WCAG AA）です。 最も近い色名はMulberry（#c54b8c）で、ΔEは5.25です。

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

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

補色

  1. #aa5085
  2. #50aa75

分裂補色

  1. #aa5085
  2. #58aa50
  3. #50aaa2

類似色

  1. #a250aa
  2. #aa5085
  3. #aa5058

トライアド

  1. #aa5085
  2. #85aa50
  3. #5085aa

テトラード

  1. #aa5085
  2. #aa7550
  3. #50aa75
  4. #5085aa

スクエア

  1. #aa5085
  2. #aaa250
  3. #50aa75
  4. #5058aa

モノクロマティック

  1. #421f34
  2. #76385c
  3. #aa5085
  4. #c482a9
  5. #ddb6cd

シェード

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

  1. #aa5085
  2. #994878
  3. #88406a
  4. #77385d
  5. #663050
  6. #552843
  7. #442035
  8. #331828
  9. #22101b
  10. #11080d
  11. #000000

ティント

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

  1. #aa5085
  2. #b36291
  3. #bb739d
  4. #c485aa
  5. #cc96b6
  6. #d5a8c2
  7. #ddb9ce
  8. #e6cbda
  9. #eedce7
  10. #f7eef3
  11. #ffffff

トーン

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

  1. #aa5085
  2. #a65585
  3. #a25a84
  4. #9d5e84
  5. #996383
  6. #956883
  7. #916d82
  8. #8d7282
  9. #887681
  10. #847b81
  11. #808080

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

1色覚（全色盲） #6f6f6f 男性の約0.003%
不完全1色覚 #8b6479 男性の約0.001%
1型2色覚（P型） #586687 男性の約1.01%
2型2色覚（D型） #707583 男性の約1.27%
3型2色覚（T型） #b44f64 男性の約0.0001%
1型3色覚（P型弱） #815e86 男性の約1.08%
2型3色覚（D型弱） #8b6884 男性の約4.63%
3型3色覚（T型弱） #b04f73 男性の約0.0002%
自分の画像でシミュレーション

この色の文字

この色の背景

この色の枠線

文字色
.text-aa5085 {
  color: #aa5085;
}
背景色
.bg-aa5085 {
  background-color: #aa5085;
  color: #ffffff;
}
枠線
.border-aa5085 {
  border: 2px solid #aa5085;
}
CSS変数
:root {
  --color-primary: #aa5085;
  --color-primary-rgb: 170 80 133;
  --color-primary-hsl: 325 36% 49%;
}
グラデーション
.gradient-aa5085 {
  background: linear-gradient(135deg, #aa5085, #aa5058);
}
色付きの影
.shadow-aa5085 {
  box-shadow: 0 8px 24px rgb(170 80 133 / 0.35);
}

#c54b8c Mulberry ΔE 5.25 #8e4585 Deep Plum ΔE 7.85 #8a496b Twilight Lavender ΔE 7.90 #c71585 Medium Violet Red ΔE 8.02 #cf3476 Telemagenta ΔE 8.75 #915f6d Mauve Taupe ΔE 10.59 #873260 Boysenberry ΔE 11.17 #55af7a 反転色 #6f6f6f グレースケール 

Mulberry
#aa5085  rgb(170, 80, 133)  hsl(325, 36%, 49%)  Mulberry
#50aa75  rgb(80, 170, 117)  hsl(145, 36%, 49%)  Medium Sea Green
#85aa50  rgb(133, 170, 80)  hsl(85, 36%, 49%)  Asparagus
#5085aa  rgb(80, 133, 170)  hsl(205, 36%, 49%)  Air Force Blue