← Back to Editor

#F30036 · #EC96A3 · #D5C3AB · #CCA202 · #252932

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

#F30036

Vermilion · Crimson · Passion Red

HEX
#F30036
RGB
rgb(243, 0, 54)
HSL
hsl(347, 100%, 48%)
HSB
hsb(347, 100%, 95%)
CMYK
cmyk(0%, 100%, 78%, 5%)
Oklch
oklch(60.9% 0.245 22.4)

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

#EC96A3

Peach Pink · DarkSalmon · Coral Red

HEX
#EC96A3
RGB
rgb(236, 150, 163)
HSL
hsl(351, 69%, 76%)
HSB
hsb(351, 36%, 93%)
CMYK
cmyk(0%, 36%, 31%, 7%)
Oklch
oklch(76.4% 0.104 10.0)

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

#D5C3AB

Goose Yellow · Silver · Warm Sun

HEX
#D5C3AB
RGB
rgb(213, 195, 171)
HSL
hsl(34, 33%, 75%)
HSB
hsb(34, 20%, 84%)
CMYK
cmyk(0%, 8%, 20%, 16%)
Oklch
oklch(82.6% 0.038 75.1)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#CCA202

Ochre · GoldenRod · Honey Gold

HEX
#CCA202
RGB
rgb(204, 162, 2)
HSL
hsl(48, 98%, 40%)
HSB
hsb(48, 99%, 80%)
CMYK
cmyk(0%, 21%, 99%, 20%)
Oklch
oklch(73.0% 0.149 89.9)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#252932

Indigo · DarkSlateGray · Deep Sea Blue

HEX
#252932
RGB
rgb(37, 41, 50)
HSL
hsl(222, 15%, 17%)
HSB
hsb(222, 26%, 20%)
CMYK
cmyk(26%, 18%, 0%, 80%)
Oklch
oklch(28.1% 0.018 266.3)

Traditional「Indigo」· Paint「Deep Sea Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F30036
00F5C0

Analogous

F500AF
F30036
F54500

Triadic

F30036
35F500
0035F5

Split-Comp.

F30036
00F545
00AFF5

Tetradic

F30036
AFF500
00F5C0
4500F5

Contrast Matrix WCAG 2.1 Contrast

F30036
EC96A3
D5C3AB
CCA202
252932
—
1.9
Fail
2.5
Fail
1.8
Fail
3.4
AA Large
1.9
Fail
—
1.3
Fail
1.1
Fail
6.6
AA
2.5
Fail
1.3
Fail
—
1.4
Fail
8.5
AAA
1.8
Fail
1.1
Fail
1.4
Fail
—
6.1
AA
3.4
AA Large
6.6
AA
8.5
AAA
6.1
AA
—
White BG
4.3AA Large
2.2Fail
1.7Fail
2.4Fail
14.6AAA
Black BG
4.9AA
9.5AAA
12.2AAA
8.7AAA
1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

8A8829
C7C6A0
CDCDB1
BAB929
272730

Deuteranopia

98AA26
CCD29F
CED0B2
BCBF32
27262F

Tritanopia

E71F1C
E89D9D
D4B5B6
CA474E
252E2E

Achromatopsia

4F4F4F
B1B1B1
C6C6C6
9C9C9C
292929

Shades & Tints Shades & Tints

#F30036

Dark
Light

#EC96A3

Dark
Light

#D5C3AB

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f30036;
  --color-2: #ec96a3;
  --color-3: #d5c3ab;
  --color-4: #cca202;
  --color-5: #252932;
}

SCSS

$color-1: #f30036;
$color-2: #ec96a3;
$color-3: #d5c3ab;
$color-4: #cca202;
$color-5: #252932;

TAILWIND

colors: {
  'brand-1': '#f30036',
  'brand-2': '#ec96a3',
  'brand-3': '#d5c3ab',
  'brand-4': '#cca202',
  'brand-5': '#252932',
}

RGB Array

[243, 0, 54], [236, 150, 163], [213, 195, 171], [204, 162, 2], [37, 41, 50]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F30036, #EC96A3, #D5C3AB, #CCA202, #252932 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: #f30036; --color-2: #ec96a3; --color-3: #d5c3ab; --color-4: #cca202; --color-5: #252932. 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