ColorTool
ログイン
#BDCFB6

#bdcfb6 ≈ Ash Gray

  • 緑
  • 明度: 高い
  • 彩度: 低め
  • 中間色
コントラストを確認 グラフで探索 ランダムな色

#bdcfb6は緑系の色です（明度：高い、彩度：低め）。 RGBでは赤74.12%、緑81.18%、青71.37%で構成され、CMYK印刷ではシアン8.7%、マゼンタ0%、イエロー12.08%、ブラック18.82%を使います。 HSLでは色相角103.2°、彩度20.66%、明度76.27%です。 暖色と寒色の中間で、自然、健康、調和を連想させることが多い色です。 デザインでは主にエコブランド、健康・ウェルネス、ブランドのアクセントに使われます。 この色の上に黒の文字を置くとコントラスト比は12.76:1（WCAG AAA）です。 最も近い色名はAsh Gray（#b2beb5）で、ΔEは7.44です。

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

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

補色

  1. #bdcfb6
  2. #c8b6cf

分裂補色

  1. #bdcfb6
  2. #bbb6cf
  3. #cfb6c9

類似色

  1. #c9cfb6
  2. #bdcfb6
  3. #b6cfbb

トライアド

  1. #bdcfb6
  2. #b6bdcf
  3. #cfb6bd

テトラード

  1. #bdcfb6
  2. #b6cfc8
  3. #c8b6cf
  4. #cfb6bd

スクエア

  1. #bdcfb6
  2. #b6c9cf
  3. #c8b6cf
  4. #cfbbb6

モノクロマティック

  1. #6b8e5e
  2. #93b188
  3. #bdcfb6
  4. #e7ede4
  5. #f4f7f3

シェード

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

  1. #bdcfb6
  2. #aabaa4
  3. #97a692
  4. #84917f
  5. #717c6d
  6. #5f685b
  7. #4c5349
  8. #393e37
  9. #262924
  10. #131512
  11. #000000

ティント

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

  1. #bdcfb6
  2. #c4d4bd
  3. #cad9c5
  4. #d1ddcc
  5. #d7e2d3
  6. #dee7db
  7. #e5ece2
  8. #ebf1e9
  9. #f2f5f0
  10. #f8faf8
  11. #ffffff

トーン

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

  1. #bdcfb6
  2. #b7c7b1
  3. #b1bfab
  4. #abb7a6
  5. #a5afa0
  6. #9fa89b
  7. #98a096
  8. #929890
  9. #8c908b
  10. #868885
  11. #808080

読みやすい文字 1.65:1 AA ✕ AA Large ✕ AAA ✕ AAA Large ✕
読みやすい文字 12.76:1 AA ✓ AA Large ✓ AAA ✓ AAA Large ✓

1色覚（全色盲） #cacaca 男性の約0.003%
不完全1色覚 #c5ccc2 男性の約0.001%
1型2色覚（P型） #d1cbb5 男性の約1.01%
2型2色覚（D型） #cec9b7 男性の約1.27%
3型2色覚（T型） #bdcdc8 男性の約0.0001%
1型3色覚（P型弱） #c9ccb5 男性の約1.08%
2型3色覚（D型弱） #c7cbb7 男性の約4.63%
3型3色覚（T型弱） #bdcec1 男性の約0.0002%
自分の画像でシミュレーション

この色の文字

この色の背景

この色の枠線

文字色
.text-bdcfb6 {
  color: #bdcfb6;
}
背景色
.bg-bdcfb6 {
  background-color: #bdcfb6;
  color: #000000;
}
枠線
.border-bdcfb6 {
  border: 2px solid #bdcfb6;
}
CSS変数
:root {
  --color-primary: #bdcfb6;
  --color-primary-rgb: 189 207 182;
  --color-primary-hsl: 103 21% 76%;
}
グラデーション
.gradient-bdcfb6 {
  background: linear-gradient(135deg, #bdcfb6, #b6cfbb);
}
色付きの影
.shadow-bdcfb6 {
  box-shadow: 0 8px 24px rgb(189 207 182 / 0.35);
}

#b2beb5 Ash Gray ΔE 7.44 #a8c3bc Opal ΔE 8.01 #d0f0c0 Tea Green ΔE 9.51 #ace1af Celadon ΔE 9.88 #8fbc8f Dark Sea Green ΔE 10.63 #9fe2bf Seafoam Green ΔE 10.95 #bcb88a Sage ΔE 11.20 #423049 反転色 #cacaca グレースケール 

Ash Gray
#bdcfb6  rgb(189, 207, 182)  hsl(103, 21%, 76%)  Ash Gray
#c8b6cf  rgb(200, 182, 207)  hsl(283, 21%, 76%)  Thistle
#b6bdcf  rgb(182, 189, 207)  hsl(223, 21%, 76%)  Light Steel Blue
#cfb6bd  rgb(207, 182, 189)  hsl(343, 21%, 76%)  Silver Pink