#DCB4A0 + #C8A08C + #F0EBD2 + #D8DFCD + #AFB9AA · vintage - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

NostalgicClassicTimelessWarm

Industry INDUSTRY

CafePublishingCraft

UI Context UI CONTEXT

StorefrontDigital MenuPoster

Color Details Color Details

#DCB4A0

Apricot · Tan · Warm Sun

HEX

#DCB4A0

RGB

rgb(220, 180, 160)

HSL

hsl(20, 46%, 75%)

HSB

hsb(20, 27%, 86%)

CMYK

cmyk(0%, 18%, 27%, 14%)

Oklch

oklch(80.0% 0.054 48.0)

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

#C8A08C

Apricot · Tan · Warm Sun

HEX

#C8A08C

RGB

rgb(200, 160, 140)

HSL

hsl(20, 35%, 67%)

HSB

hsb(20, 30%, 78%)

CMYK

cmyk(0%, 20%, 30%, 22%)

Oklch

oklch(73.7% 0.055 47.9)

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

#F0EBD2

Fresh Green · Beige · Lemon Cream

HEX

#F0EBD2

RGB

rgb(240, 235, 210)

HSL

hsl(50, 50%, 88%)

HSB

hsb(50, 13%, 94%)

CMYK

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

Oklch

oklch(93.7% 0.033 97.7)

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

#D8DFCD

Willow Green · LightGray · Mint Green

HEX

#D8DFCD

RGB

rgb(216, 223, 205)

HSL

hsl(83, 22%, 84%)

HSB

hsb(83, 8%, 87%)

CMYK

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

Oklch

oklch(89.3% 0.025 124.3)

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

#AFB9AA

Celadon · DarkGray · Apple Green

HEX

#AFB9AA

RGB

rgb(175, 185, 170)

HSL

hsl(100, 10%, 70%)

HSB

hsb(100, 8%, 73%)

CMYK

cmyk(5%, 0%, 8%, 27%)

Oklch

oklch(77.4% 0.024 135.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DCB4A0

A2C9DD

Analogous

DDA2AC

DCB4A0

DDD3A2

Triadic

DCB4A0

A2DDB5

B5A2DD

Split-Comp.

DCB4A0

A2DDD3

A2ACDD

Tetradic

DCB4A0

ACDDA2

A2C9DD

D3A2DD

Contrast Matrix WCAG 2.1 Contrast

DCB4A0	C8A08C	F0EBD2	D8DFCD	AFB9AA
—	1.3 Fail	1.6 Fail	1.4 Fail	1.1 Fail
1.3 Fail	—	2.0 Fail	1.7 Fail	1.2 Fail
1.6 Fail	2.0 Fail	—	1.1 Fail	1.7 Fail
1.4 Fail	1.7 Fail	1.1 Fail	—	1.5 Fail
1.1 Fail	1.2 Fail	1.7 Fail	1.5 Fail	—

White BG

1.9Fail

2.4Fail

1.2Fail

1.4Fail

2.0Fail

Black BG

11.1AAA

8.9AAA

17.5AAA

15.4AAA

10.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CBCAA5

B7B691

EEEED8

DBDBD1

B3B3AE

Deuteranopia

CDD0A6

B9BC92

EEEFDA

DBDAD2

B3B2AF

Tritanopia

DAA9AA

C69596

F0DDDE

D8D5D6

B0B0B1

Achromatopsia

BEBEBE

AAAAAA

EAEAEA

DBDBDB

B4B4B4

Shades & Tints Shades & Tints

#DCB4A0

Dark

Light

#C8A08C

Dark

Light

#F0EBD2

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #dcb4a0;
  --color-2: #c8a08c;
  --color-3: #f0ebd2;
  --color-4: #d8dfcd;
  --color-5: #afb9aa;
}

SCSS

$color-1: #dcb4a0;
$color-2: #c8a08c;
$color-3: #f0ebd2;
$color-4: #d8dfcd;
$color-5: #afb9aa;

TAILWIND

colors: {
  'brand-1': '#dcb4a0',
  'brand-2': '#c8a08c',
  'brand-3': '#f0ebd2',
  'brand-4': '#d8dfcd',
  'brand-5': '#afb9aa',
}

RGB Array

[220, 180, 160], [200, 160, 140], [240, 235, 210], [216, 223, 205], [175, 185, 170]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #DCB4A0, #C8A08C, #F0EBD2, #D8DFCD, #AFB9AA 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: #dcb4a0; --color-2: #c8a08c; --color-3: #f0ebd2; --color-4: #d8dfcd; --color-5: #afb9aa. 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