Skip to main content
soft

Espresso and Ivory

14.51:1 contrast ratio —

AAA

Visual Preview

#3C2218Espresso
#FFFFF0Ivory

The quick brown fox

Body text — Espresso on Ivory

Supporting text at reduced opacity

Badge

Reversed — Ivory on Espresso

Inverted combination preview

Contrast Analysis

Contrast Ratio

14.51:1

AAA

WCAG AA

✓ Pass

Requires 4.5:1

WCAG AA Large

✓ Pass

Requires 3:1

WCAG AAA

✓ Pass

Requires 7:1

Color Values

Espresso

Foreground (Text)

HEX
#3C2218
RGB
rgb(60, 34, 24)
HSL
hsl(17, 43%, 16%)

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 Espresso tone evokes earthiness, reliability, and warmth, while Ivory brings purity, clarity, and simplicity. Together, they create a balanced palette suited for compelling visual communication.

Palette Exports

:root {
  --color-espresso: #3C2218;
  --color-ivory: #FFFFF0;
}

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

Quick Snippets

CSS Variables

:root {
  --color-espresso: #3C2218;
  --color-ivory: #FFFFF0;
}

Tailwind CSS

<div class="bg-white text-stone-800">
  Your content here
</div>

Individual Colors

Similar Combinations