Back to palettes

Palette

Solar Flare Burst

Explosive reds and oranges that burst forth with the intense, radiant energy of a solar flare.

vibrantenergetic5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Solar Flare Burst 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 Solar Flare Burst.

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

Data visualization

#E82A1C#FF5A20#FF8A00#FFC200#B81C10

Palette guide

How to use Solar Flare Burst

Overview

The "Solar Flare Burst" palette delivers an intensely fiery and energetic experience, moving from deep, powerful reds to brilliant golden yellows. This collection features the vibrant #E82A1C (red), the dynamic #FF5A20 (orange-red), and the luminous #FFC200 (gold), providing designers and developers with a powerful tool for high-impact projects. The inclusion of #B81C10 (deep crimson) adds a strong, grounding element, ensuring balance. It's ideal for conveying urgency, excitement, and raw power, making designs memorable and impactful across various platforms.

Best used for

  • High-energy sports brands and merchandise
  • Warning systems and safety interfaces
  • Automotive design and performance branding
  • Spicy food product packaging and promotions
  • Gaming interfaces and streaming graphics
  • Emergency services communication design

Suggested color roles

primary

Use #E82A1C for critical calls to action, prominent headlines, or dominant brand elements that require immediate attention.

secondary

Apply #FF5A20 for supporting content, subheadings, or secondary interactive elements, maintaining warmth and dynamism.

accent

Leverage #FFC200 for brilliant highlights, interactive states, or small icons that need to pop with vibrant energy.

background

Choose #B81C10 for a powerful, deep background that allows the brighter colors to burst, or a neutral grey for balance.

text

White text works exceptionally well on #E82A1C, #FF5A20, and #B81C10. For #FFC200, use black or a very dark charcoal for readability.

Accessibility notes

  • Ensure dark text (black/charcoal) on #FFC200 has sufficient contrast for readability, especially for body text.
  • White text on #E82A1C and #B81C10 generally provides good contrast for WCAG AA standards.
  • Avoid using #FFC200 text on #FF8A00 backgrounds due to potential low contrast.
  • For colorblind users, avoid solely relying on red/orange for critical status indicators; use icons or text labels.

Recommended combinations

Fiery Core

Creates an intense and powerful statement, excellent for high-impact calls to action or hero images.

#E82A1C · #FF5A20 · #B81C10

Radiant Burst

Offers a bright, energetic gradient, suitable for dynamic backgrounds or content sections.

#FF5A20 · #FF8A00 · #FFC200

Deep Impact

Provides a strong base with vibrant accents, ideal for highlighting key information or interactive components.

#B81C10 · #E82A1C · #FFC200

CSS variables

:root {
  --solar-flare-burst-5-1: #E82A1C;
  --solar-flare-burst-5-2: #FF5A20;
  --solar-flare-burst-5-3: #FF8A00;
  --solar-flare-burst-5-4: #FFC200;
  --solar-flare-burst-5-5: #B81C10;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "solar-flare-burst-5": {
        1: "#E82A1C",
        2: "#FF5A20",
        3: "#FF8A00",
        4: "#FFC200",
        5: "#B81C10",
      }
    }
  }
}

Related searches

intense red orange palettefiery brand colorsenergetic solar designbright warning colorshot color scheme

Palette colors

Hex values

Color 1#E82A1C
·
Color 2#FF5A20
·
Color 3#FF8A00
·
Color 4#FFC200
·
Color 5#B81C10
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.4:1Fail
1.9:1Fail
2.7:1Fail
1.5:1Fail
2
1.4:1Fail
1.3:1Fail
1.9:1Fail
2.1:1Fail
3
1.9:1Fail
1.3:1Fail
1.5:1Fail
2.8:1Fail
4
2.7:1Fail
1.9:1Fail
1.5:1Fail
4:1AA18
5
1.5:1Fail
2.1:1Fail
2.8:1Fail
4:1AA18

Similar palettes

More like Solar Flare Burst

View all vibrant