← Back to Editor

#420063 · #A608F6 · #F7659D · #FF8E30 · #F4E21F

bright

A 5-color bright palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#420063

Royal Purple · MidnightBlue · Dark Purple

HEX
#420063
RGB
rgb(66, 0, 99)
HSL
hsl(280, 100%, 19%)
HSB
hsb(280, 100%, 39%)
CMYK
cmyk(33%, 100%, 0%, 61%)
Oklch
oklch(29.5% 0.150 308.9)

Traditional「Royal Purple」· Paint「Dark Purple」· Creative Blush Sunrise

#A608F6

Royal Purple · DarkViolet · Violet

HEX
#A608F6
RGB
rgb(166, 8, 246)
HSL
hsl(280, 94%, 50%)
HSB
hsb(280, 97%, 96%)
CMYK
cmyk(33%, 97%, 0%, 4%)
Oklch
oklch(57.0% 0.289 307.6)

Traditional「Royal Purple」· Paint「Violet」· Creative Blush Sunrise

#F7659D

Rouge · LightCoral · Rose Pink

HEX
#F7659D
RGB
rgb(247, 101, 157)
HSL
hsl(337, 90%, 68%)
HSB
hsb(337, 59%, 97%)
CMYK
cmyk(0%, 59%, 36%, 3%)
Oklch
oklch(70.5% 0.186 359.1)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

#FF8E30

Tangerine · Coral · Warm Sun

HEX
#FF8E30
RGB
rgb(255, 142, 48)
HSL
hsl(27, 100%, 59%)
HSB
hsb(27, 81%, 100%)
CMYK
cmyk(0%, 44%, 81%, 0%)
Oklch
oklch(75.5% 0.169 55.0)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#F4E21F

Autumn Sage · Gold · Sunflower

HEX
#F4E21F
RGB
rgb(244, 226, 31)
HSL
hsl(55, 91%, 54%)
HSB
hsb(55, 87%, 96%)
CMYK
cmyk(0%, 7%, 87%, 4%)
Oklch
oklch(89.9% 0.185 103.5)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

420063
206100

Analogous

100061
420063
610051

Triadic

420063
614100
006141

Split-Comp.

420063
516100
006110

Tetradic

420063
611000
206100
005161

Contrast Matrix WCAG 2.1 Contrast

420063
A608F6
F7659D
FF8E30
F4E21F
—
2.8
Fail
5.2
AA
6.5
AA
11.2
AAA
2.8
Fail
—
1.8
Fail
2.3
Fail
3.9
AA Large
5.2
AA
1.8
Fail
—
1.3
Fail
2.2
Fail
6.5
AA
2.3
Fail
1.3
Fail
—
1.7
Fail
11.2
AAA
3.9
AA Large
2.2
Fail
1.7
Fail
—
White BG
14.9AAA
5.3AA
2.9Fail
2.3Fail
1.3Fail
Black BG
1.4Fail
4.0AA Large
7.3AAA
9.2AAA
15.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

25254B
6260BC
B8B68F
CECD47
ECEC4E

Deuteranopia

292E45
6B77AF
C0CB8C
D5DD4C
EDEF5A

Tritanopia

3F3834
9E8F85
F08582
F9595D
F3737C

Achromatopsia

1F1F1F
525252
979797
A5A5A5
D1D1D1

Shades & Tints Shades & Tints

#420063

Dark
Light

#A608F6

Dark
Light

#F7659D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #420063;
  --color-2: #a608f6;
  --color-3: #f7659d;
  --color-4: #ff8e30;
  --color-5: #f4e21f;
}

SCSS

$color-1: #420063;
$color-2: #a608f6;
$color-3: #f7659d;
$color-4: #ff8e30;
$color-5: #f4e21f;

TAILWIND

colors: {
  'brand-1': '#420063',
  'brand-2': '#a608f6',
  'brand-3': '#f7659d',
  'brand-4': '#ff8e30',
  'brand-5': '#f4e21f',
}

RGB Array

[66, 0, 99], [166, 8, 246], [247, 101, 157], [255, 142, 48], [244, 226, 31]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This bright-style palette of #420063, #A608F6, #F7659D, #FF8E30, #F4E21F is ideal for: social media posters, mobile apps, e-commerce promos, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #420063; --color-2: #a608f6; --color-3: #f7659d; --color-4: #ff8e30; --color-5: #f4e21f. LangColor editor supports one-click export to CSS, SCSS, Tailwind, JSON and more. Click the "Export" button to choose your format.

What UI/UX design tips apply to this palette?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. High-contrast palettes naturally meet WCAG accessibility standards. Use the "Contrast Matrix" tool in LangColor editor to check WCAG accessibility levels for every color pair.

Which industries or brands suit this palette?

This bright-style 5-color scheme is especially suited for food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. Click "AI Analysis" in the editor for more detailed brand color suggestions.

🎨 Open this palette in Editor →

Generated by LangColor online color tool · Breaking the barrier between language and color