← Back to Editor

#F3EBDE · #F2DAC2 · #DDC096 · #563B5A · #D2A9AD

A 5-color palette 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

#F3EBDE

Goose Yellow · Beige · Peach Orange

HEX
#F3EBDE
RGB
rgb(243, 235, 222)
HSL
hsl(37, 47%, 91%)
HSB
hsb(37, 9%, 95%)
CMYK
cmyk(0%, 3%, 9%, 5%)
Oklch
oklch(94.3% 0.019 80.1)

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

#F2DAC2

Goose Yellow · Wheat · Peach Orange

HEX
#F2DAC2
RGB
rgb(242, 218, 194)
HSL
hsl(30, 65%, 85%)
HSB
hsb(30, 20%, 95%)
CMYK
cmyk(0%, 10%, 20%, 5%)
Oklch
oklch(90.2% 0.042 67.3)

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

#DDC096

Goose Yellow · BurlyWood · Warm Sun

HEX
#DDC096
RGB
rgb(221, 192, 150)
HSL
hsl(35, 51%, 73%)
HSB
hsb(35, 32%, 87%)
CMYK
cmyk(0%, 13%, 32%, 13%)
Oklch
oklch(82.2% 0.065 76.8)

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

#563B5A

Dark Plum · DarkSlateGray · Eggplant

HEX
#563B5A
RGB
rgb(86, 59, 90)
HSL
hsl(292, 21%, 29%)
HSB
hsb(292, 34%, 35%)
CMYK
cmyk(4%, 34%, 0%, 65%)
Oklch
oklch(39.5% 0.061 322.1)

Traditional「Dark Plum」· Paint「Eggplant」· Creative Blush Sunrise

#D2A9AD

Peach Pink · Tan · Coral Red

HEX
#D2A9AD
RGB
rgb(210, 169, 173)
HSL
hsl(354, 31%, 74%)
HSB
hsb(354, 20%, 82%)
CMYK
cmyk(0%, 20%, 18%, 18%)
Oklch
oklch(77.3% 0.048 11.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F3EBDE
DDE6F3

Analogous

F3E0DD
F3EBDE
F0F3DD

Triadic

F3EBDE
DDF3EB
EBDDF3

Split-Comp.

F3EBDE
DDF0F3
E0DDF3

Tetradic

F3EBDE
DDF3E0
DDE6F3
F3DDF0

Contrast Matrix WCAG 2.1 Contrast

F3EBDE
F2DAC2
DDC096
563B5A
D2A9AD
—
1.1
Fail
1.5
Fail
8.2
AAA
1.8
Fail
1.1
Fail
—
1.3
Fail
7.2
AAA
1.6
Fail
1.5
Fail
1.3
Fail
—
5.6
AA
1.2
Fail
8.2
AAA
7.2
AAA
5.6
AA
—
4.6
AA
1.8
Fail
1.6
Fail
1.2
Fail
4.6
AA
—
White BG
1.2Fail
1.3Fail
1.7Fail
9.7AAA
2.1Fail
Black BG
17.7AAA
15.6AAA
12.1AAA
2.2Fail
10.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F0EFE1
E8E7C8
D0D0A0
4A4A52
C0C0AC

Deuteranopia

F0F1E2
E9EBC9
D2D4A3
4C4E51
C3C6AC

Tritanopia

F3E4E4
F1CCCD
DCA8AA
554D4B
D0ABAB

Achromatopsia

ECECEC
DEDEDE
C4C4C4
474747
B6B6B6

Shades & Tints Shades & Tints

#F3EBDE

Dark
Light

#F2DAC2

Dark
Light

#DDC096

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f3ebde;
  --color-2: #f2dac2;
  --color-3: #ddc096;
  --color-4: #563b5a;
  --color-5: #d2a9ad;
}

SCSS

$color-1: #f3ebde;
$color-2: #f2dac2;
$color-3: #ddc096;
$color-4: #563b5a;
$color-5: #d2a9ad;

TAILWIND

colors: {
  'brand-1': '#f3ebde',
  'brand-2': '#f2dac2',
  'brand-3': '#ddc096',
  'brand-4': '#563b5a',
  'brand-5': '#d2a9ad',
}

RGB Array

[243, 235, 222], [242, 218, 194], [221, 192, 150], [86, 59, 90], [210, 169, 173]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F3EBDE, #F2DAC2, #DDC096, #563B5A, #D2A9AD 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: #f3ebde; --color-2: #f2dac2; --color-3: #ddc096; --color-4: #563b5a; --color-5: #d2a9ad. 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 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