Back to palettes

Palette

Fiery Phoenix Blaze

A fiery and energetic palette mirroring the intense reds and oranges of a phoenix in mid-blaze, full of vibrant power.

vibrantenergetic5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Fiery Phoenix Blaze 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 Fiery Phoenix Blaze.

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

Data visualization

#B30000#E62E00#FF6600#FF9900#FFCC00

Palette guide

How to use Fiery Phoenix Blaze

Overview

The 'Fiery Phoenix Blaze' palette is a vibrant and energetic collection mirroring the intense reds and oranges of a phoenix in mid-blaze, full of powerful transformation. It progresses from a deep, burning red (#B30000) through vivid fiery oranges (#E62E00, #FF6600, #FF9900) to a brilliant, radiant gold (#FFCC00). This palette bursts with energy and warmth, making it ideal for designers and developers building projects that need to convey dynamism, passion, and an unstoppable, radiant force. Its intense hues are perfect for creating memorable and impactful visual experiences.

Best used for

  • Gaming UI and energetic brand identities
  • Sports team colors and fan merchandise
  • Warning indicators and urgent alerts in UI
  • Children's products and playful designs
  • Vibrant event posters and promotional materials
  • Summer promotions and energetic marketing campaigns

Suggested color roles

primary

#B30000 for a strong, commanding base or key branding elements, symbolizing intense fire.

secondary

#E62E00 for supporting visual elements that maintain intensity and warmth.

accent

#FFCC00 or #FF9900 for brilliant highlights, calls to action, or interactive states, adding glow.

background

A dark neutral (like charcoal or black) to make these colors pop, or #B30000 for a deep, warm canvas.

text

Use #FFCC00 or white for readability on darker reds/oranges, or black/dark charcoal on #FFCC00 for contrast.

Accessibility notes

  • #FFCC00 will require dark text (e.g., black, #B30000) for good readability according to WCAG standards.
  • Darker reds like #B30000 need light text (e.g., white, #FFCC00) for sufficient contrast.
  • Avoid using adjacent vibrant colors like #FF6600 and #FF9900 for text/background due to low contrast.
  • Ensure all interactive elements have sufficient contrast against their backgrounds for usability.

Recommended combinations

Blaze Gradient

For a dynamic, energetic background or visual element, simulating a fiery transition.

#B30000 · #FF6600 · #FFCC00

Hot CTA

A vibrant call-to-action button with a glowing highlight and a strong base color.

#E62E00 · #FFCC00 · #B30000

Energetic Text

A strong header with bright, impactful sub-text for dynamic messaging.

#B30000 · #FFCC00 · #FF6600

CSS variables

:root {
  --fiery-phoenix-blaze-1: #B30000;
  --fiery-phoenix-blaze-2: #E62E00;
  --fiery-phoenix-blaze-3: #FF6600;
  --fiery-phoenix-blaze-4: #FF9900;
  --fiery-phoenix-blaze-5: #FFCC00;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "fiery-phoenix-blaze": {
        1: "#B30000",
        2: "#E62E00",
        3: "#FF6600",
        4: "#FF9900",
        5: "#FFCC00",
      }
    }
  }
}

Related searches

phoenix fire colorsvibrant red orange goldenergetic blaze palettehot mythical colorsdynamic warm branding

Palette colors

Hex values

Color 1#B30000
·
Color 2#E62E00
·
Color 3#FF6600
·
Color 4#FF9900
·
Color 5#FFCC00
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
2.5:1Fail
3.4:1AA18
4.8:1AA
2
1.6:1Fail
1.5:1Fail
2.1:1Fail
2.9:1Fail
3
2.5:1Fail
1.5:1Fail
1.4:1Fail
1.9:1Fail
4
3.4:1AA18
2.1:1Fail
1.4:1Fail
1.4:1Fail
5
4.8:1AA
2.9:1Fail
1.9:1Fail
1.4:1Fail

Similar palettes

More like Fiery Phoenix Blaze

View all vibrant