Back to palettes

Palette

Horizon Ember Glow

Captures the dramatic, fiery hues of a sunset sinking into the ocean horizon, rich with warmth.

warmenergetic5 colors
More warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#FF7B4C#FFC371#FFD7A3#FF9E5A#E66333

Palette guide

How to use Horizon Ember Glow

Overview

The Horizon Ember Glow palette captures the dramatic, fiery hues of a sunset, offering a vibrant and energetic feel. This collection of warm oranges, including a bold #FF7B4C and a soft #FFC371, is ideal for designers and developers aiming to evoke excitement and warmth in their projects. From the deep, grounding #E66333 to the luminous #FFD7A3, these colors provide a cohesive, dynamic spectrum perfect for digital interfaces, branding, and marketing materials. It’s a versatile set that promises to infuse designs with a natural, yet powerful, glow, ensuring visual appeal and a memorable user experience.

Best used for

  • Travel agency branding and websites
  • Event promotion for festivals or concerts
  • Food and beverage packaging (especially spicy or warm products)
  • Adventure sports apparel and marketing
  • Children's book illustrations and educational apps
  • Autumn/fall seasonal digital campaigns

Suggested color roles

primary

Use #FF7B4C as a dominant, inviting color for main calls-to-action, hero sections, or key brand elements to capture immediate attention.

secondary

Apply #FFC371 for secondary headings, large background areas, or complementary graphical elements to provide a softer, expansive feel.

accent

Reserve #E66333 for impactful accents, small interactive elements, error states, or high-contrast details that require a strong visual punch.

background

Utilize #FFD7A3 as a light, warm base for content areas, card backgrounds, or subtle gradients, ensuring a gentle backdrop for other elements.

text

For prominent headings, consider #FF9E5A on lighter backgrounds like #FFD7A3. For body text, a dark charcoal or black is recommended against #FFD7A3 or #FFC371 to ensure optimal readability.

Accessibility notes

  • Ensure sufficient contrast when using #FF7B4C or #FF9E5A for text on lighter shades like #FFC371 or #FFD7A3; aim for AA or AAA compliance.
  • The darkest color, #E66333, provides excellent contrast against the lightest, #FFD7A3, making it suitable for important text or icons.
  • Avoid using #FFC371 on #FFD7A3 for small text, as their proximity in lightness can lead to readability issues.
  • For body text, always pair any of these warm colors with a neutral dark tone (e.g., black or very dark gray) to maximize legibility for all users.

Recommended combinations

Warm Glow

Ideal for soft background gradients, subtle header transitions, or card elements that need a gentle, inviting feel.

#FFC371 · #FFD7A3 · #FF7B4C

Ember Focus

Perfect for high-impact calls-to-action, key interactive elements, or sections requiring strong visual emphasis and contrast.

#E66333 · #FF7B4C · #FF9E5A

Sunset Gradient

Use this blend for evoking a smooth, natural sunset transition in hero images, banner backgrounds, or animated elements.

#FF7B4C · #FF9E5A · #FFC371

CSS variables

:root {
  --horizon-ember-glow-1: #FF7B4C;
  --horizon-ember-glow-2: #FFC371;
  --horizon-ember-glow-3: #FFD7A3;
  --horizon-ember-glow-4: #FF9E5A;
  --horizon-ember-glow-5: #E66333;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "horizon-ember-glow": {
        1: "#FF7B4C",
        2: "#FFC371",
        3: "#FFD7A3",
        4: "#FF9E5A",
        5: "#E66333",
      }
    }
  }
}

Related searches

sunset color palettewarm orange color schemevibrant web design colorsfiery brand identityenergetic ui colors

Palette colors

Hex values

Color 1#FF7B4C
·
Color 2#FFC371
·
Color 3#FFD7A3
·
Color 4#FF9E5A
·
Color 5#E66333
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
1.9:1Fail
1.3:1Fail
1.3:1Fail
2
1.6:1Fail
1.2:1Fail
1.3:1Fail
2.1:1Fail
3
1.9:1Fail
1.2:1Fail
1.5:1Fail
2.5:1Fail
4
1.3:1Fail
1.3:1Fail
1.5:1Fail
1.7:1Fail
5
1.3:1Fail
2.1:1Fail
2.5:1Fail
1.7:1Fail

Similar palettes

More like Horizon Ember Glow

View all warm
Arid Twilight Glow
Fiery Sunset
Sunset Horizon Radiance
Sunset Inferno Blaze
Sunset Mesa Blazes
Coral Sunset Blaze