Back to palettes

Palette

Espresso Roast Dream

Deep, comforting browns and creamy accents, evoking the warmth and richness of roasted coffee.

neutralcalm5 colors
More neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Espresso Roast Dream reads on buttons, badges, and alerts before you commit.

This alert border and accent use the palette's detail color.

Marketing banner

Launch

Built with Espresso Roast Dream.

A bolder treatment that stretches the primary and secondary colors across a full gradient banner.

Data visualization

#2B1E1A#4E3B33#7A5F50#A68D7B#D4C0AD

Palette guide

How to use Espresso Roast Dream

Overview

The Espresso Roast Dream palette offers a beautifully balanced collection of deep, comforting browns and creamy, soft neutrals, evoking the warmth and richness of a perfectly crafted coffee experience. With the profound #2B1E1A providing a strong base, complemented by the inviting #4E3B33 and the versatile #7A5F50, this palette is ideal for creating designs that feel cozy, luxurious, and grounded. Designers will find these hues excellent for conveying sophistication and natural elegance. Developers can leverage this palette for lifestyle blogs, high-end e-commerce, or any project aiming for a serene yet rich visual identity. The lighter tones, #A68D7B and #D4C0AD, offer delightful contrast and highlight opportunities, ensuring a harmonious and dreamlike aesthetic.

Best used for

  • Luxury home goods e-commerce
  • Spa and wellness brand websites
  • Professional photography portfolios
  • Cozy lifestyle and travel blogs
  • High-end coffee shop branding
  • Elegant wedding stationery

Suggested color roles

primary

#2B1E1A serves as a deep, anchoring background or primary branding color, establishing a luxurious foundation.

secondary

#4E3B33 is ideal for supporting sections, headers, or large UI components, maintaining the palette's rich character.

accent

#7A5F50 makes for a warm, inviting accent, perfect for call-to-action buttons or key information, drawing attention effectively.

background

#D4C0AD offers a soft, creamy light background option, providing visual relief and enhancing readability for darker text.

text

For dark backgrounds like #2B1E1A, use #D4C0AD or white for optimal readability. For light backgrounds like #D4C0AD, use #2B1E1A or charcoal.

Accessibility notes

  • Ensure high contrast when placing light text (e.g., #D4C0AD) on dark backgrounds like #2B1E1A or #4E3B33.
  • Be cautious with #A68D7B on #7A5F50 for small text; contrast may be insufficient.
  • Use #2B1E1A for body text on light backgrounds such as #D4C0AD to ensure optimal readability.
  • Validate contrast ratios for interactive elements against their background colors.

Recommended combinations

Dreamy Contrast

Excellent for hero sections; #2B1E1A as background, #7A5F50 for titles, and #D4C0AD for descriptive text and accents.

#2B1E1A · #7A5F50 · #D4C0AD

Warm Layers

Ideal for content cards: #4E3B33 as card background, #A68D7B for subheadings, and #2B1E1A for main text.

#4E3B33 · #A68D7B · #2B1E1A

Gentle Blend

Great for subtle gradients or layered graphic elements, moving from light to mid-tone for a soft, harmonious visual.

#D4C0AD · #A68D7B · #7A5F50

CSS variables

:root {
  --espresso-roast-dream-1: #2B1E1A;
  --espresso-roast-dream-2: #4E3B33;
  --espresso-roast-dream-3: #7A5F50;
  --espresso-roast-dream-4: #A68D7B;
  --espresso-roast-dream-5: #D4C0AD;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "espresso-roast-dream": {
        1: "#2B1E1A",
        2: "#4E3B33",
        3: "#7A5F50",
        4: "#A68D7B",
        5: "#D4C0AD",
      }
    }
  }
}

Related searches

creamy brown color palettewarm coffee neutral schemeluxurious earthy tones hexcozy elegant brown designsoft coffee dream colors

Palette colors

Hex values

Color 1#2B1E1A
·
Color 2#4E3B33
·
Color 3#7A5F50
·
Color 4#A68D7B
·
Color 5#D4C0AD
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
2.7:1Fail
5.2:1AA
9.2:1AAA
2
1.5:1Fail
1.8:1Fail
3.4:1AA18
6:1AA
3
2.7:1Fail
1.8:1Fail
1.9:1Fail
3.3:1AA18
4
5.2:1AA
3.4:1AA18
1.9:1Fail
1.8:1Fail
5
9.2:1AAA
6:1AA
3.3:1AA18
1.8:1Fail

Similar palettes

More like Espresso Roast Dream

View all neutral