← Back to Editor

#A7A18F · #D7D6C1 · #9AACA0 · #78979A · #5B8489

vintage

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

NostalgicClassicTimelessWarmCool

Industry INDUSTRY

CafePublishingCraft

UI Context UI CONTEXT

StorefrontDigital MenuPoster

Color Details Color Details

#A7A18F

Ginger · DarkGray · Sunflower

HEX
#A7A18F
RGB
rgb(167, 161, 143)
HSL
hsl(45, 12%, 61%)
HSB
hsb(45, 14%, 65%)
CMYK
cmyk(0%, 4%, 14%, 35%)
Oklch
oklch(70.9% 0.026 91.7)

TraditionalGinger」· PaintSunflower」· Creative Lemon Fizz

#D7D6C1

Fresh Green · LightGray · Lemon Cream

HEX
#D7D6C1
RGB
rgb(215, 214, 193)
HSL
hsl(57, 22%, 80%)
HSB
hsb(57, 10%, 84%)
CMYK
cmyk(0%, 0%, 10%, 16%)
Oklch
oklch(87.1% 0.028 104.7)

TraditionalFresh Green」· PaintLemon Cream」· Creative Lemon Fizz

#9AACA0

Celadon · DarkGray · Apple Green

HEX
#9AACA0
RGB
rgb(154, 172, 160)
HSL
hsl(140, 10%, 64%)
HSB
hsb(140, 10%, 67%)
CMYK
cmyk(10%, 0%, 7%, 33%)
Oklch
oklch(72.7% 0.026 156.5)

TraditionalCeladon」· PaintApple Green」· Creative Mint Breeze

#78979A

Slate Blue · LightSlateGray · Lake Green

HEX
#78979A
RGB
rgb(120, 151, 154)
HSL
hsl(185, 14%, 54%)
HSB
hsb(185, 22%, 60%)
CMYK
cmyk(22%, 2%, 0%, 40%)
Oklch
oklch(65.4% 0.035 203.6)

TraditionalSlate Blue」· PaintLake Green」· Creative Blush Sunrise

#5B8489

Slate Blue · SlateGray · Mint Ice

HEX
#5B8489
RGB
rgb(91, 132, 137)
HSL
hsl(187, 20%, 45%)
HSB
hsb(187, 34%, 54%)
CMYK
cmyk(34%, 4%, 0%, 46%)
Oklch
oklch(58.5% 0.046 205.5)

TraditionalSlate Blue」· PaintMint Ice」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A7A18F
9096A7

Analogous

A79690
A7A18F
A2A790

Triadic

A7A18F
90A7A2
A290A7

Split-Comp.

A7A18F
90A2A7
9690A7

Tetradic

A7A18F
90A796
9096A7
A790A2

Contrast Matrix WCAG 2.1 Contrast

A7A18F
D7D6C1
9AACA0
78979A
5B8489
1.8
Fail
1.1
Fail
1.2
Fail
1.6
Fail
1.8
Fail
1.6
Fail
2.1
Fail
2.8
Fail
1.1
Fail
1.6
Fail
1.3
Fail
1.7
Fail
1.2
Fail
2.1
Fail
1.3
Fail
1.3
Fail
1.6
Fail
2.8
Fail
1.7
Fail
1.3
Fail
White BG
2.6Fail
1.5Fail
2.4Fail
3.1AA Large
4.1AA Large
Black BG
8.1AAA
14.3AAA
8.8AAA
6.7AA
5.1AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A4A493
D7D7C6
A2A2A3
858699
6D6D88

Deuteranopia

A5A594
D7D7C7
A19FA4
848199
6A6788

Tritanopia

A79798
D7CACB
9BA5A6
7A9999
5D8787

Achromatopsia

A1A1A1
D4D4D4
A5A5A5
8E8E8E
787878

Shades & Tints Shades & Tints

#A7A18F

Dark
Light

#D7D6C1

Dark
Light

#9AACA0

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a7a18f;
  --color-2: #d7d6c1;
  --color-3: #9aaca0;
  --color-4: #78979a;
  --color-5: #5b8489;
}

SCSS

$color-1: #a7a18f;
$color-2: #d7d6c1;
$color-3: #9aaca0;
$color-4: #78979a;
$color-5: #5b8489;

TAILWIND

colors: {
  'brand-1': '#a7a18f',
  'brand-2': '#d7d6c1',
  'brand-3': '#9aaca0',
  'brand-4': '#78979a',
  'brand-5': '#5b8489',
}

RGB Array

[167, 161, 143], [215, 214, 193], [154, 172, 160], [120, 151, 154], [91, 132, 137]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #A7A18F, #D7D6C1, #9AACA0, #78979A, #5B8489 is ideal for: brand design, premium product pages, magazine layouts. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #a7a18f; --color-2: #d7d6c1; --color-3: #9aaca0; --color-4: #78979a; --color-5: #5b8489. 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. Restrained colors convey professionalism and trust. 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