Back to palettes

Palette

Fiery Dragon Scales

An intense, fiery blend of deep reds, evoking the majestic, dangerous beauty of a dragon's scales.

vibrantenergetic5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Fiery Dragon Scales 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 Dragon Scales.

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

Data visualization

#8B0000#B22222#DC143C#6E0000#C7253D

Palette guide

How to use Fiery Dragon Scales

Overview

The 'Fiery Dragon Scales' palette (ID: fiery-dragon-scales-3) offers an intense and fiery blend of deep reds, evoking the majestic and dangerous beauty of a dragon's scales. This powerful collection features a robust dark red (#8B0000) as its foundation, complemented by vivid, strong reds like #B22222 and #C7253D. A striking crimson (#DC143C) provides a brilliant accent, while an even darker base (#6E0000) adds profound depth. This palette is designed for designers and developers seeking to convey raw power, drama, and a touch of mythical grandeur in their projects.

Best used for

  • Fantasy RPG visual branding and environments
  • Intense movie or game title screens
  • Luxury or high-performance product branding
  • Dramatic event promotions and posters
  • Gothic or dark fantasy website designs
  • Powerful web headers and hero sections

Suggested color roles

primary

#8B0000 serves as a commanding primary color for foundational elements, strong headings, and brand identity.

secondary

#B22222 for supporting information, key UI components, or secondary calls to action, maintaining intensity.

accent

#DC143C provides a striking accent for calls to action, warnings, or interactive highlights that demand attention.

background

#6E0000 offers a deep, rich, and dramatic backdrop, allowing the brighter reds to pop effectively.

text

Use #DC143C for lighter text on dark backgrounds, or a pure white/light gray for general readability on #6E0000 or #8B0000.

Accessibility notes

  • Ensure #DC143C provides sufficient contrast on #6E0000 for legible text, especially for larger fonts.
  • Darker reds like #8B0000 and #6E0000 require very light text (e.g., white) for readability.
  • Avoid using #B22222 text on #8B0000 background for small font sizes due to low contrast.
  • Test colorblind compatibility, as the close red tones might be challenging for some users.

Recommended combinations

Dramatic Banner

For a powerful, eye-catching banner with a deep base, strong title, and vibrant accent.

#6E0000 · #8B0000 · #DC143C

Interactive Button

A button with a vibrant hover/active state and a deep, grounding text color.

#B22222 · #DC143C · #6E0000

Text Emphasis

A dark background with bold, readable accents for key information.

#6E0000 · #C7253D · #8B0000

CSS variables

:root {
  --fiery-dragon-scales-3-1: #8B0000;
  --fiery-dragon-scales-3-2: #B22222;
  --fiery-dragon-scales-3-3: #DC143C;
  --fiery-dragon-scales-3-4: #6E0000;
  --fiery-dragon-scales-3-5: #C7253D;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "fiery-dragon-scales-3": {
        1: "#8B0000",
        2: "#B22222",
        3: "#DC143C",
        4: "#6E0000",
        5: "#C7253D",
      }
    }
  }
}

Related searches

deep red color schemepowerful crimson palettedragon-inspired colorsintense red brandinggothic fantasy palette

Palette colors

Hex values

Color 1#8B0000
·
Color 2#B22222
·
Color 3#DC143C
·
Color 4#6E0000
·
Color 5#C7253D
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
2:1Fail
1.3:1Fail
1.8:1Fail
2
1.5:1Fail
1.3:1Fail
1.9:1Fail
1.2:1Fail
3
2:1Fail
1.3:1Fail
2.5:1Fail
1.1:1Fail
4
1.3:1Fail
1.9:1Fail
2.5:1Fail
2.3:1Fail
5
1.8:1Fail
1.2:1Fail
1.1:1Fail
2.3:1Fail

Similar palettes

More like Fiery Dragon Scales

View all vibrant