← Back to Editor

#8B767B · #EECCB3 · #CF987A · #988483 · #9A7558

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

#8B767B

Crimson · Gray · Warm Gray

HEX
#8B767B
RGB
rgb(139, 118, 123)
HSL
hsl(346, 8%, 50%)
HSB
hsb(346, 15%, 55%)
CMYK
cmyk(0%, 15%, 12%, 45%)
Oklch
oklch(58.7% 0.027 1.9)

Traditional「Crimson」· Paint「Warm Gray」· Creative Urban Concrete

#EECCB3

Apricot · Wheat · Peach Orange

HEX
#EECCB3
RGB
rgb(238, 204, 179)
HSL
hsl(25, 63%, 82%)
HSB
hsb(25, 25%, 93%)
CMYK
cmyk(0%, 14%, 25%, 7%)
Oklch
oklch(86.8% 0.051 58.3)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#CF987A

Apricot · DarkSalmon · Warm Sun

HEX
#CF987A
RGB
rgb(207, 152, 122)
HSL
hsl(21, 47%, 65%)
HSB
hsb(21, 41%, 81%)
CMYK
cmyk(0%, 27%, 41%, 19%)
Oklch
oklch(72.5% 0.078 49.7)

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

#988483

Crimson · Gray · Warm Gray

HEX
#988483
RGB
rgb(152, 132, 131)
HSL
hsl(3, 9%, 55%)
HSB
hsb(3, 14%, 60%)
CMYK
cmyk(0%, 13%, 14%, 40%)
Oklch
oklch(63.1% 0.025 21.2)

Traditional「Crimson」· Paint「Warm Gray」· Creative Urban Concrete

#9A7558

Tangerine · Gray · Amber Brown

HEX
#9A7558
RGB
rgb(154, 117, 88)
HSL
hsl(26, 27%, 47%)
HSB
hsb(26, 43%, 60%)
CMYK
cmyk(0%, 24%, 43%, 40%)
Oklch
oklch(59.2% 0.063 59.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8B767B
758A85

Analogous

8A7584
8B767B
8A7B75

Triadic

8B767B
7A8A75
757A8A

Split-Comp.

8B767B
758A7B
75848A

Tetradic

8B767B
848A75
758A85
7B758A

Contrast Matrix WCAG 2.1 Contrast

8B767B
EECCB3
CF987A
988483
9A7558
—
2.8
Fail
1.7
Fail
1.2
Fail
1.0
Fail
2.8
Fail
—
1.7
Fail
2.3
Fail
2.8
Fail
1.7
Fail
1.7
Fail
—
1.4
Fail
1.7
Fail
1.2
Fail
2.3
Fail
1.4
Fail
—
1.2
Fail
1.0
Fail
2.8
Fail
1.7
Fail
1.2
Fail
—
White BG
4.2AA Large
1.5Fail
2.5Fail
3.5AA Large
4.2AA Large
Black BG
5.0AA
13.9AAA
8.4AAA
6.0AA
5.1AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

82827A
DFDFB9
B7B781
8F8F83
8A8A5F

Deuteranopia

83857A
E1E4BB
BABE83
919283
8C8F61

Tritanopia

8A7979
ECBEBF
CC8788
978383
986566

Achromatopsia

7D7D7D
D3D3D3
A5A5A5
8A8A8A
7D7D7D

Shades & Tints Shades & Tints

#8B767B

Dark
Light

#EECCB3

Dark
Light

#CF987A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8b767b;
  --color-2: #eeccb3;
  --color-3: #cf987a;
  --color-4: #988483;
  --color-5: #9a7558;
}

SCSS

$color-1: #8b767b;
$color-2: #eeccb3;
$color-3: #cf987a;
$color-4: #988483;
$color-5: #9a7558;

TAILWIND

colors: {
  'brand-1': '#8b767b',
  'brand-2': '#eeccb3',
  'brand-3': '#cf987a',
  'brand-4': '#988483',
  'brand-5': '#9a7558',
}

RGB Array

[139, 118, 123], [238, 204, 179], [207, 152, 122], [152, 132, 131], [154, 117, 88]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #8B767B, #EECCB3, #CF987A, #988483, #9A7558 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: #8b767b; --color-2: #eeccb3; --color-3: #cf987a; --color-4: #988483; --color-5: #9a7558. 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