← Back to Editor

#BAA04C · #72816C · #030303 · #5C433E · #B1623B

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

#BAA04C

Ginger · GoldenRod · Sunflower

HEX
#BAA04C
RGB
rgb(186, 160, 76)
HSL
hsl(46, 44%, 51%)
HSB
hsb(46, 59%, 73%)
CMYK
cmyk(0%, 14%, 59%, 27%)
Oklch
oklch(71.2% 0.108 92.3)

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

#72816C

Celadon · Gray · Warm Gray

HEX
#72816C
RGB
rgb(114, 129, 108)
HSL
hsl(103, 9%, 46%)
HSB
hsb(103, 16%, 51%)
CMYK
cmyk(12%, 0%, 16%, 49%)
Oklch
oklch(58.5% 0.036 136.7)

Traditional「Celadon」· Paint「Warm Gray」· Creative Urban Concrete

#030303

Ink Black · Black · Jet Black

HEX
#030303
RGB
rgb(3, 3, 3)
HSL
hsl(0, 0%, 1%)
HSB
hsb(0, 0%, 1%)
CMYK
cmyk(0%, 0%, 0%, 99%)
Oklch
oklch(9.7% 0.000 89.9)

Traditional「Ink Black」· Paint「Jet Black」· Creative Midnight Shadow

#5C433E

Crimson · DarkOliveGreen · Wine Red

HEX
#5C433E
RGB
rgb(92, 67, 62)
HSL
hsl(10, 19%, 30%)
HSB
hsb(10, 33%, 36%)
CMYK
cmyk(0%, 27%, 33%, 64%)
Oklch
oklch(40.9% 0.036 31.5)

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

#B1623B

Tangerine · Sienna · Amber Brown

HEX
#B1623B
RGB
rgb(177, 98, 59)
HSL
hsl(20, 50%, 46%)
HSB
hsb(20, 67%, 69%)
CMYK
cmyk(0%, 45%, 67%, 31%)
Oklch
oklch(57.9% 0.115 45.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BAA04C
4B65B9

Analogous

B9684B
BAA04C
9CB94B

Triadic

BAA04C
4BB99F
9F4BB9

Split-Comp.

BAA04C
4B9CB9
684BB9

Tetradic

BAA04C
4BB968
4B65B9
B94B9C

Contrast Matrix WCAG 2.1 Contrast

BAA04C
72816C
030303
5C433E
B1623B
—
1.6
Fail
8.1
AAA
3.5
AA Large
1.8
Fail
1.6
Fail
—
5.0
AA
2.2
Fail
1.1
Fail
8.1
AAA
5.0
AA
—
2.3
Fail
4.6
AA
3.5
AA Large
2.2
Fail
2.3
Fail
—
2.0
Fail
1.8
Fail
1.1
Fail
4.6
AA
2.0
Fail
—
White BG
2.6Fail
4.1AA Large
20.6AAA
9.0AAA
4.5AA Large
Black BG
8.2AAA
5.1AA
1.0Fail
2.3Fail
4.7AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

AFAF60
787971
030303
51513F
8F8E44

Deuteranopia

B0B265
787772
030303
535440
939947

Tritanopia

B97074
737576
030303
5B4040
AD4C4E

Achromatopsia

9E9E9E
7A7A7A
030303
4A4A4A
757575

Shades & Tints Shades & Tints

#BAA04C

Dark
Light

#72816C

Dark
Light

#030303

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #baa04c;
  --color-2: #72816c;
  --color-3: #030303;
  --color-4: #5c433e;
  --color-5: #b1623b;
}

SCSS

$color-1: #baa04c;
$color-2: #72816c;
$color-3: #030303;
$color-4: #5c433e;
$color-5: #b1623b;

TAILWIND

colors: {
  'brand-1': '#baa04c',
  'brand-2': '#72816c',
  'brand-3': '#030303',
  'brand-4': '#5c433e',
  'brand-5': '#b1623b',
}

RGB Array

[186, 160, 76], [114, 129, 108], [3, 3, 3], [92, 67, 62], [177, 98, 59]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #BAA04C, #72816C, #030303, #5C433E, #B1623B 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: #baa04c; --color-2: #72816c; --color-3: #030303; --color-4: #5c433e; --color-5: #b1623b. 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