← Back to Editor

#F11602 · #340005 · #566978 · #FA6872 · #EC9B7E

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#F11602

Vermilion · Red · Passion Red

HEX
#F11602
RGB
rgb(241, 22, 2)
HSL
hsl(5, 98%, 48%)
HSB
hsb(5, 99%, 95%)
CMYK
cmyk(0%, 91%, 99%, 5%)
Oklch
oklch(60.7% 0.242 30.0)

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

#340005

Vermilion · Black · Deep Berry

HEX
#340005
RGB
rgb(52, 0, 5)
HSL
hsl(354, 100%, 10%)
HSB
hsb(354, 100%, 20%)
CMYK
cmyk(0%, 100%, 90%, 80%)
Oklch
oklch(20.5% 0.083 21.9)

Traditional「Vermilion」· Paint「Deep Berry」· Creative Blush Sunrise

#566978

Slate Blue · DimGray · Prussian Blue

HEX
#566978
RGB
rgb(86, 105, 120)
HSL
hsl(206, 17%, 40%)
HSB
hsb(206, 28%, 47%)
CMYK
cmyk(28%, 13%, 0%, 53%)
Oklch
oklch(51.1% 0.033 242.1)

Traditional「Slate Blue」· Paint「Prussian Blue」· Creative Blush Sunrise

#FA6872

Peach Pink · Salmon · Coral Red

HEX
#FA6872
RGB
rgb(250, 104, 114)
HSL
hsl(356, 94%, 69%)
HSB
hsb(356, 58%, 98%)
CMYK
cmyk(0%, 58%, 54%, 2%)
Oklch
oklch(70.2% 0.179 18.8)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#EC9B7E

Apricot · DarkSalmon · Warm Sun

HEX
#EC9B7E
RGB
rgb(236, 155, 126)
HSL
hsl(16, 74%, 71%)
HSB
hsb(16, 47%, 93%)
CMYK
cmyk(0%, 34%, 47%, 7%)
Oklch
oklch(76.4% 0.106 40.5)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F11602
02DEF2

Analogous

F20266
F11602
F28E02

Triadic

F11602
02F216
1602F2

Split-Comp.

F11602
02F28E
0266F2

Tetradic

F11602
66F202
02DEF2
8E02F2

Contrast Matrix WCAG 2.1 Contrast

F11602
340005
566978
FA6872
EC9B7E
—
4.2
AA Large
1.3
Fail
1.5
Fail
2.0
Fail
4.2
AA Large
—
3.2
AA Large
6.3
AA
8.3
AAA
1.3
Fail
3.2
AA Large
—
2.0
Fail
2.6
Fail
1.5
Fail
6.3
AA
2.0
Fail
—
1.3
Fail
2.0
Fail
8.3
AAA
2.6
Fail
1.3
Fail
—
White BG
4.3AA Large
18.3AAA
5.7AA
2.9Fail
2.2Fail
Black BG
4.9AA
1.1Fail
3.7AA Large
7.3AAA
9.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

929007
1D1D04
5E5E74
BBB970
C9C885

Deuteranopia

9FAF08
212404
5D5C74
C3CE6F
CED487

Tritanopia

E60B0C
310303
577271
F36E6D
E88B8C

Achromatopsia

555555
101010
656565
959595
B0B0B0

Shades & Tints Shades & Tints

#F11602

Dark
Light

#340005

Dark
Light

#566978

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f11602;
  --color-2: #340005;
  --color-3: #566978;
  --color-4: #fa6872;
  --color-5: #ec9b7e;
}

SCSS

$color-1: #f11602;
$color-2: #340005;
$color-3: #566978;
$color-4: #fa6872;
$color-5: #ec9b7e;

TAILWIND

colors: {
  'brand-1': '#f11602',
  'brand-2': '#340005',
  'brand-3': '#566978',
  'brand-4': '#fa6872',
  'brand-5': '#ec9b7e',
}

RGB Array

[241, 22, 2], [52, 0, 5], [86, 105, 120], [250, 104, 114], [236, 155, 126]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F11602, #340005, #566978, #FA6872, #EC9B7E 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: #f11602; --color-2: #340005; --color-3: #566978; --color-4: #fa6872; --color-5: #ec9b7e. 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