Back to palettes

Palette

Molten Rock Flow

A vibrant and intense palette capturing the powerful glow and heat of flowing molten rock.

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

#F14E3F#CC3B2F#A82B24#7D1F1C#5C1513

Palette guide

How to use Molten Rock Flow

Overview

The Molten Rock Flow palette (ID: molten-rock-flow-4) embodies the powerful glow and heat of flowing molten rock through a sophisticated gradient of deep reds. From the vibrant #F14E3F to the profound #5C1513, this palette offers a rich, intense, and elegant range of hues. Key colors like the balanced #CC3B2F and the strong #A82B24 provide a sense of grounded power. Designers can utilize this palette to craft visually striking and emotionally resonant projects. Developers will find these colors ideal for creating immersive digital experiences, high-end branding, or editorial designs where a sense of luxury, drama, and intensity is desired. Its cohesive red spectrum ensures harmony.

Best used for

  • Luxury product branding and packaging
  • Sophisticated web and editorial design
  • Cinematic title sequences and visual effects
  • High-fashion and beauty industry branding
  • Dramatic interior design concepts
  • Elegant event and gala branding

Suggested color roles

primary

Designate #CC3B2F as the primary color for a rich, balanced red that commands attention without being overpowering.

secondary

Employ #A82B24 for supporting elements, subheadings, or borders to add depth and a more serious tone.

accent

Apply #F14E3F for vibrant highlights, interactive elements, or a burst of energy to draw the eye.

background

Use #7D1F1C for a deep, sophisticated background, or pair with a dark neutral like charcoal for a contrasting base.

text

White or a very light grey offers excellent contrast for text on darker shades like #5C1513. For lighter backgrounds, a dark charcoal is recommended.

Accessibility notes

  • Light text (white or very pale grey) is crucial for readability on all darker reds within this palette.
  • Avoid using adjacent reds for text and background, as contrast may be insufficient for accessibility.
  • Ensure interactive elements using #F14E3F have a clear focus indicator, as its vibrancy can be intense.
  • Utilize a contrast checker to confirm WCAG AA or AAA compliance for all text and interactive UI components.

Recommended combinations

Elegant Depth

Perfect for creating deep, sophisticated backgrounds, shadows, or gradients that convey luxury and seriousness.

#5C1513 · #7D1F1C · #A82B24

Vibrant Core

Ideal for showcasing key information, calls to action, or dynamic graphics with a clear progression of intensity.

#A82B24 · #CC3B2F · #F14E3F

Subtle Heat

Excellent for layered designs, allowing the brighter red to act as a vibrant highlight against a deeper, more muted base.

#7D1F1C · #CC3B2F · #F14E3F

CSS variables

:root {
  --molten-rock-flow-4-1: #F14E3F;
  --molten-rock-flow-4-2: #CC3B2F;
  --molten-rock-flow-4-3: #A82B24;
  --molten-rock-flow-4-4: #7D1F1C;
  --molten-rock-flow-4-5: #5C1513;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "molten-rock-flow-4": {
        1: "#F14E3F",
        2: "#CC3B2F",
        3: "#A82B24",
        4: "#7D1F1C",
        5: "#5C1513",
      }
    }
  }
}

Related searches

deep red elegant palettevolcanic red gradientsophisticated fiery colorsintense red brandingmolten lava red scheme

Palette colors

Hex values

Color 1#F14E3F
·
Color 2#CC3B2F
·
Color 3#A82B24
·
Color 4#7D1F1C
·
Color 5#5C1513
·

Accessibility

Contrast checker

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

Similar palettes

More like Molten Rock Flow

View all vibrant