Palette

Ember Twilight Hues

The smoldering warmth of dying embers, casting a gentle, intimate glow as twilight descends.

warmcalm5 colors

More warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Ember Twilight Hues 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 Ember Twilight Hues.

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

Data visualization

#4E2A2A#7A4D4D#B07E7E#E3B3B3#D4A017

Palette guide

How to use Ember Twilight Hues

Overview

The Ember Twilight Hues palette captures the smoldering warmth of dying embers, casting a gentle, intimate glow as twilight descends. This collection features deep reddish-brown (#4E2A2A), inviting medium reddish-brown (#7A4D4D), a softer light pink-brown (#B07E7E), and the very light pink-brown (#E3B3B3). A surprising accent of Ochre Yellow (#D4A017) adds a unique, glowing touch. Ideal for designers and developers seeking a cozy, sophisticated, and slightly mysterious aesthetic, this palette excels in creating designs that feel warm, reflective, and subtly luxurious, perfect for evoking calm, intimate settings.

Best used for

Luxury branding with a warm, earthy feel
Cozy evening event invitations
Interior design concepts for lounges or studies
Photography filters for moody, low-light scenes
E-commerce sites for high-end artisanal products
Digital storytelling with a nostalgic or intimate tone

Suggested color roles

primary

The deep reddish-brown (#4E2A2A) acts as a mysterious, grounding primary, perfect for headers, sophisticated backgrounds, or strong brand elements.

secondary

Medium reddish-brown (#7A4D4D) offers an inviting secondary hue, ideal for subheadings, interactive components, or sections needing a comforting depth.

accent

Ochre Yellow (#D4A017) provides a unique, unexpected glow, serving as an accent for highlights, small icons, or key calls-to-action, drawing the eye subtly.

background

The very light pink-brown (#E3B3B3) creates a soft, muted background, offering an elegant canvas that enhances readability and a serene feel.

text

The deep reddish-brown (#4E2A2A) is excellent for body text on lighter backgrounds, ensuring high readability with a cohesive, warm aesthetic, or use deep charcoal.

Accessibility notes

The deep reddish-brown (#4E2A2A) provides strong contrast against the very light pink-brown (#E3B3B3) for excellent text readability.
Ensure sufficient contrast if using Ochre Yellow (#D4A017) for text on the light pink-brown (#B07E7E) background.
Always verify that text and interactive element contrasts meet WCAG 2.1 AA standards, especially for smaller fonts.
Avoid using the light pink-brown (#B07E7E) directly on the very light pink-brown (#E3B3B3) for critical information due to low contrast.

Recommended combinations

Twilight Depth

Creates a rich, deep visual hierarchy, perfect for sophisticated branding or atmospheric web layouts.

#4E2A2A · #7A4D4D · #E3B3B3

Ember Sparkle

Ideal for highlighting key features, call-to-actions, or adding a surprising, warm accent to design elements.

#D4A017 · #4E2A2A · #B07E7E

Soft Radiance

Provides a gentle, inviting combination for subheadings, descriptive text, or subtle background patterns.

#7A4D4D · #E3B3B3 · #D4A017

CSS variables

:root {
  --ember-twilight-hues-1: #4E2A2A;
  --ember-twilight-hues-2: #7A4D4D;
  --ember-twilight-hues-3: #B07E7E;
  --ember-twilight-hues-4: #E3B3B3;
  --ember-twilight-hues-5: #D4A017;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "ember-twilight-hues": {
        1: "#4E2A2A",
        2: "#7A4D4D",
        3: "#B07E7E",
        4: "#E3B3B3",
        5: "#D4A017",
      }
    }
  }
}

Hex values

Color 1#4E2A2A

Color 2#7A4D4D

Color 3#B07E7E

Color 4#E3B3B3

Color 5#D4A017

Accessibility

Contrast checker

1.8:1Fail

3.6:1AA18

6.7:1AA

5.2:1AA

1.8:1Fail

2:1Fail

3.8:1AA18

3:1Fail

3.6:1AA18

2:1Fail

1.9:1Fail

1.4:1Fail

6.7:1AA

3.8:1AA18

1.9:1Fail

1.3:1Fail

5.2:1AA

3:1Fail

1.4:1Fail

1.3:1Fail

Similar palettes

More like Ember Twilight Hues

View all warm

Soft Summer Sunset

Amber Hearth Glow

Autumn Hearth Comfort

Barista Brew Comfort

Barista Roast Comfort

Cafe Latte Comfort