← Back to Editor

#B5BBA3 · #E5CEAC · #D5A98C · #C1893F · #B9642B

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

#B5BBA3

Willow Green · DarkGray · Apple Green

HEX
#B5BBA3
RGB
rgb(181, 187, 163)
HSL
hsl(75, 15%, 69%)
HSB
hsb(75, 13%, 73%)
CMYK
cmyk(3%, 0%, 13%, 27%)
Oklch
oklch(78.1% 0.034 118.6)

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

#E5CEAC

Goose Yellow · Wheat · Peach Orange

HEX
#E5CEAC
RGB
rgb(229, 206, 172)
HSL
hsl(36, 52%, 79%)
HSB
hsb(36, 25%, 90%)
CMYK
cmyk(0%, 10%, 25%, 10%)
Oklch
oklch(86.2% 0.052 77.6)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#D5A98C

Apricot · Tan · Warm Sun

HEX
#D5A98C
RGB
rgb(213, 169, 140)
HSL
hsl(24, 46%, 69%)
HSB
hsb(24, 34%, 84%)
CMYK
cmyk(0%, 21%, 34%, 16%)
Oklch
oklch(76.8% 0.065 54.9)

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

#C1893F

Ochre · GoldenRod · Amber Brown

HEX
#C1893F
RGB
rgb(193, 137, 63)
HSL
hsl(34, 51%, 50%)
HSB
hsb(34, 67%, 76%)
CMYK
cmyk(0%, 29%, 67%, 24%)
Oklch
oklch(67.2% 0.113 71.2)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

#B9642B

Tangerine · Chocolate · Amber Brown

HEX
#B9642B
RGB
rgb(185, 100, 43)
HSL
hsl(24, 62%, 45%)
HSB
hsb(24, 77%, 73%)
CMYK
cmyk(0%, 46%, 77%, 27%)
Oklch
oklch(59.2% 0.129 51.1)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B5BBA3
AAA4BC

Analogous

BCB6A4
B5BBA3
AABCA4

Triadic

B5BBA3
A4B6BC
BCA4B6

Split-Comp.

B5BBA3
A4AABC
B6A4BC

Tetradic

B5BBA3
A4BCB6
AAA4BC
BCA4AA

Contrast Matrix WCAG 2.1 Contrast

B5BBA3
E5CEAC
D5A98C
C1893F
B9642B
—
1.3
Fail
1.1
Fail
1.5
Fail
2.2
Fail
1.3
Fail
—
1.4
Fail
2.0
Fail
2.8
Fail
1.1
Fail
1.4
Fail
—
1.4
Fail
2.0
Fail
1.5
Fail
2.0
Fail
1.4
Fail
—
1.4
Fail
2.2
Fail
2.8
Fail
2.0
Fail
1.4
Fail
—
White BG
2.0Fail
1.5Fail
2.1Fail
3.0AA Large
4.3AA Large
Black BG
10.6AAA
13.8AAA
9.9AAA
6.9AA
4.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B8B8A9
DBDBB4
C2C293
A9A851
949339

Deuteranopia

B7B7AA
DCDEB6
C5C895
ACB055
99A03C

Tritanopia

B5ADAE
E4BBBC
D3999A
BE5F62
B54446

Achromatopsia

B6B6B6
D1D1D1
B3B3B3
919191
777777

Shades & Tints Shades & Tints

#B5BBA3

Dark
Light

#E5CEAC

Dark
Light

#D5A98C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b5bba3;
  --color-2: #e5ceac;
  --color-3: #d5a98c;
  --color-4: #c1893f;
  --color-5: #b9642b;
}

SCSS

$color-1: #b5bba3;
$color-2: #e5ceac;
$color-3: #d5a98c;
$color-4: #c1893f;
$color-5: #b9642b;

TAILWIND

colors: {
  'brand-1': '#b5bba3',
  'brand-2': '#e5ceac',
  'brand-3': '#d5a98c',
  'brand-4': '#c1893f',
  'brand-5': '#b9642b',
}

RGB Array

[181, 187, 163], [229, 206, 172], [213, 169, 140], [193, 137, 63], [185, 100, 43]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #B5BBA3, #E5CEAC, #D5A98C, #C1893F, #B9642B is ideal for: corporate websites, product showcases, portfolios. 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: #b5bba3; --color-2: #e5ceac; --color-3: #d5a98c; --color-4: #c1893f; --color-5: #b9642b. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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