Back to palettes

Palette

Mesa Ember Glow

Reflects the fiery, warm glow of a desert sunset against towering geological formations.

warmnatural5 colors
More warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Mesa Ember Glow 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 Mesa Ember Glow.

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

Data visualization

#8B4513#CD853F#FF8C00#FFA07A#FFDAB9

Palette guide

How to use Mesa Ember Glow

Overview

The Mesa Ember Glow palette captures the fiery, warm essence of a desert sunset, offering a vibrant and inviting color scheme. With deep, grounding tones like #8B4513 transitioning into radiant oranges such as #CD853F and the bold #FF8C00, this palette is full of energy. Lighter, glowing hues like #FFA07A and #FFDAB9 complete the spectrum, providing warmth and softness. This collection is ideal for designers and developers looking to inject passion and natural warmth into their projects, from dynamic web interfaces to captivating brand identities that evoke adventure and natural beauty.

Best used for

  • Adventure and outdoor brand identities
  • Vibrant event promotions and marketing materials
  • Food and beverage packaging with a warm appeal
  • Gaming interfaces or digital art
  • Artistic web themes and landing pages
  • Southwest-inspired cultural projects

Suggested color roles

primary

Use #FF8C00 as a bold, energetic primary color for calls to action, prominent headlines, or impactful brand elements.

secondary

Employ #CD853F as a rich, supportive secondary for subheadings, navigation, or to add depth.

accent

Apply #FFA07A for bright, eye-catching highlights, interactive elements, or to simulate a soft glow.

background

Utilize #FFDAB9 as a very light, warm background to provide an airy canvas that allows other colors to pop.

text

For optimal readability, use #8B4513 or a deep charcoal on lighter backgrounds like #FFDAB9.

Accessibility notes

  • Ensure high contrast for text, especially when using lighter shades like #FFA07A on similar backgrounds.
  • Prioritize #8B4513 for main body text on #FFDAB9 to meet WCAG contrast guidelines.
  • Be mindful of low contrast between adjacent warm tones like #FF8C00 and #FFA07A for small elements.
  • Test interactive elements to ensure they have sufficient contrast in all states.

Recommended combinations

Sunset Blaze

Excellent for bold statements, main headers, or vibrant call-to-action sections in UI/UX.

#FF8C00 · #8B4513 · #FFDAB9

Warm Gradient

Creates visual depth and soft transitions, suitable for backgrounds or illustrative elements.

#CD853F · #FFA07A · #FFDAB9

Desert Heat

Offers a strong, earthy combination for powerful branding, feature boxes, or data visualization.

#8B4513 · #FF8C00 · #CD853F

CSS variables

:root {
  --mesa-ember-glow-1: #8B4513;
  --mesa-ember-glow-2: #CD853F;
  --mesa-ember-glow-3: #FF8C00;
  --mesa-ember-glow-4: #FFA07A;
  --mesa-ember-glow-5: #FFDAB9;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "mesa-ember-glow": {
        1: "#8B4513",
        2: "#CD853F",
        3: "#FF8C00",
        4: "#FFA07A",
        5: "#FFDAB9",
      }
    }
  }
}

Related searches

desert sunset colorswarm orange paletteearthy fire tonesadventure brand colorsvibrant southwest palette

Palette colors

Hex values

Color 1#8B4513
·
Color 2#CD853F
·
Color 3#FF8C00
·
Color 4#FFA07A
·
Color 5#FFDAB9
·

Accessibility

Contrast checker

1
2
3
4
5
1
2.4:1Fail
3:1AA18
3.6:1AA18
5.4:1AA
2
2.4:1Fail
1.3:1Fail
1.5:1Fail
2.3:1Fail
3
3:1AA18
1.3:1Fail
1.2:1Fail
1.8:1Fail
4
3.6:1AA18
1.5:1Fail
1.2:1Fail
1.5:1Fail
5
5.4:1AA
2.3:1Fail
1.8:1Fail
1.5:1Fail

Similar palettes

More like Mesa Ember Glow

View all warm