Skip to main content
soft

Burnt Orange and Ivory

4.28:1 contrast ratio —

AA Large

Visual Preview

#CC5500Burnt Orange
#FFFFF0Ivory

The quick brown fox

Body text — Burnt Orange on Ivory

Supporting text at reduced opacity

Badge

Reversed — Ivory on Burnt Orange

Inverted combination preview

Contrast Analysis

Contrast Ratio

4.28:1

AA Large

WCAG AA

✗ Fail

Requires 4.5:1

WCAG AA Large

✓ Pass

Requires 3:1

WCAG AAA

✗ Fail

Requires 7:1

Color Values

Burnt Orange

Foreground (Text)

HEX
#CC5500
RGB
rgb(204, 85, 0)
HSL
hsl(25, 100%, 40%)

Ivory

Background

HEX
#FFFFF0
RGB
rgb(255, 255, 240)
HSL
hsl(60, 100%, 97%)

Design Use Cases

  • Wellness apps
  • Baby products
  • Wedding stationery
  • Beauty brands
  • Lifestyle blogs

Industry Recommendations

Beauty & Cosmetics
Wedding
Baby Products
Lifestyle Blogs
Wellness

Color Psychology

The Burnt Orange tone evokes creativity, enthusiasm, and warmth, while Ivory brings purity, clarity, and simplicity. Together, they create a balanced palette suited for compelling visual communication.

Palette Exports

:root {
  --color-burnt-orange: #CC5500;
  --color-ivory: #FFFFF0;
}

.combo-burnt-orange-ivory {
  color: var(--color-burnt-orange);
  background-color: var(--color-ivory);
}

Quick Snippets

CSS Variables

:root {
  --color-burnt-orange: #CC5500;
  --color-ivory: #FFFFF0;
}

Tailwind CSS

<div class="bg-white text-amber-700">
  Your content here
</div>

Individual Colors

Similar Combinations