← Back to Editor

#D5C967 · #9B8063 · #5C220F · #C8D4AE

vintage

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

NostalgicClassicTimelessWarm

Industry INDUSTRY

CafePublishingCraft

UI Context UI CONTEXT

StorefrontDigital MenuPosterData Visualization

Color Details Color Details

#D5C967

Fresh Green · BurlyWood · Sunflower

HEX
#D5C967
RGB
rgb(213, 201, 103)
HSL
hsl(53, 57%, 62%)
HSB
hsb(53, 52%, 84%)
CMYK
cmyk(0%, 6%, 52%, 16%)
Oklch
oklch(82.6% 0.121 102.4)

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

#9B8063

Ochre · Gray · Amber Brown

HEX
#9B8063
RGB
rgb(155, 128, 99)
HSL
hsl(31, 22%, 50%)
HSB
hsb(31, 36%, 61%)
CMYK
cmyk(0%, 17%, 36%, 39%)
Oklch
oklch(61.8% 0.053 68.6)

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

#5C220F

Tangerine · Maroon · Cinnamon

HEX
#5C220F
RGB
rgb(92, 34, 15)
HSL
hsl(15, 72%, 21%)
HSB
hsb(15, 84%, 36%)
CMYK
cmyk(0%, 63%, 84%, 64%)
Oklch
oklch(33.5% 0.090 38.1)

Traditional「Tangerine」· Paint「Cinnamon」· Creative Blush Sunrise

#C8D4AE

Willow Green · Silver · Apple Green

HEX
#C8D4AE
RGB
rgb(200, 212, 174)
HSL
hsl(79, 31%, 76%)
HSB
hsb(79, 18%, 83%)
CMYK
cmyk(6%, 0%, 18%, 17%)
Oklch
oklch(85.1% 0.053 121.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D5C967
6774D5

Analogous

D59167
D5C967
ABD567

Triadic

D5C967
67D5C8
C867D5

Split-Comp.

D5C967
67ABD5
9167D5

Tetradic

D5C967
67D591
6774D5
D567AB

Contrast Matrix WCAG 2.1 Contrast

D5C967
9B8063
5C220F
C8D4AE
—
2.2
Fail
7.3
AAA
1.1
Fail
2.2
Fail
—
3.3
AA Large
2.4
Fail
7.3
AAA
3.3
AA Large
—
8.0
AAA
1.1
Fail
2.4
Fail
8.0
AAA
—
White BG
1.7Fail
3.7AA Large
12.4AAA
1.6Fail
Black BG
12.4AAA
5.7AA
1.7Fail
13.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D0D07F
8F8F6A
434214
CDCDB7

Deuteranopia

D1D184
91936C
464B15
CDCCB9

Tritanopia

D49196
9A7071
591718
C9BEC0

Achromatopsia

C1C1C1
858585
313131
CCCCCC

Shades & Tints Shades & Tints

#D5C967

Dark
Light

#9B8063

Dark
Light

#5C220F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d5c967;
  --color-2: #9b8063;
  --color-3: #5c220f;
  --color-4: #c8d4ae;
}

SCSS

$color-1: #d5c967;
$color-2: #9b8063;
$color-3: #5c220f;
$color-4: #c8d4ae;

TAILWIND

colors: {
  'brand-1': '#d5c967',
  'brand-2': '#9b8063',
  'brand-3': '#5c220f',
  'brand-4': '#c8d4ae',
}

RGB Array

[213, 201, 103], [155, 128, 99], [92, 34, 15], [200, 212, 174]

FAQ FAQ

What scenarios is this 4-color palette suitable for?

This vintage-style palette of #D5C967, #9B8063, #5C220F, #C8D4AE is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 4-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #d5c967; --color-2: #9b8063; --color-3: #5c220f; --color-4: #c8d4ae. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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 4-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