ColorTool
ログイン
#E77844

#e77844 ≈ Burnt Sienna

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

#e77844はオレンジ系の色です（明度：中程度、彩度：高め）。 RGBでは赤90.59%、緑47.06%、青26.67%で構成され、CMYK印刷ではシアン0%、マゼンタ48.05%、イエロー70.56%、ブラック9.41%を使います。 HSLでは色相角19.14°、彩度77.25%、明度58.63%です。 暖色で、熱意、温かさ、創造性を連想させることが多い色です。 デザインでは主にCTAボタン、食品ブランドやレストラン、ブランドのアクセントに使われます。 この色の上に黒の文字を置くとコントラスト比は7.17:1（WCAG AAA）です。 最も近い色名はBurnt Sienna（#e97451）で、ΔEは4.7です。

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

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

補色

  1. #e77844
  2. #44b3e7

分裂補色

  1. #e77844
  2. #44e7c9
  3. #4462e7

類似色

  1. #e74462
  2. #e77844
  3. #e7c944

トライアド

  1. #e77844
  2. #44e778
  3. #7844e7

テトラード

  1. #e77844
  2. #b3e744
  3. #44b3e7
  4. #7844e7

スクエア

  1. #e77844
  2. #62e744
  3. #44b3e7
  4. #c944e7

モノクロマティック

  1. #813511
  2. #c55019
  3. #e77844
  4. #f0a988
  5. #f8dacc

シェード

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

  1. #e77844
  2. #d06c3d
  3. #b96036
  4. #a25430
  5. #8b4829
  6. #743c22
  7. #5c301b
  8. #452414
  9. #2e180e
  10. #170c07
  11. #000000

ティント

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

  1. #e77844
  2. #e98657
  3. #ec9369
  4. #eea17c
  5. #f1ae8f
  6. #f3bca2
  7. #f5c9b4
  8. #f8d7c7
  9. #fae4da
  10. #fdf2ec
  11. #ffffff

トーン

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

  1. #e77844
  2. #dd794a
  3. #d27a50
  4. #c87a56
  5. #be7b5c
  6. #b47c62
  7. #a97d68
  8. #9f7e6e
  9. #957e74
  10. #8a7f7a
  11. #808080

読みやすい文字 2.93:1 AA ✕ AA Large ✕ AAA ✕ AAA Large ✕
読みやすい文字 7.17:1 AA ✓ AA Large ✓ AAA ✓ AAA Large ✓

1色覚（全色盲） #979797 男性の約0.003%
不完全1色覚 #bc8b7e 男性の約0.001%
1型2色覚（P型） #97883e 男性の約1.01%
2型2色覚（D型） #b1a042 男性の約1.27%
3型2色覚（T型） #fd616c 男性の約0.0001%
1型3色覚（P型弱） #bc8241 男性の約1.08%
2型3色覚（D型弱） #c99243 男性の約4.63%
3型3色覚（T型弱） #f46b5f 男性の約0.0002%
自分の画像でシミュレーション

この色の文字

この色の背景

この色の枠線

文字色
.text-e77844 {
  color: #e77844;
}
背景色
.bg-e77844 {
  background-color: #e77844;
  color: #000000;
}
枠線
.border-e77844 {
  border: 2px solid #e77844;
}
CSS変数
:root {
  --color-primary: #e77844;
  --color-primary-rgb: 231 120 68;
  --color-primary-hsl: 19 77% 59%;
}
グラデーション
.gradient-e77844 {
  background: linear-gradient(135deg, #e77844, #e7c944);
}
色付きの影
.shadow-e77844 {
  box-shadow: 0 8px 24px rgb(231 120 68 / 0.35);
}

#e97451 Burnt Sienna ΔE 4.70 #ff8243 Mango Tango ΔE 4.96 #ff7f50 Coral ΔE 5.02 #ff7518 Pumpkin ΔE 6.59 #d68a59 Raw Sienna ΔE 6.71 #d2691e Chocolate ΔE 7.47 #e25822 Flame ΔE 7.52 #1887bb 反転色 #979797 グレースケール 

Burnt Sienna
#e77844  rgb(231, 120, 68)  hsl(19, 77%, 59%)  Burnt Sienna
#44b3e7  rgb(68, 179, 231)  hsl(199, 77%, 59%)  Deep Sky Blue
#44e778  rgb(68, 231, 120)  hsl(139, 77%, 59%)  Pastel Green
#7844e7  rgb(120, 68, 231)  hsl(259, 77%, 59%)  Blue Violet