ColorTool
ログイン
#A15367

#a15367 ≈ Mauve Taupe

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

#a15367はローズ系の色です（明度：中程度、彩度：中程度）。 RGBでは赤63.14%、緑32.55%、青40.39%で構成され、CMYK印刷ではシアン0%、マゼンタ48.45%、イエロー36.02%、ブラック36.86%を使います。 HSLでは色相角344.62°、彩度31.97%、明度47.84%です。 暖色で、ロマンス、遊び心、愛情を連想させることが多い色です。 デザインでは主に食品ブランドやレストラン、セールやキャンペーン、ブランドのアクセントに使われます。 この色の上に白の文字を置くとコントラスト比は5.32:1（WCAG AA）です。 最も近い色名はMauve Taupe（#915f6d）で、ΔEは5.68です。

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

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

補色

  1. #a15367
  2. #53a18d

分裂補色

  1. #a15367
  2. #53a166
  3. #538ea1

類似色

  1. #a1538e
  2. #a15367
  3. #a16653

トライアド

  1. #a15367
  2. #67a153
  3. #5367a1

テトラード

  1. #a15367
  2. #a18d53
  3. #53a18d
  4. #5367a1

スクエア

  1. #a15367
  2. #8ea153
  3. #53a18d
  4. #6653a1

モノクロマティック

  1. #3c1f26
  2. #6f3947
  3. #a15367
  4. #bf8291
  5. #d9b4be

シェード

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

  1. #a15367
  2. #914b5d
  3. #814252
  4. #713a48
  5. #61323e
  6. #512a34
  7. #402129
  8. #30191f
  9. #201115
  10. #10080a
  11. #000000

ティント

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

  1. #a15367
  2. #aa6476
  3. #b47585
  4. #bd8795
  5. #c798a4
  6. #d0a9b3
  7. #d9bac2
  8. #e3cbd1
  9. #ecdde1
  10. #f6eef0
  11. #ffffff

トーン

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

  1. #a15367
  2. #9e586a
  3. #9a5c6c
  4. #97616f
  5. #946571
  6. #916a74
  7. #8d6e76
  8. #8a7379
  9. #87777b
  10. #837c7e
  11. #808080

読みやすい文字 5.32:1 AA ✓ AA Large ✓ AAA ✕ AAA Large ✓
読みやすい文字 3.95:1 AA ✕ AA Large ✓ AAA ✕ AAA Large ✕

1色覚（全色盲） #6b6b6b 男性の約0.003%
不完全1色覚 #84626a 男性の約0.001%
1型2色覚（P型） #606268 男性の約1.01%
2型2色覚（D型） #747165 男性の約1.27%
3型2色覚（T型） #ad4c5a 男性の約0.0001%
1型3色覚（P型弱） #7f5c67 男性の約1.08%
2型3色覚（D型弱） #886666 男性の約4.63%
3型3色覚（T型弱） #a84f60 男性の約0.0002%
自分の画像でシミュレーション

この色の文字

この色の背景

この色の枠線

文字色
.text-a15367 {
  color: #a15367;
}
背景色
.bg-a15367 {
  background-color: #a15367;
  color: #ffffff;
}
枠線
.border-a15367 {
  border: 2px solid #a15367;
}
CSS変数
:root {
  --color-primary: #a15367;
  --color-primary-rgb: 161 83 103;
  --color-primary-hsl: 345 32% 48%;
}
グラデーション
.gradient-a15367 {
  background: linear-gradient(135deg, #a15367, #a16653);
}
色付きの影
.shadow-a15367 {
  box-shadow: 0 8px 24px rgb(161 83 103 / 0.35);
}

#915f6d Mauve Taupe ΔE 5.68 #8a496b Twilight Lavender ΔE 7.98 #996666 Copper Rose ΔE 8.52 #893f45 Cordovan ΔE 9.48 #b76e79 Rose Gold ΔE 9.77 #cf3476 Telemagenta ΔE 9.96 #a45a52 Redwood ΔE 10.38 #5eac98 反転色 #6b6b6b グレースケール 

Mauve Taupe
#a15367  rgb(161, 83, 103)  hsl(345, 32%, 48%)  Mauve Taupe
#53a18d  rgb(83, 161, 141)  hsl(165, 32%, 48%)  Persian Green
#67a153  rgb(103, 161, 83)  hsl(105, 32%, 48%)  Asparagus
#5367a1  rgb(83, 103, 161)  hsl(225, 32%, 48%)  Queen Blue