Back to palettes

Palette

Molten Rock Flow

Fiery reds and deep oranges capturing the raw power and intensity of molten lava flowing from a volcano.

VibrantEnergetic5 colors
More Vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Molten Rock 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 Molten Rock Flow.

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

Data visualization

#7D1F00#A53C00#CD5A16#5F1700#410F00

Palette guide

How to use Molten Rock Flow

Overview

The Molten Rock Flow palette (ID: molten-rock-flow-2) delves into the deepest, most intense hues of a volcanic eruption, offering a rich collection of dark oranges and profound reds. Shades like the earthy #7D1F00 and the even deeper #410F00 provide a strong, grounding foundation, while #CD5A16 offers a vibrant, fiery contrast. This palette is perfect for designers aiming to convey power, sophistication, and raw natural force. Developers will find these robust colors excellent for creating dramatic interfaces, luxurious branding, or immersive digital environments where depth and intensity are paramount. Its limited yet impactful range of tones ensures a cohesive and powerful visual narrative.

Best used for

  • Luxury and high-end brand identities
  • Masculine product packaging and advertising
  • Geological and scientific educational platforms
  • Dramatic and intense digital interfaces
  • Rugged outdoor and adventure brand designs
  • Rich, textured background for editorial layouts

Suggested color roles

primary

Utilize #A53C00 as a rich, deep primary color for main headings or significant graphical elements, offering a sophisticated warmth.

secondary

Employ #CD5A16 for highlights, calls to action, or interactive elements, providing a brighter, energetic spark against darker tones.

accent

Use #5F1700 for subtle detailing, borders, or as a darker accent to add further depth and intensity.

background

Apply #7D1F00 for a dark, stable background that evokes a sense of depth and power, or pair with a neutral dark grey.

text

For optimal readability, use white or a very light cream text on all darker colors like #410F00 and #7D1F00. #CD5A16 can be used for accent text.

Accessibility notes

  • Light-colored text (white, light cream) is essential for readability on all colors within this dark palette.
  • Avoid using darker colors from the palette for text on other dark palette colors, as contrast will be insufficient.
  • Ensure interactive elements using #CD5A16 have a clear visual focus state, as it is the brightest color.
  • Carefully check WCAG contrast ratios for all text and UI elements to ensure accessibility for all users.

Recommended combinations

Deep Earth

Creates a strong, grounding base perfect for backgrounds, footers, or subtle gradients in dark themes.

#410F00 · #7D1F00 · #A53C00

Fiery Core

Ideal for emphasizing key content, buttons, or illustrations where a pop of vibrant energy is needed against depth.

#A53C00 · #CD5A16 · #5F1700

Molten Flow

Excellent for depicting movement or flow, using the bright orange as a highlight against the deep, dark browns.

#CD5A16 · #7D1F00 · #410F00

CSS variables

:root {
  --molten-rock-flow-2-1: #7D1F00;
  --molten-rock-flow-2-2: #A53C00;
  --molten-rock-flow-2-3: #CD5A16;
  --molten-rock-flow-2-4: #5F1700;
  --molten-rock-flow-2-5: #410F00;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "molten-rock-flow-2": {
        1: "#7D1F00",
        2: "#A53C00",
        3: "#CD5A16",
        4: "#5F1700",
        5: "#410F00",
      }
    }
  }
}

Related searches

deep volcanic palettedark orange red colorsintense earth tonesmolten rock color schemerugged brand colors

Palette colors

Hex values

Color 1#7D1F00
·
Color 2#A53C00
·
Color 3#CD5A16
·
Color 4#5F1700
·
Color 5#410F00
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
2.5:1Fail
1.3:1Fail
1.6:1Fail
2
1.6:1Fail
1.6:1Fail
2:1Fail
2.5:1Fail
3
2.5:1Fail
1.6:1Fail
3.2:1AA18
3.9:1AA18
4
1.3:1Fail
2:1Fail
3.2:1AA18
1.2:1Fail
5
1.6:1Fail
2.5:1Fail
3.9:1AA18
1.2:1Fail

Similar palettes

More like Molten Rock Flow

View all Vibrant
Indian Market Spice
Magma Flow Eruption
Aurora Blossom Dreams
Citrus Burst
City Night Electric
Coral Bloom