← Back to Editor

#86A585 · #E0D38D · #E89F5A · #E97F29 · #330A00

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 MenuPosterData Visualization

Color Details Color Details

#86A585

Celadon · DarkSeaGreen · Olive Green

HEX
#86A585
RGB
rgb(134, 165, 133)
HSL
hsl(118, 15%, 58%)
HSB
hsb(118, 19%, 65%)
CMYK
cmyk(19%, 0%, 19%, 35%)
Oklch
oklch(69.0% 0.058 144.1)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#E0D38D

Fresh Green · Khaki · Sunflower

HEX
#E0D38D
RGB
rgb(224, 211, 141)
HSL
hsl(51, 57%, 72%)
HSB
hsb(51, 37%, 88%)
CMYK
cmyk(0%, 6%, 37%, 12%)
Oklch
oklch(86.1% 0.091 99.0)

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

#E89F5A

Apricot · SandyBrown · Warm Sun

HEX
#E89F5A
RGB
rgb(232, 159, 90)
HSL
hsl(29, 76%, 63%)
HSB
hsb(29, 61%, 91%)
CMYK
cmyk(0%, 31%, 61%, 9%)
Oklch
oklch(76.1% 0.122 62.6)

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

#E97F29

Tangerine · Chocolate · Warm Sun

HEX
#E97F29
RGB
rgb(233, 127, 41)
HSL
hsl(27, 81%, 54%)
HSB
hsb(27, 82%, 91%)
CMYK
cmyk(0%, 45%, 82%, 9%)
Oklch
oklch(70.2% 0.160 54.1)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#330A00

Vermilion · Black · Deep Berry

HEX
#330A00
RGB
rgb(51, 10, 0)
HSL
hsl(12, 100%, 10%)
HSB
hsb(12, 100%, 20%)
CMYK
cmyk(0%, 80%, 100%, 80%)
Oklch
oklch(21.7% 0.070 38.9)

Traditional「Vermilion」· Paint「Deep Berry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

86A585
A384A4

Analogous

95A484
86A585
84A493

Triadic

86A585
8485A4
A48485

Split-Comp.

86A585
9384A4
A48495

Tetradic

86A585
8495A4
A384A4
A49384

Contrast Matrix WCAG 2.1 Contrast

86A585
E0D38D
E89F5A
E97F29
330A00
—
1.8
Fail
1.2
Fail
1.0
Fail
6.5
AA
1.8
Fail
—
1.5
Fail
1.8
Fail
11.7
AAA
1.2
Fail
1.5
Fail
—
1.3
Fail
8.1
AAA
1.0
Fail
1.8
Fail
1.3
Fail
—
6.4
AA
6.5
AA
11.7
AAA
8.1
AAA
6.4
AA
—
White BG
2.7Fail
1.5Fail
2.2Fail
2.8Fail
17.7AAA
Black BG
7.7AAA
13.9AAA
9.5AAA
7.5AAA
1.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

93948D
DADA9E
C8C86B
BBBA3E
212102

Deuteranopia

928F8F
DBDCA2
CDD26F
C1C943
242703

Tritanopia

889394
DFABAE
E4787B
E44E52
310405

Achromatopsia

989898
CFCFCF
ADADAD
959595
151515

Shades & Tints Shades & Tints

#86A585

Dark
Light

#E0D38D

Dark
Light

#E89F5A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #86a585;
  --color-2: #e0d38d;
  --color-3: #e89f5a;
  --color-4: #e97f29;
  --color-5: #330a00;
}

SCSS

$color-1: #86a585;
$color-2: #e0d38d;
$color-3: #e89f5a;
$color-4: #e97f29;
$color-5: #330a00;

TAILWIND

colors: {
  'brand-1': '#86a585',
  'brand-2': '#e0d38d',
  'brand-3': '#e89f5a',
  'brand-4': '#e97f29',
  'brand-5': '#330a00',
}

RGB Array

[134, 165, 133], [224, 211, 141], [232, 159, 90], [233, 127, 41], [51, 10, 0]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #86A585, #E0D38D, #E89F5A, #E97F29, #330A00 is ideal for: social media posters, mobile apps, e-commerce promos, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #86a585; --color-2: #e0d38d; --color-3: #e89f5a; --color-4: #e97f29; --color-5: #330a00. 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 5-color scheme is especially suited for food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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