ColorTool
ログイン
#B44F06

#b44f06 ≈ Mahogany

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

#b44f06は茶系の色です（明度：低い、彩度：高め）。 RGBでは赤70.59%、緑30.98%、青2.35%で構成され、CMYK印刷ではシアン0%、マゼンタ56.11%、イエロー96.67%、ブラック29.41%を使います。 HSLでは色相角25.17°、彩度93.55%、明度36.47%です。 暖色で、信頼性、温もり、素朴さを連想させることが多い色です。 デザインでは主にカフェやコーヒーブランド、素朴でナチュラルなスタイル、CTAボタンに使われます。 この色の上に白の文字を置くとコントラスト比は5.17:1（WCAG AA）です。 最も近い色名はMahogany（#c04000）で、ΔEは4.96です。

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

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

補色

  1. #b44f06
  2. #066bb4

分裂補色

  1. #b44f06
  2. #06b4a6
  3. #0614b4

類似色

  1. #b40614
  2. #b44f06
  3. #b4a606

トライアド

  1. #b44f06
  2. #06b44f
  3. #4f06b4

テトラード

  1. #b44f06
  2. #6bb406
  3. #066bb4
  4. #4f06b4

スクエア

  1. #b44f06
  2. #14b406
  3. #066bb4
  4. #a606b4

モノクロマティック

  1. #200e01
  2. #6a2f04
  3. #b44f06
  4. #f7710f
  5. #f99d5a

シェード

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

  1. #b44f06
  2. #a24705
  3. #903f05
  4. #7e3704
  5. #6c2f04
  6. #5a2803
  7. #482002
  8. #361802
  9. #241001
  10. #120801
  11. #000000

ティント

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

  1. #b44f06
  2. #bc611f
  3. #c37238
  4. #cb8451
  5. #d2956a
  6. #daa783
  7. #e1b99b
  8. #e9cab4
  9. #f0dccd
  10. #f8ede6
  11. #ffffff

トーン

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

  1. #b44f06
  2. #af5412
  3. #aa591e
  4. #a45e2b
  5. #9f6337
  6. #9a6843
  7. #956c4f
  8. #90715b
  9. #8a7668
  10. #857b74
  11. #808080

読みやすい文字 5.17:1 AA ✓ AA Large ✓ AAA ✕ AAA Large ✓
読みやすい文字 4.06:1 AA ✕ AA Large ✓ AAA ✕ AAA Large ✕

1色覚（全色盲） #6d6d6d 男性の約0.003%
不完全1色覚 #8f6256 男性の約0.001%
1型2色覚（P型） #6c5f00 男性の約1.01%
2型2色覚（D型） #857600 男性の約1.27%
3型2色覚（T型） #c63643 男性の約0.0001%
1型3色覚（P型弱） #8f5900 男性の約1.08%
2型3色覚（D型弱） #9a6802 男性の約4.63%
3型3色覚（T型弱） #bf4134 男性の約0.0002%
自分の画像でシミュレーション

この色の文字

この色の背景

この色の枠線

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

#c04000 Mahogany ΔE 4.96 #b7410e Rust ΔE 5.32 #cc5500 Burnt Orange ΔE 5.49 #a0522d Sienna ΔE 6.72 #cb410b Sinopia ΔE 6.81 #8b4513 Saddle Brown ΔE 9.25 #b06500 Ginger ΔE 9.45 #4bb0f9 反転色 #6d6d6d グレースケール 

Mahogany
#b44f06  rgb(180, 79, 6)  hsl(25, 94%, 36%)  Mahogany
#066bb4  rgb(6, 107, 180)  hsl(205, 94%, 36%)  Medium Persian Blue
#06b44f  rgb(6, 180, 79)  hsl(145, 94%, 36%)  Medium Sea Green
#4f06b4  rgb(79, 6, 180)  hsl(265, 94%, 36%)  Medium Blue