← Back to Editor

#BAB6AB · #918D6B · #7B0869 · #3B3C1D · #300D2A

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

#BAB6AB

Ginger · DarkGray · Sunflower

HEX
#BAB6AB
RGB
rgb(186, 182, 171)
HSL
hsl(44, 10%, 70%)
HSB
hsb(44, 8%, 73%)
CMYK
cmyk(0%, 2%, 8%, 27%)
Oklch
oklch(77.6% 0.016 90.3)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#918D6B

Autumn Sage · Gray · Honey Gold

HEX
#918D6B
RGB
rgb(145, 141, 107)
HSL
hsl(54, 15%, 49%)
HSB
hsb(54, 26%, 57%)
CMYK
cmyk(0%, 3%, 26%, 43%)
Oklch
oklch(63.8% 0.048 102.0)

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

#7B0869

Rose Purple · Purple · Eggplant

HEX
#7B0869
RGB
rgb(123, 8, 105)
HSL
hsl(309, 88%, 26%)
HSB
hsb(309, 93%, 48%)
CMYK
cmyk(0%, 93%, 15%, 52%)
Oklch
oklch(40.1% 0.171 336.5)

Traditional「Rose Purple」· Paint「Eggplant」· Creative Blush Sunrise

#3B3C1D

Autumn Sage · DarkSlateGray · Amber Gold

HEX
#3B3C1D
RGB
rgb(59, 60, 29)
HSL
hsl(62, 35%, 17%)
HSB
hsb(62, 52%, 24%)
CMYK
cmyk(2%, 0%, 52%, 76%)
Oklch
oklch(34.7% 0.048 110.3)

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

#300D2A

Rose Purple · Black · Dark Purple

HEX
#300D2A
RGB
rgb(48, 13, 42)
HSL
hsl(310, 57%, 12%)
HSB
hsb(310, 73%, 19%)
CMYK
cmyk(0%, 73%, 13%, 81%)
Oklch
oklch(23.1% 0.071 334.9)

Traditional「Rose Purple」· Paint「Dark Purple」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BAB6AB
ABAFBA

Analogous

BAAEAB
BAB6AB
B7BAAB

Triadic

BAB6AB
ABBAB6
B6ABBA

Split-Comp.

BAB6AB
ABB7BA
AEABBA

Tetradic

BAB6AB
ABBAAE
ABAFBA
BAABB7

Contrast Matrix WCAG 2.1 Contrast

BAB6AB
918D6B
7B0869
3B3C1D
300D2A
—
1.7
Fail
5.0
AA
5.6
AA
8.5
AAA
1.7
Fail
—
3.0
Fail
3.4
AA Large
5.1
AA
5.0
AA
3.0
Fail
—
1.1
Fail
1.7
Fail
5.6
AA
3.4
AA Large
1.1
Fail
—
1.5
Fail
8.5
AAA
5.1
AA
1.7
Fail
1.5
Fail
—
White BG
2.0Fail
3.4AA Large
10.1AAA
11.4AAA
17.3AAA
Black BG
10.4AAA
6.2AA
2.1Fail
1.9Fail
1.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

B8B8AE
8F8F73
494852
3B3B25
212123

Deuteranopia

B9B9AE
909075
50594C
3B3B26
232521

Tritanopia

BAB0B0
917A7B
753F3B
3B2A2C
2E1D1C

Achromatopsia

B6B6B6
8A8A8A
353535
383838
1B1B1B

Shades & Tints Shades & Tints

#BAB6AB

Dark
Light

#918D6B

Dark
Light

#7B0869

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bab6ab;
  --color-2: #918d6b;
  --color-3: #7b0869;
  --color-4: #3b3c1d;
  --color-5: #300d2a;
}

SCSS

$color-1: #bab6ab;
$color-2: #918d6b;
$color-3: #7b0869;
$color-4: #3b3c1d;
$color-5: #300d2a;

TAILWIND

colors: {
  'brand-1': '#bab6ab',
  'brand-2': '#918d6b',
  'brand-3': '#7b0869',
  'brand-4': '#3b3c1d',
  'brand-5': '#300d2a',
}

RGB Array

[186, 182, 171], [145, 141, 107], [123, 8, 105], [59, 60, 29], [48, 13, 42]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #BAB6AB, #918D6B, #7B0869, #3B3C1D, #300D2A 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: #bab6ab; --color-2: #918d6b; --color-3: #7b0869; --color-4: #3b3c1d; --color-5: #300d2a. 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