← Back to Editor

#CFCE58 · #EF8551 · #D5535B · #48394E · #016C64

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

#CFCE58

Autumn Sage · BurlyWood · Sunflower

HEX
#CFCE58
RGB
rgb(207, 206, 88)
HSL
hsl(59, 55%, 58%)
HSB
hsb(59, 57%, 81%)
CMYK
cmyk(0%, 0%, 57%, 19%)
Oklch
oklch(82.9% 0.140 108.6)

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

#EF8551

Apricot · Coral · Warm Sun

HEX
#EF8551
RGB
rgb(239, 133, 81)
HSL
hsl(20, 83%, 63%)
HSB
hsb(20, 66%, 94%)
CMYK
cmyk(0%, 44%, 66%, 6%)
Oklch
oklch(72.3% 0.146 45.7)

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

#D5535B

Vermilion · Tomato · Passion Red

HEX
#D5535B
RGB
rgb(213, 83, 91)
HSL
hsl(356, 61%, 58%)
HSB
hsb(356, 61%, 84%)
CMYK
cmyk(0%, 61%, 57%, 16%)
Oklch
oklch(61.5% 0.164 19.7)

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

#48394E

Dark Plum · DarkSlateGray · Eggplant

HEX
#48394E
RGB
rgb(72, 57, 78)
HSL
hsl(283, 16%, 26%)
HSB
hsb(283, 27%, 31%)
CMYK
cmyk(8%, 27%, 0%, 69%)
Oklch
oklch(36.9% 0.040 316.2)

Traditional「Dark Plum」· Paint「Eggplant」· Creative Blush Sunrise

#016C64

Mineral Blue · Teal · Peacock Green

HEX
#016C64
RGB
rgb(1, 108, 100)
HSL
hsl(176, 98%, 21%)
HSB
hsb(176, 99%, 42%)
CMYK
cmyk(99%, 0%, 7%, 58%)
Oklch
oklch(47.8% 0.084 185.9)

Traditional「Mineral Blue」· Paint「Peacock Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CFCE58
595BCF

Analogous

CF9259
CFCE58
96CF59

Triadic

CFCE58
59CFCD
CD59CF

Split-Comp.

CFCE58
5996CF
9259CF

Tetradic

CFCE58
59CF92
595BCF
CF5996

Contrast Matrix WCAG 2.1 Contrast

CFCE58
EF8551
D5535B
48394E
016C64
—
1.5
Fail
2.4
Fail
6.4
AA
3.8
AA Large
1.5
Fail
—
1.6
Fail
4.1
AA Large
2.4
Fail
2.4
Fail
1.6
Fail
—
2.6
Fail
1.6
Fail
6.4
AA
4.1
AA Large
2.6
Fail
—
1.7
Fail
3.8
AA Large
2.4
Fail
1.6
Fail
1.7
Fail
—
White BG
1.7Fail
2.6Fail
4.0AA Large
10.7AAA
6.3AA
Black BG
12.6AAA
8.1AAA
5.2AA
2.0Fail
3.3AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

CFCF75
C1C05E
9D9C59
424149
2F3066

Deuteranopia

CFCF7B
C7CF61
A4AE59
424448
292166

Tritanopia

CF8B90
EA686A
CF5857
474544
066768

Achromatopsia

C1C1C1
9F9F9F
7B7B7B
404040
4B4B4B

Shades & Tints Shades & Tints

#CFCE58

Dark
Light

#EF8551

Dark
Light

#D5535B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cfce58;
  --color-2: #ef8551;
  --color-3: #d5535b;
  --color-4: #48394e;
  --color-5: #016c64;
}

SCSS

$color-1: #cfce58;
$color-2: #ef8551;
$color-3: #d5535b;
$color-4: #48394e;
$color-5: #016c64;

TAILWIND

colors: {
  'brand-1': '#cfce58',
  'brand-2': '#ef8551',
  'brand-3': '#d5535b',
  'brand-4': '#48394e',
  'brand-5': '#016c64',
}

RGB Array

[207, 206, 88], [239, 133, 81], [213, 83, 91], [72, 57, 78], [1, 108, 100]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CFCE58, #EF8551, #D5535B, #48394E, #016C64 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: #cfce58; --color-2: #ef8551; --color-3: #d5535b; --color-4: #48394e; --color-5: #016c64. 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