ColorTool
ログイン
#BB8138

#bb8138 ≈ Peru

  • オレンジ
  • 明度: 中程度
  • 彩度: 高め
  • 暖色
コントラストを確認 グラフで探索 ランダムな色

#bb8138はオレンジ系の色です（明度：中程度、彩度：高め）。 RGBでは赤73.33%、緑50.59%、青21.96%で構成され、CMYK印刷ではシアン0%、マゼンタ31.02%、イエロー70.05%、ブラック26.67%を使います。 HSLでは色相角33.44°、彩度53.91%、明度47.65%です。 暖色で、熱意、温かさ、創造性を連想させることが多い色です。 デザインでは主にCTAボタン、食品ブランドやレストラン、ブランドのアクセントに使われます。 この色の上に黒の文字を置くとコントラスト比は6.31:1（WCAG AA）です。 最も近い色名はPeru（#cd853f）で、ΔEは4.67です。

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

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

補色

  1. #bb8138
  2. #3872bb

分裂補色

  1. #bb8138
  2. #38b4bb
  3. #4038bb

類似色

  1. #bb4038
  2. #bb8138
  3. #b4bb38

トライアド

  1. #bb8138
  2. #38bb81
  3. #8138bb

テトラード

  1. #bb8138
  2. #72bb38
  3. #3872bb
  4. #8138bb

スクエア

  1. #bb8138
  2. #38bb40
  3. #3872bb
  4. #bb38b4

モノクロマティック

  1. #453015
  2. #805826
  3. #bb8138
  4. #d3a66c
  5. #e5caa7

シェード

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

  1. #bb8138
  2. #a87432
  3. #96672d
  4. #835a27
  5. #704d22
  6. #5e411c
  7. #4b3416
  8. #382711
  9. #251a0b
  10. #130d06
  11. #000000

ティント

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

  1. #bb8138
  2. #c28e4c
  3. #c99a60
  4. #cfa774
  5. #d6b388
  6. #ddc09c
  7. #e4cdaf
  8. #ebd9c3
  9. #f1e6d7
  10. #f8f2eb
  11. #ffffff

トーン

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

  1. #bb8138
  2. #b5813f
  3. #af8146
  4. #a9814e
  5. #a38155
  6. #9e815c
  7. #988063
  8. #92806a
  9. #8c8072
  10. #868079
  11. #808080

読みやすい文字 3.33:1 AA ✕ AA Large ✓ AAA ✕ AAA Large ✕
読みやすい文字 6.31:1 AA ✓ AA Large ✓ AAA ✕ AAA Large ✓

1色覚（全色盲） #8d8d8d 男性の約0.003%
不完全1色覚 #a18874 男性の約0.001%
1型2色覚（P型） #958530 男性の約1.01%
2型2色覚（D型） #a2923a 男性の約1.27%
3型2色覚（T型） #cb7371 男性の約0.0001%
1型3色覚（P型弱） #a58333 男性の約1.08%
2型3色覚（D型弱） #ad8c39 男性の約4.63%
3型3色覚（T型弱） #c5795f 男性の約0.0002%
自分の画像でシミュレーション

この色の文字

この色の背景

この色の枠線

文字色
.text-bb8138 {
  color: #bb8138;
}
背景色
.bg-bb8138 {
  background-color: #bb8138;
  color: #000000;
}
枠線
.border-bb8138 {
  border: 2px solid #bb8138;
}
CSS変数
:root {
  --color-primary: #bb8138;
  --color-primary-rgb: 187 129 56;
  --color-primary-hsl: 33 54% 48%;
}
グラデーション
.gradient-bb8138 {
  background: linear-gradient(135deg, #bb8138, #b4bb38);
}
色付きの影
.shadow-bb8138 {
  box-shadow: 0 8px 24px rgb(187 129 56 / 0.35);
}

#cd853f Peru ΔE 4.67 #cd7f32 Bronze ΔE 4.96 #b87333 Copper ΔE 5.67 #cc7722 Ochre ΔE 6.22 #b8860b Dark Goldenrod ΔE 7.23 #d99058 Persian Orange ΔE 8.87 #e48400 Fulvous ΔE 9.15 #447ec7 反転色 #8d8d8d グレースケール 

Peru
#bb8138  rgb(187, 129, 56)  hsl(33, 54%, 48%)  Peru
#3872bb  rgb(56, 114, 187)  hsl(213, 54%, 48%)  True Blue
#38bb81  rgb(56, 187, 129)  hsl(153, 54%, 48%)  Medium Sea Green
#8138bb  rgb(129, 56, 187)  hsl(273, 54%, 48%)  Dark Orchid