#E0DDCC + #F2E4C9 + #DDC48C + #EDA58D + #B2B894 · vintage - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

NostalgicClassicTimelessWarm

Industry INDUSTRY

CafePublishingCraft

UI Context UI CONTEXT

StorefrontDigital MenuPoster

Color Details Color Details

#E0DDCC

Fresh Green · LightGray · Lemon Cream

HEX

#E0DDCC

RGB

rgb(224, 221, 204)

HSL

hsl(51, 24%, 84%)

HSB

hsb(51, 9%, 88%)

CMYK

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

Oklch

oklch(89.5% 0.023 98.7)

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

#F2E4C9

Goose Yellow · Bisque · Lemon Cream

HEX

#F2E4C9

RGB

rgb(242, 228, 201)

HSL

hsl(40, 61%, 87%)

HSB

hsb(40, 17%, 95%)

CMYK

cmyk(0%, 6%, 17%, 5%)

Oklch

oklch(92.3% 0.039 83.8)

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

#DDC48C

Goose Yellow · BurlyWood · Sunflower

HEX

#DDC48C

RGB

rgb(221, 196, 140)

HSL

hsl(41, 54%, 71%)

HSB

hsb(41, 37%, 87%)

CMYK

cmyk(0%, 11%, 37%, 13%)

Oklch

oklch(82.8% 0.078 86.6)

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

#EDA58D

Apricot · DarkSalmon · Warm Sun

HEX

#EDA58D

RGB

rgb(237, 165, 141)

HSL

hsl(15, 73%, 74%)

HSB

hsb(15, 41%, 93%)

CMYK

cmyk(0%, 30%, 41%, 7%)

Oklch

oklch(78.6% 0.092 39.2)

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

#B2B894

Willow Green · DarkGray · Apple Green

HEX

#B2B894

RGB

rgb(178, 184, 148)

HSL

hsl(70, 20%, 65%)

HSB

hsb(70, 20%, 72%)

CMYK

cmyk(3%, 0%, 20%, 28%)

Oklch

oklch(76.8% 0.050 115.3)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E0DDCC

CCCFE0

Analogous

E0D3CC

E0DDCC

D9E0CC

Triadic

E0DDCC

CCE0DD

DDCCE0

Split-Comp.

E0DDCC

CCD9E0

D3CCE0

Tetradic

E0DDCC

CCE0D3

CCCFE0

E0CCD9

Contrast Matrix WCAG 2.1 Contrast

E0DDCC	F2E4C9	DDC48C	EDA58D	B2B894
—	1.1 Fail	1.2 Fail	1.5 Fail	1.5 Fail
1.1 Fail	—	1.4 Fail	1.6 Fail	1.6 Fail
1.2 Fail	1.4 Fail	—	1.2 Fail	1.2 Fail
1.5 Fail	1.6 Fail	1.2 Fail	—	1.0 Fail
1.5 Fail	1.6 Fail	1.2 Fail	1.0 Fail	—

White BG

1.4Fail

1.3Fail

1.7Fail

2.0Fail

2.1Fail

Black BG

15.4AAA

16.7AAA

12.3AAA

10.4AAA

10.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DFDFD0

ECECD0

D2D29A

CECD93

B5B59D

Deuteranopia

DFDFD1

EDEED1

D4D69D

D2D794

B4B49F

Tritanopia

E0D3D4

F1D5D6

DCA4A7

E99798

B2A4A5

Achromatopsia

DCDCDC

E5E5E5

C5C5C5

B8B8B8

B2B2B2

Shades & Tints Shades & Tints

#E0DDCC

Dark

Light

#F2E4C9

Dark

Light

#DDC48C

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e0ddcc;
  --color-2: #f2e4c9;
  --color-3: #ddc48c;
  --color-4: #eda58d;
  --color-5: #b2b894;
}

SCSS

$color-1: #e0ddcc;
$color-2: #f2e4c9;
$color-3: #ddc48c;
$color-4: #eda58d;
$color-5: #b2b894;

TAILWIND

colors: {
  'brand-1': '#e0ddcc',
  'brand-2': '#f2e4c9',
  'brand-3': '#ddc48c',
  'brand-4': '#eda58d',
  'brand-5': '#b2b894',
}

RGB Array

[224, 221, 204], [242, 228, 201], [221, 196, 140], [237, 165, 141], [178, 184, 148]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #E0DDCC, #F2E4C9, #DDC48C, #EDA58D, #B2B894 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: #e0ddcc; --color-2: #f2e4c9; --color-3: #ddc48c; --color-4: #eda58d; --color-5: #b2b894. 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 vintage-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