← Back to Editor

#FCE7B0 · #E0BF8A · #A48F74 · #84776F · #636365

sunset

A 5-color sunset palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#FCE7B0

Goose Yellow · Wheat · Lemon Cream

HEX
#FCE7B0
RGB
rgb(252, 231, 176)
HSL
hsl(43, 93%, 84%)
HSB
hsb(43, 30%, 99%)
CMYK
cmyk(0%, 8%, 30%, 1%)
Oklch
oklch(93.2% 0.074 89.6)

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

#E0BF8A

Goose Yellow · BurlyWood · Warm Sun

HEX
#E0BF8A
RGB
rgb(224, 191, 138)
HSL
hsl(37, 58%, 71%)
HSB
hsb(37, 38%, 88%)
CMYK
cmyk(0%, 15%, 38%, 12%)
Oklch
oklch(82.1% 0.079 79.1)

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

#A48F74

Ginger · Gray · Warm Sun

HEX
#A48F74
RGB
rgb(164, 143, 116)
HSL
hsl(34, 21%, 55%)
HSB
hsb(34, 29%, 64%)
CMYK
cmyk(0%, 13%, 29%, 36%)
Oklch
oklch(66.2% 0.046 73.8)

Traditional「Ginger」· Paint「Warm Sun」· Creative Blush Sunrise

#84776F

Tangerine · Gray · Warm Gray

HEX
#84776F
RGB
rgb(132, 119, 111)
HSL
hsl(23, 9%, 48%)
HSB
hsb(23, 16%, 52%)
CMYK
cmyk(0%, 10%, 16%, 48%)
Oklch
oklch(57.9% 0.020 53.8)

Traditional「Tangerine」· Paint「Warm Gray」· Creative Urban Concrete

#636365

Ink Gray · DimGray · Charcoal

HEX
#636365
RGB
rgb(99, 99, 101)
HSL
hsl(240, 1%, 39%)
HSB
hsb(240, 2%, 40%)
CMYK
cmyk(2%, 2%, 0%, 60%)
Oklch
oklch(50.0% 0.003 286.3)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FCE7B0
B0C6FC

Analogous

FCC1B0
FCE7B0
ECFCB0

Triadic

FCE7B0
B0FCE7
E7B0FC

Split-Comp.

FCE7B0
B0ECFC
C1B0FC

Tetradic

FCE7B0
B0FCC1
B0C6FC
FCB0EC

Contrast Matrix WCAG 2.1 Contrast

FCE7B0
E0BF8A
A48F74
84776F
636365
—
1.4
Fail
2.5
Fail
3.5
AA Large
4.9
AA
1.4
Fail
—
1.8
Fail
2.5
Fail
3.4
AA Large
2.5
Fail
1.8
Fail
—
1.4
Fail
1.9
Fail
3.5
AA Large
2.5
Fail
1.4
Fail
—
1.4
Fail
4.9
AA
3.4
AA Large
1.9
Fail
1.4
Fail
—
White BG
1.2Fail
1.8Fail
3.1AA Large
4.3AA Large
6.0AA
Black BG
17.2AAA
12.0AAA
6.8AA
4.8AA
3.5AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

F3F3BD
D2D197
9B9B7B
7E7E71
636365

Deuteranopia

F4F6C1
D4D69A
9C9E7C
7F8071
636364

Tritanopia

FBC8CA
DEA1A3
A38081
837273
636464

Achromatopsia

E7E7E7
C3C3C3
929292
7A7A7A
636363

Shades & Tints Shades & Tints

#FCE7B0

Dark
Light

#E0BF8A

Dark
Light

#A48F74

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fce7b0;
  --color-2: #e0bf8a;
  --color-3: #a48f74;
  --color-4: #84776f;
  --color-5: #636365;
}

SCSS

$color-1: #fce7b0;
$color-2: #e0bf8a;
$color-3: #a48f74;
$color-4: #84776f;
$color-5: #636365;

TAILWIND

colors: {
  'brand-1': '#fce7b0',
  'brand-2': '#e0bf8a',
  'brand-3': '#a48f74',
  'brand-4': '#84776f',
  'brand-5': '#636365',
}

RGB Array

[252, 231, 176], [224, 191, 138], [164, 143, 116], [132, 119, 111], [99, 99, 101]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #FCE7B0, #E0BF8A, #A48F74, #84776F, #636365 is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #fce7b0; --color-2: #e0bf8a; --color-3: #a48f74; --color-4: #84776f; --color-5: #636365. 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 tech, SaaS, healthcare, eco industries. 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