← Back to Editor

#FE6D17 · #643B05 · #89BB9E · #EEE2C8 · #B4B300

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

#FE6D17

Tangerine · Chocolate · Warm Sun

HEX
#FE6D17
RGB
rgb(254, 109, 23)
HSL
hsl(22, 99%, 54%)
HSB
hsb(22, 91%, 100%)
CMYK
cmyk(0%, 57%, 91%, 0%)
Oklch
oklch(70.4% 0.196 44.5)

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

#643B05

Ochre · Maroon · Cinnamon

HEX
#643B05
RGB
rgb(100, 59, 5)
HSL
hsl(34, 90%, 21%)
HSB
hsb(34, 95%, 39%)
CMYK
cmyk(0%, 41%, 95%, 61%)
Oklch
oklch(39.3% 0.085 65.8)

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

#89BB9E

Celadon · DarkSeaGreen · Apple Green

HEX
#89BB9E
RGB
rgb(137, 187, 158)
HSL
hsl(145, 27%, 64%)
HSB
hsb(145, 27%, 73%)
CMYK
cmyk(27%, 0%, 16%, 27%)
Oklch
oklch(74.9% 0.067 158.8)

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

#EEE2C8

Goose Yellow · Bisque · Lemon Cream

HEX
#EEE2C8
RGB
rgb(238, 226, 200)
HSL
hsl(41, 53%, 86%)
HSB
hsb(41, 16%, 93%)
CMYK
cmyk(0%, 5%, 16%, 7%)
Oklch
oklch(91.6% 0.037 86.2)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#B4B300

Autumn Sage · DarkGoldenRod · Honey Gold

HEX
#B4B300
RGB
rgb(180, 179, 0)
HSL
hsl(60, 100%, 35%)
HSB
hsb(60, 100%, 71%)
CMYK
cmyk(0%, 1%, 100%, 29%)
Oklch
oklch(74.3% 0.162 109.4)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FE6D17
16A9FE

Analogous

FE1635
FE6D17
FEDF16

Triadic

FE6D17
16FE6B
6B16FE

Split-Comp.

FE6D17
16FEDF
1635FE

Tetradic

FE6D17
35FE16
16A9FE
DF16FE

Contrast Matrix WCAG 2.1 Contrast

FE6D17
643B05
89BB9E
EEE2C8
B4B300
—
3.4
AA Large
1.3
Fail
2.2
Fail
1.3
Fail
3.4
AA Large
—
4.5
AA Large
7.5
AAA
4.3
AA Large
1.3
Fail
4.5
AA Large
—
1.7
Fail
1.0
Fail
2.2
Fail
7.5
AAA
1.7
Fail
—
1.7
Fail
1.3
Fail
4.3
AA Large
1.0
Fail
1.7
Fail
—
White BG
2.8Fail
9.7AAA
2.2Fail
1.3Fail
2.2Fail
Black BG
7.4AAA
2.2Fail
9.7AAA
16.3AAA
9.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

BFBE2C
525212
9F9FA5
E9E9CE
B4B42B

Deuteranopia

C8D231
555815
9C98A7
EAEAD0
B4B436

Tritanopia

F73C40
621C1F
8CABAC
EDD3D4
B44E55

Achromatopsia

8F8F8F
414141
A9A9A9
E3E3E3
9F9F9F

Shades & Tints Shades & Tints

#FE6D17

Dark
Light

#643B05

Dark
Light

#89BB9E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fe6d17;
  --color-2: #643b05;
  --color-3: #89bb9e;
  --color-4: #eee2c8;
  --color-5: #b4b300;
}

SCSS

$color-1: #fe6d17;
$color-2: #643b05;
$color-3: #89bb9e;
$color-4: #eee2c8;
$color-5: #b4b300;

TAILWIND

colors: {
  'brand-1': '#fe6d17',
  'brand-2': '#643b05',
  'brand-3': '#89bb9e',
  'brand-4': '#eee2c8',
  'brand-5': '#b4b300',
}

RGB Array

[254, 109, 23], [100, 59, 5], [137, 187, 158], [238, 226, 200], [180, 179, 0]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #FE6D17, #643B05, #89BB9E, #EEE2C8, #B4B300 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: #fe6d17; --color-2: #643b05; --color-3: #89bb9e; --color-4: #eee2c8; --color-5: #b4b300. 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