← Back to Editor

#F8DB89 · #E6A858 · #CCC982 · #D65712 · #B31212

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 App

Color Details Color Details

#F8DB89

Goose Yellow · Khaki · Sunflower

HEX
#F8DB89
RGB
rgb(248, 219, 137)
HSL
hsl(44, 89%, 75%)
HSB
hsb(44, 45%, 97%)
CMYK
cmyk(0%, 12%, 45%, 3%)
Oklch
oklch(89.8% 0.106 90.6)

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

#E6A858

Ginger · SandyBrown · Warm Sun

HEX
#E6A858
RGB
rgb(230, 168, 88)
HSL
hsl(34, 74%, 62%)
HSB
hsb(34, 62%, 90%)
CMYK
cmyk(0%, 27%, 62%, 10%)
Oklch
oklch(77.5% 0.121 71.3)

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

#CCC982

Fresh Green · Tan · Sunflower

HEX
#CCC982
RGB
rgb(204, 201, 130)
HSL
hsl(58, 42%, 65%)
HSB
hsb(58, 36%, 80%)
CMYK
cmyk(0%, 1%, 36%, 20%)
Oklch
oklch(82.2% 0.092 106.2)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#D65712

Tangerine · Chocolate · Amber Brown

HEX
#D65712
RGB
rgb(214, 87, 18)
HSL
hsl(21, 84%, 45%)
HSB
hsb(21, 92%, 84%)
CMYK
cmyk(0%, 59%, 92%, 16%)
Oklch
oklch(61.4% 0.175 43.0)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#B31212

Vermilion · FireBrick · Wine Red

HEX
#B31212
RGB
rgb(179, 18, 18)
HSL
hsl(0, 82%, 39%)
HSB
hsb(0, 90%, 70%)
CMYK
cmyk(0%, 90%, 90%, 30%)
Oklch
oklch(48.8% 0.191 28.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F8DB89
87A5F8

Analogous

F8A187
F8DB89
DEF887

Triadic

F8DB89
87F8DA
DA87F8

Split-Comp.

F8DB89
87DEF8
A187F8

Tetradic

F8DB89
87F8A1
87A5F8
F887DE

Contrast Matrix WCAG 2.1 Contrast

F8DB89
E6A858
CCC982
D65712
B31212
—
1.5
Fail
1.3
Fail
3.0
Fail
5.1
AA
1.5
Fail
—
1.2
Fail
1.9
Fail
3.4
AA Large
1.3
Fail
1.2
Fail
—
2.3
Fail
4.1
AA Large
3.0
Fail
1.9
Fail
2.3
Fail
—
1.7
Fail
5.1
AA
3.4
AA Large
4.1
AA Large
1.7
Fail
—
White BG
1.4Fail
2.1Fail
1.7Fail
4.0AA Large
7.0AA
Black BG
15.5AAA
10.1AAA
12.2AAA
5.2AA
3.0AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

EBEB9D
CBCB6B
CBCB93
9F9E23
6D6C12

Deuteranopia

EDEFA2
CFD370
CBCB97
A6B027
778312

Tritanopia

F7ADB0
E37B7E
CCA1A4
D03033
AB1212

Achromatopsia

DADADA
B1B1B1
C2C2C2
757575
424242

Shades & Tints Shades & Tints

#F8DB89

Dark
Light

#E6A858

Dark
Light

#CCC982

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f8db89;
  --color-2: #e6a858;
  --color-3: #ccc982;
  --color-4: #d65712;
  --color-5: #b31212;
}

SCSS

$color-1: #f8db89;
$color-2: #e6a858;
$color-3: #ccc982;
$color-4: #d65712;
$color-5: #b31212;

TAILWIND

colors: {
  'brand-1': '#f8db89',
  'brand-2': '#e6a858',
  'brand-3': '#ccc982',
  'brand-4': '#d65712',
  'brand-5': '#b31212',
}

RGB Array

[248, 219, 137], [230, 168, 88], [204, 201, 130], [214, 87, 18], [179, 18, 18]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #F8DB89, #E6A858, #CCC982, #D65712, #B31212 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: #f8db89; --color-2: #e6a858; --color-3: #ccc982; --color-4: #d65712; --color-5: #b31212. 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 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