← Back to Editor

#450E3E · #B200AD · #D1143E · #F7632F · #F7972F

A 5-color palette 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

#450E3E

Rose Purple · MidnightBlue · Dark Purple

HEX
#450E3E
RGB
rgb(69, 14, 62)
HSL
hsl(308, 66%, 16%)
HSB
hsb(308, 80%, 27%)
CMYK
cmyk(0%, 80%, 10%, 73%)
Oklch
oklch(28.2% 0.103 333.6)

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

#B200AD

Rose Purple · DarkViolet · Eggplant

HEX
#B200AD
RGB
rgb(178, 0, 173)
HSL
hsl(302, 100%, 35%)
HSB
hsb(302, 100%, 70%)
CMYK
cmyk(0%, 100%, 3%, 30%)
Oklch
oklch(53.3% 0.243 329.9)

Traditional「Rose Purple」· Paint「Eggplant」· Creative Blush Sunrise

#D1143E

Vermilion · Crimson · Passion Red

HEX
#D1143E
RGB
rgb(209, 20, 62)
HSL
hsl(347, 83%, 45%)
HSB
hsb(347, 90%, 82%)
CMYK
cmyk(0%, 90%, 70%, 18%)
Oklch
oklch(55.1% 0.213 18.5)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

#F7632F

Tangerine · Tomato · Warm Sun

HEX
#F7632F
RGB
rgb(247, 99, 47)
HSL
hsl(16, 93%, 58%)
HSB
hsb(16, 81%, 97%)
CMYK
cmyk(0%, 60%, 81%, 3%)
Oklch
oklch(68.2% 0.193 38.5)

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

#F7972F

Ginger · GoldenRod · Warm Sun

HEX
#F7972F
RGB
rgb(247, 151, 47)
HSL
hsl(31, 93%, 58%)
HSB
hsb(31, 81%, 97%)
CMYK
cmyk(0%, 39%, 81%, 3%)
Oklch
oklch(76.0% 0.159 62.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

450E3E
0E4415

Analogous

300E44
450E3E
440E22

Triadic

450E3E
3D440E
0E3D44

Split-Comp.

450E3E
22440E
0E4430

Tetradic

450E3E
44300E
0E4415
0E2244

Contrast Matrix WCAG 2.1 Contrast

450E3E
B200AD
D1143E
F7632F
F7972F
—
2.5
Fail
2.8
Fail
4.9
AA
6.8
AA
2.5
Fail
—
1.1
Fail
1.9
Fail
2.7
Fail
2.8
Fail
1.1
Fail
—
1.7
Fail
2.4
Fail
4.9
AA
1.9
Fail
1.7
Fail
—
1.4
Fail
6.8
AA
2.7
Fail
2.4
Fail
1.4
Fail
—
White BG
15.2AAA
6.0AA
5.4AA
3.1AA Large
2.2Fail
Black BG
1.4Fail
3.5AA Large
3.9AA Large
6.8AA
9.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2D2D32
656383
7F7D34
B7B63C
CDCD48

Deuteranopia

303530
6F7D79
8A9831
C0CB3F
D3DA4E

Tritanopia

422927
A9625B
C82C2A
F04648
F25C60

Achromatopsia

242424
494949
515151
898989
A8A8A8

Shades & Tints Shades & Tints

#450E3E

Dark
Light

#B200AD

Dark
Light

#D1143E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #450e3e;
  --color-2: #b200ad;
  --color-3: #d1143e;
  --color-4: #f7632f;
  --color-5: #f7972f;
}

SCSS

$color-1: #450e3e;
$color-2: #b200ad;
$color-3: #d1143e;
$color-4: #f7632f;
$color-5: #f7972f;

TAILWIND

colors: {
  'brand-1': '#450e3e',
  'brand-2': '#b200ad',
  'brand-3': '#d1143e',
  'brand-4': '#f7632f',
  'brand-5': '#f7972f',
}

RGB Array

[69, 14, 62], [178, 0, 173], [209, 20, 62], [247, 99, 47], [247, 151, 47]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #450E3E, #B200AD, #D1143E, #F7632F, #F7972F 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: #450e3e; --color-2: #b200ad; --color-3: #d1143e; --color-4: #f7632f; --color-5: #f7972f. 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 general-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