Palette

Volcanic Ember Flow

A powerful and incandescent palette, bursting with the molten reds and oranges of flowing volcanic fire.

vibrantenergetic5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Volcanic Ember Flow 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 Volcanic Ember Flow.

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

Data visualization

#800000#FF0000#FFA500#FFD700#FF4500

Palette guide

How to use Volcanic Ember Flow

Overview

The "Volcanic Ember Flow" palette (ID: volcanic-ember-flow-4) is a powerful and incandescent collection, bursting with the molten reds and oranges of flowing volcanic fire. It spans from the deep #800000 (Maroon) to the bold #FF0000 (Red), vibrant #FFA500 (Orange), and radiant #FFD700 (Gold), with #FF4500 (Orange Red) providing a strong mid-tone. This palette is designed to convey maximum energy, heat, and intensity. Designers can use it for highly impactful branding, while developers will find it perfect for creating dynamic, attention-grabbing user interfaces.

Best used for

High-octane gaming and entertainment
Urgent alerts and warnings
Sports team branding
Bold marketing campaigns
Themed event design
Visualizations of heat or energy

Suggested color roles

primary

#800000 - A deep, rich maroon for foundational elements or strong backgrounds, conveying immense power.

secondary

#FF0000 - A pure, bold red for important content sections, large headers, or dynamic graphics, demanding attention.

accent

#FFD700 - A brilliant gold for critical calls to action, interactive elements, or key highlights, symbolizing intense heat and value.

background

#800000 or #FF0000 - Provides a powerful, warm backdrop, making other colors glow intensely.

text

#FFD700 or #FFA500 for primary text on dark backgrounds, ensuring readability and a fiery, energetic appearance.

Accessibility notes

Ensure #FFD700 and #FFA500 have very high contrast on #800000 or #FF0000 for text.
Avoid using adjacent reds/oranges like #FF0000 and #FF4500 for small text due to potential low contrast.
Use a pure white or very light grey for body text over the darkest reds to ensure readability.
Prioritize clear contrast for interactive elements to ensure usability for all users.

Recommended combinations

Molten Core

Creates a dramatic, high-impact focal point, perfect for urgent messages or striking visual effects.

#800000 · #FFD700 · #FF0000

Lava Gradient

Ideal for gradients or layered elements that evoke the intense, flowing heat and light of molten lava.

#FF0000 · #FF4500 · #FFA500

Incandescent Burst

A robust combination for vibrant sections, offering depth and a bright, energetic progression of tones.

#800000 · #FFA500 · #FFD700

CSS variables

:root {
  --volcanic-ember-flow-4-1: #800000;
  --volcanic-ember-flow-4-2: #FF0000;
  --volcanic-ember-flow-4-3: #FFA500;
  --volcanic-ember-flow-4-4: #FFD700;
  --volcanic-ember-flow-4-5: #FF4500;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "volcanic-ember-flow-4": {
        1: "#800000",
        2: "#FF0000",
        3: "#FFA500",
        4: "#FFD700",
        5: "#FF4500",
      }
    }
  }
}

Hex values

Color 1#800000

Color 2#FF0000

Color 3#FFA500

Color 4#FFD700

Color 5#FF4500

Accessibility

Contrast checker

2.7:1Fail

5.5:1AA

7.8:1AAA

3.2:1AA18

2.7:1Fail

2:1Fail

2.9:1Fail

1.2:1Fail

5.5:1AA

2:1Fail

1.4:1Fail

1.7:1Fail

7.8:1AAA

2.9:1Fail

1.4:1Fail

2.5:1Fail

3.2:1AA18

1.2:1Fail

1.7:1Fail

2.5:1Fail

Similar palettes

More like Volcanic Ember Flow

View all vibrant

Fiery Lava Flow

Fiery Phoenix Blaze

Helios Blaze Intensity

Molten Lava Glow

Volcanic Flow Surge

Celestial Pyro Burst