Palette

Sahara Ember Sky

Captures the dramatic transition of a desert sky ablaze with oranges and reds as the sun dips below the horizon.

warmenergetic5 colors

More warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Sahara Ember Sky 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 Sahara Ember Sky.

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

Data visualization

#C63D0F#E25822#FF8C42#FFC37E#3A1F0D

Palette guide

How to use Sahara Ember Sky

Overview

The Sahara Ember Sky palette dramatically captures the fiery transition of a desert sunset, as the sun dips below the horizon. This energetic collection features intense oranges and reds, including the deep #C63D0F, the vibrant #E25822, and the luminous #FF8C42. A soft, warm glow is provided by #FFC37E, while the grounding #3A1F0D adds depth and contrast. Designers and developers can leverage this palette to create dynamic, passionate, or adventurous aesthetics, perfect for projects that aim to evoke excitement, warmth, and the awe-inspiring beauty of a desert evening.

Best used for

Adventure travel and tourism branding
Energetic digital art and illustrations
Sports and active lifestyle apparel
Festival and event promotions
Dramatic website hero sections
Food and beverage packaging with a 'spicy' theme

Suggested color roles

primary

Utilize #E25822 as a vibrant primary color for bold statements, calls-to-action, or key branding elements, conveying energy and intensity.

secondary

Apply #C63D0F for supporting sections, subheadings, or important details, providing a deeper, fiery contrast.

accent

Employ #FF8C42 as a bright, energetic accent for highlights, interactive elements, or small details that need to pop with luminosity.

background

Use #FFC37E as a soft, warm background, creating a glowing canvas that allows the more intense colors to radiate.

text

For optimal readability, #3A1F0D provides excellent contrast for body text on lighter backgrounds. For headings or larger text on darker backgrounds, a light cream or white is recommended.

Accessibility notes

The deep #3A1F0D offers excellent contrast against all lighter palette colors (#FFC37E, #FF8C42) for accessible text.
Ensure #C63D0F provides sufficient contrast when used for text on mid-tone backgrounds to meet WCAG guidelines.
Avoid pairing #FFC37E with similarly light text colors; always use a dark contrast color for readability.
Use larger font sizes and bolding when applying any of the vibrant orange hues for text against darker backgrounds.

Recommended combinations

Fiery Sunset

An intense and dynamic blend, perfect for impactful headers, vibrant graphics, or dramatic visual storytelling.

#C63D0F · #E25822 · #FF8C42

Ember Glow

Creates a soft to bright transition, ideal for gradients, subtle backgrounds, or inviting call-to-action elements.

#FFC37E · #FF8C42 · #E25822

Nightfall Edge

A dramatic and contrasting combination, suitable for backgrounds, footers, or to emphasize key information with depth.

#3A1F0D · #C63D0F · #FFC37E

CSS variables

:root {
  --sahara-ember-sky-1: #C63D0F;
  --sahara-ember-sky-2: #E25822;
  --sahara-ember-sky-3: #FF8C42;
  --sahara-ember-sky-4: #FFC37E;
  --sahara-ember-sky-5: #3A1F0D;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "sahara-ember-sky": {
        1: "#C63D0F",
        2: "#E25822",
        3: "#FF8C42",
        4: "#FFC37E",
        5: "#3A1F0D",
      }
    }
  }
}

Hex values

Color 1#C63D0F

Color 2#E25822

Color 3#FF8C42

Color 4#FFC37E

Color 5#3A1F0D

Accessibility

Contrast checker

1.4:1Fail

2.2:1Fail

3.3:1AA18

2.9:1Fail

1.4:1Fail

1.6:1Fail

2.4:1Fail

4.1:1AA18

2.2:1Fail

1.6:1Fail

1.5:1Fail

6.6:1AA

3.3:1AA18

2.4:1Fail

1.5:1Fail

9.7:1AAA

2.9:1Fail

4.1:1AA18

6.6:1AA

9.7:1AAA

Similar palettes

More like Sahara Ember Sky