← Back to Editor

#100B16 · #BB3D36 · #E8914B · #DDC191 · #ABA67C

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

#100B16

Deep Indigo · Black · Dark Purple

HEX
#100B16
RGB
rgb(16, 11, 22)
HSL
hsl(267, 33%, 6%)
HSB
hsb(267, 50%, 9%)
CMYK
cmyk(27%, 50%, 0%, 91%)
Oklch
oklch(16.2% 0.024 304.7)

Traditional「Deep Indigo」· Paint「Dark Purple」· Creative Blush Sunrise

#BB3D36

Crimson · Brown · Passion Red

HEX
#BB3D36
RGB
rgb(187, 61, 54)
HSL
hsl(3, 55%, 47%)
HSB
hsb(3, 71%, 73%)
CMYK
cmyk(0%, 67%, 71%, 27%)
Oklch
oklch(54.1% 0.163 27.2)

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

#E8914B

Tangerine · Coral · Warm Sun

HEX
#E8914B
RGB
rgb(232, 145, 75)
HSL
hsl(27, 77%, 60%)
HSB
hsb(27, 68%, 91%)
CMYK
cmyk(0%, 38%, 68%, 9%)
Oklch
oklch(73.4% 0.135 57.2)

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

#DDC191

Goose Yellow · BurlyWood · Warm Sun

HEX
#DDC191
RGB
rgb(221, 193, 145)
HSL
hsl(38, 53%, 72%)
HSB
hsb(38, 34%, 87%)
CMYK
cmyk(0%, 13%, 34%, 13%)
Oklch
oklch(82.3% 0.071 80.9)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#ABA67C

Autumn Sage · DarkSeaGreen · Sunflower

HEX
#ABA67C
RGB
rgb(171, 166, 124)
HSL
hsl(54, 22%, 58%)
HSB
hsb(54, 27%, 67%)
CMYK
cmyk(0%, 3%, 27%, 33%)
Oklch
oklch(71.9% 0.058 102.0)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

100B16
10140A

Analogous

0A0B14
100B16
140A14

Triadic

100B16
140F0A
0A140F

Split-Comp.

100B16
14140A
0B140A

Tetradic

100B16
140A0B
10140A
0A1414

Contrast Matrix WCAG 2.1 Contrast

100B16
BB3D36
E8914B
DDC191
ABA67C
—
3.5
AA Large
7.9
AAA
11.2
AAA
7.8
AAA
3.5
AA Large
—
2.2
Fail
3.2
AA Large
2.2
Fail
7.9
AAA
2.2
Fail
—
1.4
Fail
1.0
Fail
11.2
AAA
3.2
AA Large
1.4
Fail
—
1.4
Fail
7.8
AAA
2.2
Fail
1.0
Fail
1.4
Fail
—
White BG
19.4AAA
5.5AA
2.4Fail
1.7Fail
2.5Fail
Black BG
1.1Fail
3.8AA Large
8.6AAA
12.1AAA
8.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

0E0E13
848338
C2C25C
D1D19D
A9A986

Deuteranopia

0E0F13
8C9538
C7CE60
D3D59F
A9AA89

Tritanopia

101111
B53939
E4696C
DCA6A8
AB8E90

Achromatopsia

0E0E0E
626262
A3A3A3
C4C4C4
A3A3A3

Shades & Tints Shades & Tints

#100B16

Dark
Light

#BB3D36

Dark
Light

#E8914B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #100b16;
  --color-2: #bb3d36;
  --color-3: #e8914b;
  --color-4: #ddc191;
  --color-5: #aba67c;
}

SCSS

$color-1: #100b16;
$color-2: #bb3d36;
$color-3: #e8914b;
$color-4: #ddc191;
$color-5: #aba67c;

TAILWIND

colors: {
  'brand-1': '#100b16',
  'brand-2': '#bb3d36',
  'brand-3': '#e8914b',
  'brand-4': '#ddc191',
  'brand-5': '#aba67c',
}

RGB Array

[16, 11, 22], [187, 61, 54], [232, 145, 75], [221, 193, 145], [171, 166, 124]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #100B16, #BB3D36, #E8914B, #DDC191, #ABA67C is ideal for: 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: #100b16; --color-2: #bb3d36; --color-3: #e8914b; --color-4: #ddc191; --color-5: #aba67c. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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