← Back to Editor

#E28B5C · #D5AF7F · #AAAB89 · #847B6D · #DC6B84

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

#E28B5C

Apricot · SandyBrown · Warm Sun

HEX
#E28B5C
RGB
rgb(226, 139, 92)
HSL
hsl(21, 70%, 62%)
HSB
hsb(21, 59%, 89%)
CMYK
cmyk(0%, 38%, 59%, 11%)
Oklch
oklch(71.8% 0.123 48.4)

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

#D5AF7F

Ginger · Tan · Warm Sun

HEX
#D5AF7F
RGB
rgb(213, 175, 127)
HSL
hsl(33, 51%, 67%)
HSB
hsb(33, 40%, 84%)
CMYK
cmyk(0%, 18%, 40%, 16%)
Oklch
oklch(77.7% 0.077 72.8)

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

#AAAB89

Autumn Sage · DarkGray · Sunflower

HEX
#AAAB89
RGB
rgb(170, 171, 137)
HSL
hsl(62, 17%, 60%)
HSB
hsb(62, 20%, 67%)
CMYK
cmyk(1%, 0%, 20%, 33%)
Oklch
oklch(73.1% 0.047 108.9)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#847B6D

Ochre · Gray · Amber Brown

HEX
#847B6D
RGB
rgb(132, 123, 109)
HSL
hsl(37, 10%, 47%)
HSB
hsb(37, 17%, 52%)
CMYK
cmyk(0%, 7%, 17%, 48%)
Oklch
oklch(58.7% 0.024 79.0)

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

#DC6B84

Peach Pink · LightCoral · Coral Red

HEX
#DC6B84
RGB
rgb(220, 107, 132)
HSL
hsl(347, 62%, 64%)
HSB
hsb(347, 51%, 86%)
CMYK
cmyk(0%, 51%, 40%, 14%)
Oklch
oklch(66.8% 0.143 7.8)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E28B5C
5AB2E2

Analogous

E25A6F
E28B5C
E2CE5A

Triadic

E28B5C
5AE28A
8A5AE2

Split-Comp.

E28B5C
5AE2CE
5A6FE2

Tetradic

E28B5C
6FE25A
5AB2E2
CE5AE2

Contrast Matrix WCAG 2.1 Contrast

E28B5C
D5AF7F
AAAB89
847B6D
DC6B84
—
1.3
Fail
1.1
Fail
1.6
Fail
1.2
Fail
1.3
Fail
—
1.2
Fail
2.0
Fail
1.6
Fail
1.1
Fail
1.2
Fail
—
1.8
Fail
1.4
Fail
1.6
Fail
2.0
Fail
1.8
Fail
—
1.3
Fail
1.2
Fail
1.6
Fail
1.4
Fail
1.3
Fail
—
White BG
2.6Fail
2.0Fail
2.4Fail
4.2AA Large
3.2AA Large
Black BG
8.1AAA
10.3AAA
8.9AAA
5.0AA
6.5AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

BCBC67
C5C48B
AAAA91
808070
ABAA7E

Deuteranopia

C1C86A
C7CA8D
AAAA93
818171
B2BA7D

Tritanopia

DE7072
D39496
AA9899
847374
D67978

Achromatopsia

A0A0A0
B5B5B5
A7A7A7
7C7C7C
909090

Shades & Tints Shades & Tints

#E28B5C

Dark
Light

#D5AF7F

Dark
Light

#AAAB89

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e28b5c;
  --color-2: #d5af7f;
  --color-3: #aaab89;
  --color-4: #847b6d;
  --color-5: #dc6b84;
}

SCSS

$color-1: #e28b5c;
$color-2: #d5af7f;
$color-3: #aaab89;
$color-4: #847b6d;
$color-5: #dc6b84;

TAILWIND

colors: {
  'brand-1': '#e28b5c',
  'brand-2': '#d5af7f',
  'brand-3': '#aaab89',
  'brand-4': '#847b6d',
  'brand-5': '#dc6b84',
}

RGB Array

[226, 139, 92], [213, 175, 127], [170, 171, 137], [132, 123, 109], [220, 107, 132]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #E28B5C, #D5AF7F, #AAAB89, #847B6D, #DC6B84 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: #e28b5c; --color-2: #d5af7f; --color-3: #aaab89; --color-4: #847b6d; --color-5: #dc6b84. 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