← Back to Editor

#DE5E55 · #ED7E60 · #F5B06D · #C84D4F · #F39967

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 App

Color Details Color Details

#DE5E55

Vermilion · Tomato · Passion Red

HEX
#DE5E55
RGB
rgb(222, 94, 85)
HSL
hsl(4, 67%, 60%)
HSB
hsb(4, 62%, 87%)
CMYK
cmyk(0%, 58%, 62%, 13%)
Oklch
oklch(64.2% 0.162 26.6)

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

#ED7E60

Peach Pink · Salmon · Coral Red

HEX
#ED7E60
RGB
rgb(237, 126, 96)
HSL
hsl(13, 80%, 65%)
HSB
hsb(13, 59%, 93%)
CMYK
cmyk(0%, 47%, 59%, 7%)
Oklch
oklch(71.2% 0.144 36.1)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#F5B06D

Ginger · SandyBrown · Warm Sun

HEX
#F5B06D
RGB
rgb(245, 176, 109)
HSL
hsl(30, 87%, 69%)
HSB
hsb(30, 56%, 96%)
CMYK
cmyk(0%, 28%, 56%, 4%)
Oklch
oklch(80.9% 0.116 64.1)

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

#C84D4F

Crimson · Sienna · Passion Red

HEX
#C84D4F
RGB
rgb(200, 77, 79)
HSL
hsl(359, 53%, 54%)
HSB
hsb(359, 62%, 78%)
CMYK
cmyk(0%, 62%, 61%, 22%)
Oklch
oklch(58.5% 0.157 22.4)

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

#F39967

Apricot · SandyBrown · Warm Sun

HEX
#F39967
RGB
rgb(243, 153, 103)
HSL
hsl(21, 85%, 68%)
HSB
hsb(21, 58%, 95%)
CMYK
cmyk(0%, 37%, 58%, 5%)
Oklch
oklch(76.5% 0.127 49.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DE5E55
55D4DD

Analogous

DD5590
DE5E55
DDA255

Triadic

DE5E55
55DD5E
5E55DD

Split-Comp.

DE5E55
55DDA2
5590DD

Tetradic

DE5E55
90DD55
55D4DD
A255DD

Contrast Matrix WCAG 2.1 Contrast

DE5E55
ED7E60
F5B06D
C84D4F
F39967
—
1.3
Fail
1.9
Fail
1.3
Fail
1.6
Fail
1.3
Fail
—
1.5
Fail
1.7
Fail
1.2
Fail
1.9
Fail
1.5
Fail
—
2.4
Fail
1.2
Fail
1.3
Fail
1.7
Fail
2.4
Fail
—
2.1
Fail
1.6
Fail
1.2
Fail
1.2
Fail
2.1
Fail
—
White BG
3.6AA Large
2.7Fail
1.9Fail
4.5AA
2.2Fail
Black BG
5.8AA
7.8AAA
11.3AAA
4.6AA
9.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A7A557
BDBC67
D7D77D
93924F
CCCB73

Deuteranopia

AEB858
C3CC69
DBE081
9AA34E
D1D876

Tritanopia

D85959
E76D6E
F28A8D
C24E4E
EF7D7F

Achromatopsia

838383
9C9C9C
BDBDBD
727272
AEAEAE

Shades & Tints Shades & Tints

#DE5E55

Dark
Light

#ED7E60

Dark
Light

#F5B06D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #de5e55;
  --color-2: #ed7e60;
  --color-3: #f5b06d;
  --color-4: #c84d4f;
  --color-5: #f39967;
}

SCSS

$color-1: #de5e55;
$color-2: #ed7e60;
$color-3: #f5b06d;
$color-4: #c84d4f;
$color-5: #f39967;

TAILWIND

colors: {
  'brand-1': '#de5e55',
  'brand-2': '#ed7e60',
  'brand-3': '#f5b06d',
  'brand-4': '#c84d4f',
  'brand-5': '#f39967',
}

RGB Array

[222, 94, 85], [237, 126, 96], [245, 176, 109], [200, 77, 79], [243, 153, 103]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #DE5E55, #ED7E60, #F5B06D, #C84D4F, #F39967 is ideal for: social media posters, mobile apps, e-commerce promos. Vivid colors effectively attract user attention. 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: #de5e55; --color-2: #ed7e60; --color-3: #f5b06d; --color-4: #c84d4f; --color-5: #f39967. 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. 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