Back to palettes

Palette

Fiery Dragon Scale

Intense reds and oranges, mimicking the legendary, shimmering scales of a fire-breathing dragon.

vibrantenergetic5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#8A0303#BA1D02#E23B06#F86A1D#FCAA46

Palette guide

How to use Fiery Dragon Scale

Overview

The Fiery Dragon Scale palette features intense reds and oranges, mimicking the legendary, shimmering scales of a fire-breathing dragon. This vibrant collection ranges from deep #8A0303 and #BA1D02 to fiery #E23B06, #F86A1D, and a bright #FCAA46. It's an excellent choice for designers and developers aiming to create powerful, energetic, and captivating visual experiences. The palette's high contrast and warm, dynamic tones make it ideal for commanding attention, conveying strength, and injecting a sense of mythical adventure into any project, from branding to digital art.

Best used for

  • fantasy gaming UI/UX
  • bold and energetic branding
  • action-oriented website design
  • mythology-themed illustrations
  • fire and lava visual effects
  • dramatic marketing campaigns

Suggested color roles

primary

#E23B06 for high-impact calls to action, main headings, or focal points that demand immediate attention.

secondary

#BA1D02 for supporting content, navigation, or secondary buttons, adding depth and intensity.

accent

#FCAA46 for bright highlights, small icons, or interactive elements needing a warm, glowing pop.

background

#8A0303 for a deep, powerful backdrop, or #BA1D02 for a slightly brighter, intense base.

text

Use white or a very light cream for text on darker colors like #8A0303 and #BA1D02, and a deep charcoal for lighter backgrounds.

Accessibility notes

  • White text will provide excellent contrast against #8A0303, #BA1D02, and #E23B06.
  • Ensure sufficient contrast when using #FCAA46 text on #E23B06 or #F86A1D backgrounds.
  • Avoid placing #F86A1D text directly on #E23B06 for small text; increase font size or weight.
  • For improved readability, use a darker text color (e.g., deep charcoal) on #FCAA46.

Recommended combinations

Dragon's Breath

Creates a powerful, intense gradient for hero sections or dramatic visual statements.

#8A0303 · #BA1D02 · #E23B06

Fiery Glow

A vibrant blend for highlights and interactive elements, evoking a bright, energetic shimmer.

#E23B06 · #F86A1D · #FCAA46

Molten Core

Ideal for UI cards or sections where a strong red base needs a bright, glowing accent.

#BA1D02 · #E23B06 · #FCAA46

CSS variables

:root {
  --fiery-dragon-scale-1: #8A0303;
  --fiery-dragon-scale-2: #BA1D02;
  --fiery-dragon-scale-3: #E23B06;
  --fiery-dragon-scale-4: #F86A1D;
  --fiery-dragon-scale-5: #FCAA46;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "fiery-dragon-scale": {
        1: "#8A0303",
        2: "#BA1D02",
        3: "#E23B06",
        4: "#F86A1D",
        5: "#FCAA46",
      }
    }
  }
}

Related searches

dragon color schemefiery red orange palettemythical creature colorslava hot color palettebold energetic design

Palette colors

Hex values

Color 1#8A0303
·
Color 2#BA1D02
·
Color 3#E23B06
·
Color 4#F86A1D
·
Color 5#FCAA46
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
2.3:1Fail
3.4:1AA18
5.2:1AA
2
1.6:1Fail
1.5:1Fail
2.2:1Fail
3.4:1AA18
3
2.3:1Fail
1.5:1Fail
1.5:1Fail
2.3:1Fail
4
3.4:1AA18
2.2:1Fail
1.5:1Fail
1.6:1Fail
5
5.2:1AA
3.4:1AA18
2.3:1Fail
1.6:1Fail

Similar palettes

More like Fiery Dragon Scale

View all vibrant