← Back to Editor

#4B4F23 · #A79968 · #876A2C · #22150E · #70031C

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

#4B4F23

Autumn Sage · DarkOliveGreen · Amber Gold

HEX
#4B4F23
RGB
rgb(75, 79, 35)
HSL
hsl(65, 39%, 22%)
HSB
hsb(65, 56%, 31%)
CMYK
cmyk(5%, 0%, 56%, 69%)
Oklch
oklch(41.3% 0.065 113.5)

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

#A79968

Ginger · Gray · Sunflower

HEX
#A79968
RGB
rgb(167, 153, 104)
HSL
hsl(47, 26%, 53%)
HSB
hsb(47, 38%, 65%)
CMYK
cmyk(0%, 8%, 38%, 35%)
Oklch
oklch(68.3% 0.069 94.1)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#876A2C

Ochre · Sienna · Honey Gold

HEX
#876A2C
RGB
rgb(135, 106, 44)
HSL
hsl(41, 51%, 35%)
HSB
hsb(41, 67%, 53%)
CMYK
cmyk(0%, 21%, 67%, 47%)
Oklch
oklch(54.0% 0.088 83.8)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#22150E

Tangerine · Black · Cinnamon

HEX
#22150E
RGB
rgb(34, 21, 14)
HSL
hsl(21, 42%, 9%)
HSB
hsb(21, 59%, 13%)
CMYK
cmyk(0%, 38%, 59%, 87%)
Oklch
oklch(21.1% 0.025 49.2)

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

#70031C

Vermilion · Maroon · Wine Red

HEX
#70031C
RGB
rgb(112, 3, 28)
HSL
hsl(346, 95%, 23%)
HSB
hsb(346, 97%, 44%)
CMYK
cmyk(0%, 97%, 75%, 56%)
Oklch
oklch(34.7% 0.137 18.5)

Traditional「Vermilion」· Paint「Wine Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

4B4F23
26224E

Analogous

4E3C22
4B4F23
344E22

Triadic

4B4F23
224A4E
4E224A

Split-Comp.

4B4F23
22344E
3C224E

Tetradic

4B4F23
224E3C
26224E
4E2234

Contrast Matrix WCAG 2.1 Contrast

4B4F23
A79968
876A2C
22150E
70031C
—
3.0
AA Large
1.7
Fail
2.1
Fail
1.4
Fail
3.0
AA Large
—
1.8
Fail
6.3
AA
4.3
AA Large
1.7
Fail
1.8
Fail
—
3.5
AA Large
2.4
Fail
2.1
Fail
6.3
AA
3.5
AA Large
—
1.5
Fail
1.4
Fail
4.3
AA Large
2.4
Fail
1.5
Fail
—
White BG
8.6AAA
2.8Fail
5.1AA
17.8AAA
12.2AAA
Black BG
2.4Fail
7.4AAA
4.1AA Large
1.2Fail
1.7Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

4D4D2E
A1A174
7A7A3B
1C1C10
414016

Deuteranopia

4D4C30
A2A377
7C7E3F
1D1E10
474F14

Tritanopia

4B3638
A67D7F
864749
211111
6B1110

Achromatopsia

494949
989898
6C6C6C
181818
262626

Shades & Tints Shades & Tints

#4B4F23

Dark
Light

#A79968

Dark
Light

#876A2C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #4b4f23;
  --color-2: #a79968;
  --color-3: #876a2c;
  --color-4: #22150e;
  --color-5: #70031c;
}

SCSS

$color-1: #4b4f23;
$color-2: #a79968;
$color-3: #876a2c;
$color-4: #22150e;
$color-5: #70031c;

TAILWIND

colors: {
  'brand-1': '#4b4f23',
  'brand-2': '#a79968',
  'brand-3': '#876a2c',
  'brand-4': '#22150e',
  'brand-5': '#70031c',
}

RGB Array

[75, 79, 35], [167, 153, 104], [135, 106, 44], [34, 21, 14], [112, 3, 28]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #4B4F23, #A79968, #876A2C, #22150E, #70031C is ideal for: tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #4b4f23; --color-2: #a79968; --color-3: #876a2c; --color-4: #22150e; --color-5: #70031c. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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 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