← Back to Editor

#444460 · #8A471C · #B87B3C · #D6A85A · #262834

vintage

A 5-color vintage palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

NostalgicClassicTimelessWarmCool

Industry INDUSTRY

CafePublishingCraft

UI Context UI CONTEXT

StorefrontDigital MenuPosterData Visualization

Color Details Color Details

#444460

Deep Indigo · DarkSlateGray · Prussian Blue

HEX
#444460
RGB
rgb(68, 68, 96)
HSL
hsl(240, 17%, 32%)
HSB
hsb(240, 29%, 38%)
CMYK
cmyk(29%, 29%, 0%, 62%)
Oklch
oklch(39.9% 0.047 284.1)

Traditional「Deep Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#8A471C

Tangerine · Sienna · Amber Brown

HEX
#8A471C
RGB
rgb(138, 71, 28)
HSL
hsl(23, 66%, 33%)
HSB
hsb(23, 80%, 54%)
CMYK
cmyk(0%, 49%, 80%, 46%)
Oklch
oklch(47.3% 0.106 49.9)

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

#B87B3C

Ochre · Chocolate · Amber Brown

HEX
#B87B3C
RGB
rgb(184, 123, 60)
HSL
hsl(30, 51%, 48%)
HSB
hsb(30, 67%, 72%)
CMYK
cmyk(0%, 33%, 67%, 28%)
Oklch
oklch(63.4% 0.110 64.3)

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

#D6A85A

Ginger · SandyBrown · Warm Sun

HEX
#D6A85A
RGB
rgb(214, 168, 90)
HSL
hsl(38, 60%, 60%)
HSB
hsb(38, 58%, 84%)
CMYK
cmyk(0%, 21%, 58%, 16%)
Oklch
oklch(75.8% 0.110 79.0)

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

#262834

Indigo · DarkSlateGray · Deep Sea Blue

HEX
#262834
RGB
rgb(38, 40, 52)
HSL
hsl(231, 16%, 18%)
HSB
hsb(231, 27%, 20%)
CMYK
cmyk(27%, 23%, 0%, 80%)
Oklch
oklch(28.0% 0.022 277.5)

Traditional「Indigo」· Paint「Deep Sea Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

444460
5F5F44

Analogous

44525F
444460
52445F

Triadic

444460
5F4444
445F44

Split-Comp.

444460
5F5244
525F44

Tetradic

444460
5F4452
5F5F44
445F52

Contrast Matrix WCAG 2.1 Contrast

444460
8A471C
B87B3C
D6A85A
262834
—
1.3
Fail
2.6
Fail
4.3
AA Large
1.6
Fail
1.3
Fail
—
2.0
Fail
3.2
AA Large
2.1
Fail
2.6
Fail
2.0
Fail
—
1.6
Fail
4.1
AA Large
4.3
AA Large
3.2
AA Large
1.6
Fail
—
6.7
AA
1.6
Fail
2.1
Fail
4.1
AA Large
6.7
AA
—
White BG
9.4AAA
7.0AAA
3.5AA Large
2.2Fail
14.6AAA
Black BG
2.2Fail
3.0Fail
5.9AA
9.6AAA
1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

444459
6D6C26
9E9D4B
C2C26D
272731

Deuteranopia

444458
717629
A1A64F
C5C871
272730

Tritanopia

445453
872F30
B5575A
D47C7F
262F2E

Achromatopsia

474747
565656
868686
ADADAD
292929

Shades & Tints Shades & Tints

#444460

Dark
Light

#8A471C

Dark
Light

#B87B3C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #444460;
  --color-2: #8a471c;
  --color-3: #b87b3c;
  --color-4: #d6a85a;
  --color-5: #262834;
}

SCSS

$color-1: #444460;
$color-2: #8a471c;
$color-3: #b87b3c;
$color-4: #d6a85a;
$color-5: #262834;

TAILWIND

colors: {
  'brand-1': '#444460',
  'brand-2': '#8a471c',
  'brand-3': '#b87b3c',
  'brand-4': '#d6a85a',
  'brand-5': '#262834',
}

RGB Array

[68, 68, 96], [138, 71, 28], [184, 123, 60], [214, 168, 90], [38, 40, 52]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #444460, #8A471C, #B87B3C, #D6A85A, #262834 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: #444460; --color-2: #8a471c; --color-3: #b87b3c; --color-4: #d6a85a; --color-5: #262834. 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