#F5E5AD + #F5CCB9 + #D77D74 + #CFB89C + #DBD789 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F5E5AD

Goose Yellow · Wheat · Lemon Cream

HEX

#F5E5AD

RGB

rgb(245, 229, 173)

HSL

hsl(47, 78%, 82%)

HSB

hsb(47, 29%, 96%)

CMYK

cmyk(0%, 7%, 29%, 4%)

Oklch

oklch(92.1% 0.074 94.0)

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

#F5CCB9

Apricot · Wheat · Peach Orange

HEX

#F5CCB9

RGB

rgb(245, 204, 185)

HSL

hsl(19, 75%, 84%)

HSB

hsb(19, 24%, 96%)

CMYK

cmyk(0%, 17%, 24%, 4%)

Oklch

oklch(87.6% 0.053 46.3)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#D77D74

Peach Pink · LightCoral · Coral Red

HEX

#D77D74

RGB

rgb(215, 125, 116)

HSL

hsl(5, 55%, 65%)

HSB

hsb(5, 46%, 84%)

CMYK

cmyk(0%, 42%, 46%, 16%)

Oklch

oklch(68.5% 0.113 26.5)

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

#CFB89C

Goose Yellow · Tan · Warm Sun

HEX

#CFB89C

RGB

rgb(207, 184, 156)

HSL

hsl(33, 35%, 71%)

HSB

hsb(33, 25%, 81%)

CMYK

cmyk(0%, 11%, 25%, 19%)

Oklch

oklch(79.5% 0.046 72.5)

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

#DBD789

Fresh Green · Khaki · Sunflower

HEX

#DBD789

RGB

rgb(219, 215, 137)

HSL

hsl(57, 53%, 70%)

HSB

hsb(57, 37%, 86%)

CMYK

cmyk(0%, 2%, 37%, 14%)

Oklch

oklch(86.5% 0.099 105.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F5E5AD

ADBDF5

Analogous

F5C2AD

F5E5AD

E1F5AD

Triadic

F5E5AD

ADF5E5

E5ADF5

Split-Comp.

F5E5AD

ADE1F5

C2ADF5

Tetradic

F5E5AD

ADF5C2

ADBDF5

F5ADE1

Contrast Matrix WCAG 2.1 Contrast

F5E5AD	F5CCB9	D77D74	CFB89C	DBD789
—	1.2 Fail	2.4 Fail	1.5 Fail	1.2 Fail
1.2 Fail	—	2.0 Fail	1.3 Fail	1.0 Fail
2.4 Fail	2.0 Fail	—	1.6 Fail	2.0 Fail
1.5 Fail	1.3 Fail	1.6 Fail	—	1.3 Fail
1.2 Fail	1.0 Fail	2.0 Fail	1.3 Fail	—

White BG

1.3Fail

1.5Fail

3.0Fail

1.9Fail

1.5Fail

Black BG

16.7AAA

14.2AAA

7.1AAA

11.0AAA

14.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

EEEEBB

E3E3BE

B0AF76

C5C5A3

D9D99C

Deuteranopia

EFF0BE

E6E9BF

B5BC77

C6C8A4

DADAA0

Tritanopia

F4C5C8

F3C1C2

D37878

CEA8A9

DBABAE

Achromatopsia

E3E3E3

D6D6D6

979797

BCBCBC

CFCFCF

Shades & Tints Shades & Tints

#F5E5AD

Dark

Light

#F5CCB9

Dark

Light

#D77D74

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f5e5ad;
  --color-2: #f5ccb9;
  --color-3: #d77d74;
  --color-4: #cfb89c;
  --color-5: #dbd789;
}

SCSS

$color-1: #f5e5ad;
$color-2: #f5ccb9;
$color-3: #d77d74;
$color-4: #cfb89c;
$color-5: #dbd789;

TAILWIND

colors: {
  'brand-1': '#f5e5ad',
  'brand-2': '#f5ccb9',
  'brand-3': '#d77d74',
  'brand-4': '#cfb89c',
  'brand-5': '#dbd789',
}

RGB Array

[245, 229, 173], [245, 204, 185], [215, 125, 116], [207, 184, 156], [219, 215, 137]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F5E5AD, #F5CCB9, #D77D74, #CFB89C, #DBD789 is ideal for: health products, baby brands, fresh-style blogs. 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: #f5e5ad; --color-2: #f5ccb9; --color-3: #d77d74; --color-4: #cfb89c; --color-5: #dbd789. 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. 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 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