ColorTool
ログイン
#EE803F

#ee803f ≈ Mango Tango

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

#ee803fはオレンジ系の色です（明度：中程度、彩度：高め）。 RGBでは赤93.33%、緑50.2%、青24.71%で構成され、CMYK印刷ではシアン0%、マゼンタ46.22%、イエロー73.53%、ブラック6.67%を使います。 HSLでは色相角22.29°、彩度83.73%、明度59.02%です。 暖色で、熱意、温かさ、創造性を連想させることが多い色です。 デザインでは主にCTAボタン、食品ブランドやレストランに使われます。 この色の上に黒の文字を置くとコントラスト比は7.79:1（WCAG AAA）です。 最も近い色名はMango Tango（#ff8243）で、ΔEは3.35です。

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

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

補色

  1. #ee803f
  2. #3fadee

分裂補色

  1. #ee803f
  2. #3feed8
  3. #3f55ee

類似色

  1. #ee3f55
  2. #ee803f
  3. #eed83f

トライアド

  1. #ee803f
  2. #3fee80
  3. #803fee

テトラード

  1. #ee803f
  2. #adee3f
  3. #3fadee
  4. #803fee

スクエア

  1. #ee803f
  2. #55ee3f
  3. #3fadee
  4. #d83fee

モノクロマティック

  1. #883a0c
  2. #ce5812
  3. #ee803f
  4. #f4ae85
  5. #faddcc

シェード

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

  1. #ee803f
  2. #d67339
  3. #be6632
  4. #a75a2c
  5. #8f4d26
  6. #774020
  7. #5f3319
  8. #472613
  9. #301a0d
  10. #180d06
  11. #000000

ティント

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

  1. #ee803f
  2. #f08d52
  3. #f19965
  4. #f3a679
  5. #f5b38c
  6. #f7c09f
  7. #f8ccb2
  8. #fad9c5
  9. #fce6d9
  10. #fdf2ec
  11. #ffffff

トーン

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

  1. #ee803f
  2. #e38046
  3. #d8804c
  4. #cd8053
  5. #c28059
  6. #b78060
  7. #ac8066
  8. #a1806d
  9. #968073
  10. #8b807a
  11. #808080

読みやすい文字 2.69:1 AA ✕ AA Large ✕ AAA ✕ AAA Large ✕
読みやすい文字 7.79:1 AA ✓ AA Large ✓ AAA ✓ AAA Large ✓

1色覚（全色盲） #9e9e9e 男性の約0.003%
不完全1色覚 #c39382 男性の約0.001%
1型2色覚（P型） #9f8e37 男性の約1.01%
2型2色覚（D型） #baa73d 男性の約1.27%
3型2色覚（T型） #ff6972 男性の約0.0001%
1型3色覚（P型弱） #c4893b 男性の約1.08%
2型3色覚（D型弱） #d1993e 男性の約4.63%
3型3色覚（T型弱） #fc7362 男性の約0.0002%
自分の画像でシミュレーション

この色の文字

この色の背景

この色の枠線

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

#ff8243 Mango Tango ΔE 3.35 #ff7518 Pumpkin ΔE 4.42 #ed872d Cadmium Orange ΔE 5.55 #ff7f50 Coral ΔE 5.99 #d68a59 Raw Sienna ΔE 6.00 #d99058 Persian Orange ΔE 6.92 #d2691e Chocolate ΔE 8.04 #117fc0 反転色 #9e9e9e グレースケール 

Mango Tango
#ee803f  rgb(238, 128, 63)  hsl(22, 84%, 59%)  Mango Tango
#3fadee  rgb(63, 173, 238)  hsl(202, 84%, 59%)  Carolina Blue
#3fee80  rgb(63, 238, 128)  hsl(142, 84%, 59%)  Spring Green
#803fee  rgb(128, 63, 238)  hsl(262, 84%, 59%)  Blue Violet