← Back to Editor

#CEE0C3 · #ECEDC2 · #D4D49D · #C9A8A1 · #FCA4A4

vintage

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

NostalgicClassicTimelessWarm

Industry INDUSTRY

CafePublishingCraft

UI Context UI CONTEXT

StorefrontDigital MenuPoster

Color Details Color Details

#CEE0C3

Celadon · LightGray · Mint Green

HEX
#CEE0C3
RGB
rgb(206, 224, 195)
HSL
hsl(97, 32%, 82%)
HSB
hsb(97, 13%, 88%)
CMYK
cmyk(8%, 0%, 13%, 12%)
Oklch
oklch(88.5% 0.044 133.5)

TraditionalCeladon」· PaintMint Green」· Creative Mint Breeze

#ECEDC2

Fresh Green · Bisque · Lemon Cream

HEX
#ECEDC2
RGB
rgb(236, 237, 194)
HSL
hsl(61, 54%, 85%)
HSB
hsb(61, 18%, 93%)
CMYK
cmyk(0%, 0%, 18%, 7%)
Oklch
oklch(93.5% 0.056 108.5)

TraditionalFresh Green」· PaintLemon Cream」· Creative Lemon Fizz

#D4D49D

Fresh Green · Tan · Sunflower

HEX
#D4D49D
RGB
rgb(212, 212, 157)
HSL
hsl(60, 39%, 72%)
HSB
hsb(60, 26%, 83%)
CMYK
cmyk(0%, 0%, 26%, 17%)
Oklch
oklch(85.7% 0.072 107.8)

TraditionalFresh Green」· PaintSunflower」· Creative Lemon Fizz

#C9A8A1

Peach Pink · Tan · Coral Red

HEX
#C9A8A1
RGB
rgb(201, 168, 161)
HSL
hsl(11, 27%, 71%)
HSB
hsb(11, 20%, 79%)
CMYK
cmyk(0%, 16%, 20%, 21%)
Oklch
oklch(75.9% 0.040 32.0)

TraditionalPeach Pink」· PaintCoral Red」· Creative Blush Sunrise

#FCA4A4

Peach Pink · LightPink · Cherry Blossom

HEX
#FCA4A4
RGB
rgb(252, 164, 164)
HSL
hsl(0, 94%, 82%)
HSB
hsb(0, 35%, 99%)
CMYK
cmyk(0%, 35%, 35%, 1%)
Oklch
oklch(80.6% 0.105 19.6)

TraditionalPeach Pink」· PaintCherry Blossom」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CEE0C3
D5C2E0

Analogous

DCE0C2
CEE0C3
C2E0C6

Triadic

CEE0C3
C2CEE0
E0C2CE

Split-Comp.

CEE0C3
C6C2E0
E0C2DC

Tetradic

CEE0C3
C2DCE0
D5C2E0
E0C6C2

Contrast Matrix WCAG 2.1 Contrast

CEE0C3
ECEDC2
D4D49D
C9A8A1
FCA4A4
1.2
Fail
1.1
Fail
1.6
Fail
1.4
Fail
1.2
Fail
1.3
Fail
1.8
Fail
1.6
Fail
1.1
Fail
1.3
Fail
1.4
Fail
1.2
Fail
1.6
Fail
1.8
Fail
1.4
Fail
1.1
Fail
1.4
Fail
1.6
Fail
1.2
Fail
1.1
Fail
White BG
1.4Fail
1.2Fail
1.5Fail
2.2Fail
1.9Fail
Black BG
15.1AAA
17.5AAA
13.7AAA
9.6AAA
11.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D6D6CA
ECECCC
D4D4AA
BBBAA3
D6D5A4

Deuteranopia

D5D3CC
ECECCF
D4D4AE
BDBFA3
DBE2A4

Tritanopia

CFD0D1
ECD5D6
D4B5B7
C7A4A4
F8A4A4

Achromatopsia

D7D7D7
E8E8E8
CECECE
B1B1B1
BEBEBE

Shades & Tints Shades & Tints

#CEE0C3

Dark
Light

#ECEDC2

Dark
Light

#D4D49D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cee0c3;
  --color-2: #ecedc2;
  --color-3: #d4d49d;
  --color-4: #c9a8a1;
  --color-5: #fca4a4;
}

SCSS

$color-1: #cee0c3;
$color-2: #ecedc2;
$color-3: #d4d49d;
$color-4: #c9a8a1;
$color-5: #fca4a4;

TAILWIND

colors: {
  'brand-1': '#cee0c3',
  'brand-2': '#ecedc2',
  'brand-3': '#d4d49d',
  'brand-4': '#c9a8a1',
  'brand-5': '#fca4a4',
}

RGB Array

[206, 224, 195], [236, 237, 194], [212, 212, 157], [201, 168, 161], [252, 164, 164]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #CEE0C3, #ECEDC2, #D4D49D, #C9A8A1, #FCA4A4 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: #cee0c3; --color-2: #ecedc2; --color-3: #d4d49d; --color-4: #c9a8a1; --color-5: #fca4a4. 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