← Back to Editor

#5E3547 · #FFECC4 · #F7C087 · #EF6855 · #CD534E

sunset

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

#5E3547

Dark Violet · DarkSlateGray · Camellia

HEX
#5E3547
RGB
rgb(94, 53, 71)
HSL
hsl(334, 28%, 29%)
HSB
hsb(334, 44%, 37%)
CMYK
cmyk(0%, 44%, 24%, 63%)
Oklch
oklch(38.6% 0.064 352.7)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#FFECC4

Goose Yellow · Bisque · Lemon Cream

HEX
#FFECC4
RGB
rgb(255, 236, 196)
HSL
hsl(41, 100%, 88%)
HSB
hsb(41, 23%, 100%)
CMYK
cmyk(0%, 7%, 23%, 0%)
Oklch
oklch(94.8% 0.056 85.6)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#F7C087

Goose Yellow · BurlyWood · Warm Sun

HEX
#F7C087
RGB
rgb(247, 192, 135)
HSL
hsl(31, 88%, 75%)
HSB
hsb(31, 45%, 97%)
CMYK
cmyk(0%, 22%, 45%, 3%)
Oklch
oklch(84.5% 0.097 66.9)

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

#EF6855

Peach Pink · Tomato · Coral Red

HEX
#EF6855
RGB
rgb(239, 104, 85)
HSL
hsl(7, 83%, 64%)
HSB
hsb(7, 64%, 94%)
CMYK
cmyk(0%, 56%, 64%, 6%)
Oklch
oklch(68.1% 0.171 30.2)

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

#CD534E

Crimson · Tomato · Passion Red

HEX
#CD534E
RGB
rgb(205, 83, 78)
HSL
hsl(2, 56%, 55%)
HSB
hsb(2, 62%, 80%)
CMYK
cmyk(0%, 60%, 62%, 20%)
Oklch
oklch(60.0% 0.156 25.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

5E3547
355F4D

Analogous

5F355C
5E3547
5F3835

Triadic

5E3547
475F35
35475F

Split-Comp.

5E3547
355F38
355C5F

Tetradic

5E3547
5C5F35
355F4D
38355F

Contrast Matrix WCAG 2.1 Contrast

5E3547
FFECC4
F7C087
EF6855
CD534E
—
8.7
AAA
6.2
AA
3.3
AA Large
2.4
Fail
8.7
AAA
—
1.4
Fail
2.7
Fail
3.7
AA Large
6.2
AA
1.4
Fail
—
1.9
Fail
2.6
Fail
3.3
AA Large
2.7
Fail
1.9
Fail
—
1.4
Fail
2.4
Fail
3.7
AA Large
2.6
Fail
1.4
Fail
—
White BG
10.1AAA
1.2Fail
1.6Fail
3.1AA Large
4.2AA Large
Black BG
2.1Fail
18.0AAA
12.8AAA
6.8AA
4.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

4C4C43
F7F7CE
DFDF95
B5B35A
98974F

Deuteranopia

4F5242
F8F9D0
E2E698
BCC65B
9FA850

Tritanopia

5C3F3E
FED5D7
F4A0A2
E85D5E
C75050

Achromatopsia

434343
EDEDED
CACACA
8E8E8E
777777

Shades & Tints Shades & Tints

#5E3547

Dark
Light

#FFECC4

Dark
Light

#F7C087

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #5e3547;
  --color-2: #ffecc4;
  --color-3: #f7c087;
  --color-4: #ef6855;
  --color-5: #cd534e;
}

SCSS

$color-1: #5e3547;
$color-2: #ffecc4;
$color-3: #f7c087;
$color-4: #ef6855;
$color-5: #cd534e;

TAILWIND

colors: {
  'brand-1': '#5e3547',
  'brand-2': '#ffecc4',
  'brand-3': '#f7c087',
  'brand-4': '#ef6855',
  'brand-5': '#cd534e',
}

RGB Array

[94, 53, 71], [255, 236, 196], [247, 192, 135], [239, 104, 85], [205, 83, 78]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #5E3547, #FFECC4, #F7C087, #EF6855, #CD534E 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: #5e3547; --color-2: #ffecc4; --color-3: #f7c087; --color-4: #ef6855; --color-5: #cd534e. 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 sunset-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