#D8DAC6 + #E6E7D8 + #F7D6C3 + #FDBFC8 + #B7C2BF · vintage - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

NostalgicClassicTimelessWarmCool

Industry INDUSTRY

CafePublishingCraft

UI Context UI CONTEXT

StorefrontDigital MenuPoster

Color Details Color Details

#D8DAC6

Fresh Green · LightGray · Lemon Cream

HEX

#D8DAC6

RGB

rgb(216, 218, 198)

HSL

hsl(66, 21%, 82%)

HSB

hsb(66, 9%, 85%)

CMYK

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

Oklch

oklch(88.1% 0.027 111.6)

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

#E6E7D8

Fresh Green · Beige · Lemon Cream

HEX

#E6E7D8

RGB

rgb(230, 231, 216)

HSL

hsl(64, 24%, 88%)

HSB

hsb(64, 6%, 91%)

CMYK

cmyk(0%, 0%, 6%, 9%)

Oklch

oklch(92.3% 0.020 109.9)

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

#F7D6C3

Apricot · Bisque · Peach Orange

HEX

#F7D6C3

RGB

rgb(247, 214, 195)

HSL

hsl(22, 76%, 87%)

HSB

hsb(22, 21%, 97%)

CMYK

cmyk(0%, 13%, 21%, 3%)

Oklch

oklch(89.9% 0.045 51.8)

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

#FDBFC8

Peach Pink · Pink · Cherry Blossom

HEX

#FDBFC8

RGB

rgb(253, 191, 200)

HSL

hsl(351, 94%, 87%)

HSB

hsb(351, 25%, 99%)

CMYK

cmyk(0%, 25%, 21%, 1%)

Oklch

oklch(86.3% 0.072 9.0)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Rose Petal

#B7C2BF

Jade · Silver · Pearl Gray

HEX

#B7C2BF

RGB

rgb(183, 194, 191)

HSL

hsl(164, 8%, 74%)

HSB

hsb(164, 6%, 76%)

CMYK

cmyk(6%, 0%, 2%, 24%)

Oklch

oklch(80.5% 0.013 177.9)

Traditional「Jade」· Paint「Pearl Gray」· Creative Silver Lining

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D8DAC6

C9C7DB

Analogous

DBD3C7

D8DAC6

CFDBC7

Triadic

D8DAC6

C7D9DB

DBC7D9

Split-Comp.

D8DAC6

C7CFDB

D3C7DB

Tetradic

D8DAC6

C7DBD3

C9C7DB

DBC7CF

Contrast Matrix WCAG 2.1 Contrast

D8DAC6	E6E7D8	F7D6C3	FDBFC8	B7C2BF
—	1.1 Fail	1.0 Fail	1.1 Fail	1.3 Fail
1.1 Fail	—	1.1 Fail	1.2 Fail	1.5 Fail
1.0 Fail	1.1 Fail	—	1.1 Fail	1.3 Fail
1.1 Fail	1.2 Fail	1.1 Fail	—	1.2 Fail
1.3 Fail	1.5 Fail	1.3 Fail	1.2 Fail	—

White BG

1.4Fail

1.3Fail

1.4Fail

1.6Fail

1.8Fail

Black BG

14.8AAA

16.8AAA

15.4AAA

13.5AAA

11.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D9D9CB

E6E6DC

E9E8C8

E2E2C6

BCBCC0

Deuteranopia

D9D9CC

E6E6DD

EBEDC9

E6EAC5

BBBAC0

Tritanopia

D8CFD0

E6DEDF

F5CBCC

FAC4C4

B8C0C0

Achromatopsia

D7D7D7

E5E5E5

DEDEDE

D3D3D3

BEBEBE

Shades & Tints Shades & Tints

#D8DAC6

Dark

Light

#E6E7D8

Dark

Light

#F7D6C3

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d8dac6;
  --color-2: #e6e7d8;
  --color-3: #f7d6c3;
  --color-4: #fdbfc8;
  --color-5: #b7c2bf;
}

SCSS

$color-1: #d8dac6;
$color-2: #e6e7d8;
$color-3: #f7d6c3;
$color-4: #fdbfc8;
$color-5: #b7c2bf;

TAILWIND

colors: {
  'brand-1': '#d8dac6',
  'brand-2': '#e6e7d8',
  'brand-3': '#f7d6c3',
  'brand-4': '#fdbfc8',
  'brand-5': '#b7c2bf',
}

RGB Array

[216, 218, 198], [230, 231, 216], [247, 214, 195], [253, 191, 200], [183, 194, 191]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #D8DAC6, #E6E7D8, #F7D6C3, #FDBFC8, #B7C2BF 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: #d8dac6; --color-2: #e6e7d8; --color-3: #f7d6c3; --color-4: #fdbfc8; --color-5: #b7c2bf. 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