#BAAE9D + #FBECB5 + #FDDD9A + #DCAB8A + #A5817B · vintage - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

NostalgicClassicTimelessWarm

Industry INDUSTRY

CafePublishingCraft

UI Context UI CONTEXT

StorefrontDigital MenuPoster

Color Details Color Details

#BAAE9D

Ginger · DarkGray · Warm Sun

HEX

#BAAE9D

RGB

rgb(186, 174, 157)

HSL

hsl(35, 17%, 67%)

HSB

hsb(35, 16%, 73%)

CMYK

cmyk(0%, 6%, 16%, 27%)

Oklch

oklch(75.6% 0.027 76.7)

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

#FBECB5

Goose Yellow · Wheat · Lemon Cream

HEX

#FBECB5

RGB

rgb(251, 236, 181)

HSL

hsl(47, 90%, 85%)

HSB

hsb(47, 28%, 98%)

CMYK

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

Oklch

oklch(94.2% 0.072 94.6)

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

#FDDD9A

Goose Yellow · Khaki · Lemon Cream

HEX

#FDDD9A

RGB

rgb(253, 221, 154)

HSL

hsl(41, 96%, 80%)

HSB

hsb(41, 39%, 99%)

CMYK

cmyk(0%, 13%, 39%, 1%)

Oklch

oklch(90.9% 0.092 85.1)

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

#DCAB8A

Apricot · BurlyWood · Warm Sun

HEX

#DCAB8A

RGB

rgb(220, 171, 138)

HSL

hsl(24, 54%, 70%)

HSB

hsb(24, 37%, 86%)

CMYK

cmyk(0%, 22%, 37%, 14%)

Oklch

oklch(77.8% 0.073 55.3)

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

#A5817B

Crimson · Gray · Passion Red

HEX

#A5817B

RGB

rgb(165, 129, 123)

HSL

hsl(9, 19%, 56%)

HSB

hsb(9, 25%, 65%)

CMYK

cmyk(0%, 22%, 25%, 35%)

Oklch

oklch(63.6% 0.046 29.3)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BAAE9D

9DA8B9

Analogous

B99F9D

BAAE9D

B7B99D

Triadic

BAAE9D

9DB9AD

AD9DB9

Split-Comp.

BAAE9D

9DB7B9

9F9DB9

Tetradic

BAAE9D

9DB99F

9DA8B9

B99DB7

Contrast Matrix WCAG 2.1 Contrast

BAAE9D	FBECB5	FDDD9A	DCAB8A	A5817B
—	1.8 Fail	1.7 Fail	1.1 Fail	1.6 Fail
1.8 Fail	—	1.1 Fail	1.7 Fail	2.9 Fail
1.7 Fail	1.1 Fail	—	1.6 Fail	2.7 Fail
1.1 Fail	1.7 Fail	1.6 Fail	—	1.7 Fail
1.6 Fail	2.9 Fail	2.7 Fail	1.7 Fail	—

White BG

2.2Fail

1.2Fail

1.3Fail

2.1Fail

3.5AA Large

Black BG

9.6AAA

17.8AAA

16.0AAA

10.2AAA

6.0AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B5B5A1

F5F4C2

EFEFAA

C7C692

95957C

Deuteranopia

B6B6A2

F5F7C6

F1F3AE

CACD94

989A7D

Tritanopia

B9A4A5

FACDCF

FBB7BA

DA989A

A37E7E

Achromatopsia

B0B0B0

EAEAEA

DFDFDF

B6B6B6

8B8B8B

Shades & Tints Shades & Tints

#BAAE9D

Dark

Light

#FBECB5

Dark

Light

#FDDD9A

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #baae9d;
  --color-2: #fbecb5;
  --color-3: #fddd9a;
  --color-4: #dcab8a;
  --color-5: #a5817b;
}

SCSS

$color-1: #baae9d;
$color-2: #fbecb5;
$color-3: #fddd9a;
$color-4: #dcab8a;
$color-5: #a5817b;

TAILWIND

colors: {
  'brand-1': '#baae9d',
  'brand-2': '#fbecb5',
  'brand-3': '#fddd9a',
  'brand-4': '#dcab8a',
  'brand-5': '#a5817b',
}

RGB Array

[186, 174, 157], [251, 236, 181], [253, 221, 154], [220, 171, 138], [165, 129, 123]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #BAAE9D, #FBECB5, #FDDD9A, #DCAB8A, #A5817B 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: #baae9d; --color-2: #fbecb5; --color-3: #fddd9a; --color-4: #dcab8a; --color-5: #a5817b. 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