← Back to Editor

#71927D · #ACC77A · #38311E · #657D5D · #4C352D

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

#71927D

Celadon · Gray · Olive Green

HEX
#71927D
RGB
rgb(113, 146, 125)
HSL
hsl(142, 13%, 51%)
HSB
hsb(142, 23%, 57%)
CMYK
cmyk(23%, 0%, 14%, 43%)
Oklch
oklch(62.9% 0.049 156.8)

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

#ACC77A

Willow Green · DarkSeaGreen · Apple Green

HEX
#ACC77A
RGB
rgb(172, 199, 122)
HSL
hsl(81, 41%, 63%)
HSB
hsb(81, 39%, 78%)
CMYK
cmyk(14%, 0%, 39%, 22%)
Oklch
oklch(79.1% 0.106 124.5)

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

#38311E

Ochre · DarkSlateGray · Amber Gold

HEX
#38311E
RGB
rgb(56, 49, 30)
HSL
hsl(44, 30%, 17%)
HSB
hsb(44, 46%, 22%)
CMYK
cmyk(0%, 13%, 46%, 78%)
Oklch
oklch(31.5% 0.033 90.1)

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

#657D5D

Celadon · DimGray · Olive Green

HEX
#657D5D
RGB
rgb(101, 125, 93)
HSL
hsl(105, 15%, 43%)
HSB
hsb(105, 26%, 49%)
CMYK
cmyk(19%, 0%, 26%, 51%)
Oklch
oklch(56.2% 0.056 138.0)

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

#4C352D

Tangerine · DarkSlateGray · Cinnamon

HEX
#4C352D
RGB
rgb(76, 53, 45)
HSL
hsl(15, 26%, 24%)
HSB
hsb(15, 41%, 30%)
CMYK
cmyk(0%, 30%, 41%, 70%)
Oklch
oklch(35.3% 0.036 40.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

71927D
927286

Analogous

769272
71927D
72928E

Triadic

71927D
7E7292
927E72

Split-Comp.

71927D
8E7292
927276

Tetradic

71927D
727692
927286
928E72

Contrast Matrix WCAG 2.1 Contrast

71927D
ACC77A
38311E
657D5D
4C352D
—
1.8
Fail
3.8
AA Large
1.3
Fail
3.3
AA Large
1.8
Fail
—
6.9
AA
2.4
Fail
6.0
AA
3.8
AA Large
6.9
AA
—
2.9
Fail
1.1
Fail
1.3
Fail
2.4
Fail
2.9
Fail
—
2.5
Fail
3.3
AA Large
6.0
AA
1.1
Fail
2.5
Fail
—
White BG
3.4AA Large
1.9Fail
12.9AAA
4.5AA
11.3AAA
Black BG
6.1AA
11.2AAA
1.6Fail
4.6AA
1.9Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

7F8082
B8B88D
353523
6F7065
42422F

Deuteranopia

7D7B83
B6B491
353624
6E6C67
43452F

Tritanopia

738687
AD9B9F
382627
666B6C
4B3031

Achromatopsia

868686
B6B6B6
313131
727272
3B3B3B

Shades & Tints Shades & Tints

#71927D

Dark
Light

#ACC77A

Dark
Light

#38311E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #71927d;
  --color-2: #acc77a;
  --color-3: #38311e;
  --color-4: #657d5d;
  --color-5: #4c352d;
}

SCSS

$color-1: #71927d;
$color-2: #acc77a;
$color-3: #38311e;
$color-4: #657d5d;
$color-5: #4c352d;

TAILWIND

colors: {
  'brand-1': '#71927d',
  'brand-2': '#acc77a',
  'brand-3': '#38311e',
  'brand-4': '#657d5d',
  'brand-5': '#4c352d',
}

RGB Array

[113, 146, 125], [172, 199, 122], [56, 49, 30], [101, 125, 93], [76, 53, 45]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #71927D, #ACC77A, #38311E, #657D5D, #4C352D is ideal for: brand design, premium product pages, magazine layouts, tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #71927d; --color-2: #acc77a; --color-3: #38311e; --color-4: #657d5d; --color-5: #4c352d. 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 finance, legal, luxury industries. Restrained colors convey professionalism and trust. 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