What are the hex codes in the Royal Flame palette?

The Royal Flame color palette consists of Indigo #3A0CA3, Rose #F72585, Orange #FF9E00, Snow #F8F9FA.

How should I use the Royal Flame palette on a website?

Use Snow #F8F9FA as the background, Indigo #3A0CA3 for text, Orange #FF9E00 for buttons and links, and Rose #F72585 for accents. 2 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Indigo on Snow at 11.31:1.

Which colors in Royal Flame have enough contrast for text?

The highest-contrast pair is #3A0CA3 on #F8F9FA with a ratio of 11.31:1, which passes WCAG AA for normal text.

#3A0CA3Indigo

#F72585Rose

#FF9E00Orange

#F8F9FASnow

Royal Flame color palette

Vibrant Neon Pink Orange White

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Indigo	`#3A0CA3`	`rgb(58, 12, 163)`	`hsl(258, 86%, 34%)`	`oklch(36.2% 0.206 283)`
Rose	`#F72585`	`rgb(247, 37, 133)`	`hsl(333, 93%, 56%)`	`oklch(64.3% 0.244 1)`
Orange	`#FF9E00`	`rgb(255, 158, 0)`	`hsl(37, 100%, 50%)`	`oklch(78.0% 0.172 67)`
Snow	`#F8F9FA`	`rgb(248, 249, 250)`	`hsl(210, 17%, 98%)`	`oklch(98.2% 0.002 248)`

Why it works and how to use it

Royal Flame is a vivid complementary color palette tagged vibrant, neon, pink. Near-complementary hues (about 139° apart) make this a high-contrast, attention-grabbing combination. Saturation runs high, so use the brightest color sparingly and let the others carry the surface area. Warm and cool hues are mixed, which adds depth.

With 3 chromatic colors, Orange takes the lead while the rest support. Lightness runs from 34% to 98%. Well suited to websites, presentations and branding.

Background: Snow (#F8F9FA) is the lightest color, so it belongs on large surfaces.
Text: Indigo (#3A0CA3) on #F8F9FA gives 11.31:1, passing WCAG AAA.
Primary: Orange (#FF9E00) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
Accent: Rose (#F72585) for highlights, badges and hover states.

2 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Indigo on Snow at 11.31:1.

Preview on a real UI see how the palette feels in context

BrandFeaturesPricingBlogGet started

Design faster with Royal Flame

A palette preview that turns four colors into a page, so you can judge hierarchy, contrast and mood before you commit.

Primary action Secondary

Card title

Roles are assigned by lightness.

Color blindness simulation

#3A0CA3

#F72585

#FF9E00

#F8F9FA

Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.

Palette card

Contrast check WCAG ratios between palette colors

Pair	Sample	Ratio	Level
`#3A0CA3` on `#F8F9FA`	Aa	11.31:1	AAA
`#3A0CA3` on `#FF9E00`	Aa	5.76:1	AA
`#F72585` on `#F8F9FA`	Aa	3.58:1	AA large only
`#3A0CA3` on `#F72585`	Aa	3.16:1	AA large only
`#FF9E00` on `#F8F9FA`	Aa	1.96:1	Fail
`#F72585` on `#FF9E00`	Aa	1.82:1	Fail

Similar palettes 24 more in this mood