ColorTool
ログイン
#54544B

#54544b ≈ Davy's Gray

  • グレー
  • 明度: 低い
  • 彩度: ほぼなし
  • 無彩色
コントラストを確認 グラフで探索 ランダムな色

#54544bはグレー系の色です（明度：低い、彩度：ほぼなし）。 RGBでは赤32.94%、緑32.94%、青29.41%で構成され、CMYK印刷ではシアン0%、マゼンタ0%、イエロー10.71%、ブラック67.06%を使います。 HSLでは色相角60°、彩度5.66%、明度31.18%です。 無彩色に近く、中立、バランス、プロフェッショナルを連想させることが多い色です。 デザインでは主に本文やタイポグラフィ、企業のブランディングに使われます。 この色の上に白の文字を置くとコントラスト比は7.65:1（WCAG AAA）です。 最も近い色名はDavy's Gray（#555555）で、ΔEは5.27です。

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

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

補色

  1. #54544b
  2. #4b4b54

分裂補色

  1. #54544b
  2. #4b5054
  3. #504b54

類似色

  1. #54504b
  2. #54544b
  3. #50544b

トライアド

  1. #54544b
  2. #4b5454
  3. #544b54

テトラード

  1. #54544b
  2. #4b544b
  3. #4b4b54
  4. #544b54

スクエア

  1. #54544b
  2. #4b5450
  3. #4b4b54
  4. #544b50

モノクロマティック

  1. #0b0b0a
  2. #2c2c27
  3. #54544b
  4. #7c7c6f
  5. #a2a296

シェード

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

  1. #54544b
  2. #4c4c44
  3. #43433c
  4. #3b3b35
  5. #32322d
  6. #2a2a26
  7. #22221e
  8. #191917
  9. #11110f
  10. #080808
  11. #000000

ティント

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

  1. #54544b
  2. #65655d
  3. #76766f
  4. #878781
  5. #989893
  6. #aaaaa5
  7. #bbbbb7
  8. #ccccc9
  9. #dddddb
  10. #eeeeed
  11. #ffffff

トーン

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

  1. #54544b
  2. #585850
  3. #5d5d56
  4. #61615b
  5. #666660
  6. #6a6a66
  7. #6e6e6b
  8. #737370
  9. #777775
  10. #7c7c7b
  11. #808080

読みやすい文字 7.65:1 AA ✓ AA Large ✓ AAA ✓ AAA Large ✓
読みやすい文字 2.75:1 AA ✕ AA Large ✕ AAA ✕ AAA Large ✕

1色覚（全色盲） #535353 男性の約0.003%
不完全1色覚 #545450 男性の約0.001%
1型2色覚（P型） #56534a 男性の約1.01%
2型2色覚（D型） #56544b 男性の約1.27%
3型2色覚（T型） #555351 男性の約0.0001%
1型3色覚（P型弱） #55534b 男性の約1.08%
2型3色覚（D型弱） #55544b 男性の約4.63%
3型3色覚（T型弱） #55534f 男性の約0.0002%
自分の画像でシミュレーション

この色の文字

この色の背景

この色の枠線

文字色
.text-54544b {
  color: #54544b;
}
背景色
.bg-54544b {
  background-color: #54544b;
  color: #ffffff;
}
枠線
.border-54544b {
  border: 2px solid #54544b;
}
CSS変数
:root {
  --color-primary: #54544b;
  --color-primary-rgb: 84 84 75;
  --color-primary-hsl: 60 6% 31%;
}
グラデーション
.gradient-54544b {
  background: linear-gradient(135deg, #54544b, #50544b);
}
色付きの影
.shadow-54544b {
  box-shadow: 0 8px 24px rgb(84 84 75 / 0.35);
}

#555555 Davy's Gray ΔE 5.27 #444c38 Rifle Green ΔE 7.75 #4d5d53 Feldgrau ΔE 7.90 #414a4c Outer Space ΔE 8.12 #3b3c36 Black Olive ΔE 8.22 #696969 Dim Gray ΔE 9.45 #696969 Dim Grey ΔE 9.45 #ababb4 反転色 #535353 グレースケール 

Davy's Gray
#54544b  rgb(84, 84, 75)  hsl(60, 6%, 31%)  Davy's Gray
#4b4b54  rgb(75, 75, 84)  hsl(240, 6%, 31%)  Davy's Gray
#4b5454  rgb(75, 84, 84)  hsl(180, 6%, 31%)  Outer Space
#544b54  rgb(84, 75, 84)  hsl(300, 6%, 31%)  Wenge