#FDE6C4 + #F0D4AD + #E6C49E + #9B7C67 + #A58471 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FDE6C4

Goose Yellow · Bisque · Peach Orange

HEX

#FDE6C4

RGB

rgb(253, 230, 196)

HSL

hsl(36, 93%, 88%)

HSB

hsb(36, 23%, 99%)

CMYK

cmyk(0%, 9%, 23%, 1%)

Oklch

oklch(93.5% 0.051 77.6)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#F0D4AD

Goose Yellow · Wheat · Peach Orange

HEX

#F0D4AD

RGB

rgb(240, 212, 173)

HSL

hsl(35, 69%, 81%)

HSB

hsb(35, 28%, 94%)

CMYK

cmyk(0%, 12%, 28%, 6%)

Oklch

oklch(88.4% 0.060 76.0)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#E6C49E

Goose Yellow · BurlyWood · Peach Orange

HEX

#E6C49E

RGB

rgb(230, 196, 158)

HSL

hsl(32, 59%, 76%)

HSB

hsb(32, 31%, 90%)

CMYK

cmyk(0%, 15%, 31%, 10%)

Oklch

oklch(84.0% 0.064 69.9)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#9B7C67

Tangerine · Gray · Warm Sun

HEX

#9B7C67

RGB

rgb(155, 124, 103)

HSL

hsl(24, 21%, 51%)

HSB

hsb(24, 34%, 61%)

CMYK

cmyk(0%, 20%, 34%, 39%)

Oklch

oklch(61.0% 0.049 55.7)

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

#A58471

Tangerine · Gray · Warm Sun

HEX

#A58471

RGB

rgb(165, 132, 113)

HSL

hsl(22, 22%, 55%)

HSB

hsb(22, 32%, 65%)

CMYK

cmyk(0%, 20%, 32%, 35%)

Oklch

oklch(63.9% 0.049 51.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FDE6C4

C4DBFD

Analogous

FDCAC4

FDE6C4

F7FDC4

Triadic

FDE6C4

C4FDE6

E6C4FD

Split-Comp.

FDE6C4

C4F7FD

CAC4FD

Tetradic

FDE6C4

C4FDCA

C4DBFD

FDC4F7

Contrast Matrix WCAG 2.1 Contrast

FDE6C4	F0D4AD	E6C49E	9B7C67	A58471
—	1.2 Fail	1.4 Fail	3.2 AA Large	2.8 Fail
1.2 Fail	—	1.2 Fail	2.7 Fail	2.4 Fail
1.4 Fail	1.2 Fail	—	2.3 Fail	2.1 Fail
3.2 AA Large	2.7 Fail	2.3 Fail	—	1.1 Fail
2.8 Fail	2.4 Fail	2.1 Fail	1.1 Fail	—

White BG

1.2Fail

1.4Fail

1.6Fail

3.8AA Large

3.4AA Large

Black BG

17.3AAA

14.7AAA

12.8AAA

5.5AA

6.1AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F3F3CC

E4E4B6

D7D7A7

8E8D6C

979676

Deuteranopia

F4F6CE

E6E8B9

D9DCA9

8F926D

999B77

Tritanopia

FCD3D4

EFBEC0

E4AEB0

997071

A3797A

Achromatopsia

E9E9E9

D8D8D8

CACACA

838383

8C8C8C

Shades & Tints Shades & Tints

#FDE6C4

Dark

Light

#F0D4AD

Dark

Light

#E6C49E

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fde6c4;
  --color-2: #f0d4ad;
  --color-3: #e6c49e;
  --color-4: #9b7c67;
  --color-5: #a58471;
}

SCSS

$color-1: #fde6c4;
$color-2: #f0d4ad;
$color-3: #e6c49e;
$color-4: #9b7c67;
$color-5: #a58471;

TAILWIND

colors: {
  'brand-1': '#fde6c4',
  'brand-2': '#f0d4ad',
  'brand-3': '#e6c49e',
  'brand-4': '#9b7c67',
  'brand-5': '#a58471',
}

RGB Array

[253, 230, 196], [240, 212, 173], [230, 196, 158], [155, 124, 103], [165, 132, 113]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FDE6C4, #F0D4AD, #E6C49E, #9B7C67, #A58471 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: #fde6c4; --color-2: #f0d4ad; --color-3: #e6c49e; --color-4: #9b7c67; --color-5: #a58471. 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