Palette

Volcanic Magma Bloom

Intense, glowing reds and oranges portraying the fierce, liquid heat of Earth's molten core.

vibrantenergetic5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Volcanic Magma Bloom 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 Magma Bloom.

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

Data visualization

#BF3A1A#E05E2B#F78F5E#8C2A0F#A64F2C

Palette guide

How to use Volcanic Magma Bloom

Overview

The Volcanic Magma Bloom palette captures the fierce, liquid heat of Earth's molten core with intense, glowing reds and oranges. This collection offers a sophisticated yet energetic range, moving from deep, rich tones to brighter, fiery hues. Notable colors include the robust #BF3A1A, the vibrant #E05E2B, and the grounding #8C2A0F. This palette is excellent for designers looking to convey natural power and warmth, offering a more refined take on volcanic themes. Developers can apply these colors to create engaging user interfaces that feel both dynamic and deeply rooted, suitable for various digital and print applications.

Best used for

Adventure and outdoor lifestyle brands
Natural energy products and supplements
Sophisticated gaming UI and themes
Warm, inviting digital interfaces and apps
Abstract and contemporary art projects
Food and beverage brands seeking warmth

Suggested color roles

primary

Utilize #BF3A1A as a rich, strong red-orange for primary actions or impactful headers.

secondary

Apply #A64F2C for supporting content areas, navigation, or secondary buttons, adding depth.

accent

Highlight key information or interactive elements with #F78F5E for a warm, inviting glow.

background

Employ #8C2A0F as a deep, earthy background to ground the more vibrant colors.

text

On darker backgrounds like #8C2A0F or #A64F2C, use a light cream or white. For #F78F5E, a dark brown or charcoal provides good contrast.

Accessibility notes

Ensure sufficient contrast between text and background, especially when using #F78F5E with lighter text.
Avoid pairing #BF3A1A and #E05E2B for small text elements due to their similar color values.
Test color combinations for WCAG AA compliance, focusing on text readability on mid-tone backgrounds.
Consider using a slightly darker text color on #F78F5E than on a pure white background to enhance legibility.

Recommended combinations

Deep Glow

Creates a natural gradient from deep earth to a fiery, vibrant bloom.

#8C2A0F · #BF3A1A · #F78F5E

Earthy Ember

Offers a warm, rich blend, suitable for content blocks or feature sections.

#A64F2C · #E05E2B · #BF3A1A

Magma Highlight

Provides a bright, energetic contrast for accents and interactive states.

#BF3A1A · #F78F5E · #E05E2B

CSS variables

:root {
  --volcanic-magma-bloom-1: #BF3A1A;
  --volcanic-magma-bloom-2: #E05E2B;
  --volcanic-magma-bloom-3: #F78F5E;
  --volcanic-magma-bloom-4: #8C2A0F;
  --volcanic-magma-bloom-5: #A64F2C;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "volcanic-magma-bloom": {
        1: "#BF3A1A",
        2: "#E05E2B",
        3: "#F78F5E",
        4: "#8C2A0F",
        5: "#A64F2C",
      }
    }
  }
}

Hex values

Color 1#BF3A1A

Color 2#E05E2B

Color 3#F78F5E

Color 4#8C2A0F

Color 5#A64F2C

Accessibility

Contrast checker

1.5:1Fail

2.4:1Fail

1.6:1Fail

1:1Fail

1.5:1Fail

1.6:1Fail

2.4:1Fail

1.5:1Fail

2.4:1Fail

1.6:1Fail

3.7:1AA18

2.4:1Fail

1.6:1Fail

2.4:1Fail

3.7:1AA18

1.5:1Fail

1:1Fail

1.5:1Fail

2.4:1Fail

1.5:1Fail

Similar palettes

More like Volcanic Magma Bloom

Volcanic Magma Bloom

See it in context.

Ready when you are.

Built with Volcanic Magma Bloom.

How to use Volcanic Magma Bloom

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Deep Glow

Earthy Ember

Magma Highlight

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Volcanic Magma Bloom