← Back to Editor

#FFFBDE · #F7DEA6 · #DCA98A · #B78D91 · #2F2C27

sunset

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#FFFBDE

Fresh Green · LightYellow · Lemon Cream

HEX
#FFFBDE
RGB
rgb(255, 251, 222)
HSL
hsl(53, 100%, 94%)
HSB
hsb(53, 13%, 100%)
CMYK
cmyk(0%, 2%, 13%, 0%)
Oklch
oklch(98.4% 0.038 100.6)

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

#F7DEA6

Goose Yellow · Wheat · Lemon Cream

HEX
#F7DEA6
RGB
rgb(247, 222, 166)
HSL
hsl(41, 84%, 81%)
HSB
hsb(41, 33%, 97%)
CMYK
cmyk(0%, 10%, 33%, 3%)
Oklch
oklch(90.8% 0.077 86.7)

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

#DCA98A

Apricot · Tan · Warm Sun

HEX
#DCA98A
RGB
rgb(220, 169, 138)
HSL
hsl(23, 54%, 70%)
HSB
hsb(23, 37%, 86%)
CMYK
cmyk(0%, 23%, 37%, 14%)
Oklch
oklch(77.4% 0.074 52.6)

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

#B78D91

Peach Pink · DarkGray · Coral Red

HEX
#B78D91
RGB
rgb(183, 141, 145)
HSL
hsl(354, 23%, 64%)
HSB
hsb(354, 23%, 72%)
CMYK
cmyk(0%, 23%, 21%, 28%)
Oklch
oklch(68.4% 0.051 12.1)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#2F2C27

Ochre · DarkSlateGray · Dark Stone

HEX
#2F2C27
RGB
rgb(47, 44, 39)
HSL
hsl(37, 9%, 17%)
HSB
hsb(37, 17%, 18%)
CMYK
cmyk(0%, 6%, 17%, 82%)
Oklch
oklch(29.5% 0.010 80.7)

Traditional「Ochre」· Paint「Dark Stone」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFFBDE
E0E4FF

Analogous

FFECE0
FFFBDE
F3FFE0

Triadic

FFFBDE
E0FFFB
FBE0FF

Split-Comp.

FFFBDE
E0F3FF
ECE0FF

Tetradic

FFFBDE
E0FFEC
E0E4FF
FFE0F3

Contrast Matrix WCAG 2.1 Contrast

FFFBDE
F7DEA6
DCA98A
B78D91
2F2C27
—
1.3
Fail
2.0
Fail
2.8
Fail
13.3
AAA
1.3
Fail
—
1.6
Fail
2.2
Fail
10.6
AAA
2.0
Fail
1.6
Fail
—
1.4
Fail
6.7
AA
2.8
Fail
2.2
Fail
1.4
Fail
—
4.8
AA
13.3
AAA
10.6
AAA
6.7
AA
4.8
AA
—
White BG
1.0Fail
1.3Fail
2.1Fail
2.9Fail
13.9AAA
Black BG
20.1AAA
16.0AAA
10.1AAA
7.2AAA
1.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

FDFDE5
ECECB4
C6C592
A5A490
2E2E28

Deuteranopia

FEFEE7
EEEFB7
C9CD93
A7AA90
2E2E29

Tritanopia

FFEBEC
F6BEC1
D99799
B58F8F
2F2929

Achromatopsia

F9F9F9
DFDFDF
B5B5B5
9A9A9A
2C2C2C

Shades & Tints Shades & Tints

#FFFBDE

Dark
Light

#F7DEA6

Dark
Light

#DCA98A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fffbde;
  --color-2: #f7dea6;
  --color-3: #dca98a;
  --color-4: #b78d91;
  --color-5: #2f2c27;
}

SCSS

$color-1: #fffbde;
$color-2: #f7dea6;
$color-3: #dca98a;
$color-4: #b78d91;
$color-5: #2f2c27;

TAILWIND

colors: {
  'brand-1': '#fffbde',
  'brand-2': '#f7dea6',
  'brand-3': '#dca98a',
  'brand-4': '#b78d91',
  'brand-5': '#2f2c27',
}

RGB Array

[255, 251, 222], [247, 222, 166], [220, 169, 138], [183, 141, 145], [47, 44, 39]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #FFFBDE, #F7DEA6, #DCA98A, #B78D91, #2F2C27 is ideal for: health products, baby brands, fresh-style blogs, 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: #fffbde; --color-2: #f7dea6; --color-3: #dca98a; --color-4: #b78d91; --color-5: #2f2c27. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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