#3D3430 + #E50202 + #848628 + #130B08 + #211621 · vintage - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

NostalgicClassicTimelessWarm

Industry INDUSTRY

CafePublishingCraft

UI Context UI CONTEXT

StorefrontDigital MenuPoster

Color Details Color Details

#3D3430

Tangerine · DarkSlateGray · Cinnamon

HEX

#3D3430

RGB

rgb(61, 52, 48)

HSL

hsl(18, 12%, 21%)

HSB

hsb(18, 21%, 24%)

CMYK

cmyk(0%, 15%, 21%, 76%)

Oklch

oklch(33.3% 0.015 45.4)

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

#E50202

Vermilion · Red · Passion Red

HEX

#E50202

RGB

rgb(229, 2, 2)

HSL

hsl(0, 98%, 45%)

HSB

hsb(0, 99%, 90%)

CMYK

cmyk(0%, 99%, 99%, 10%)

Oklch

oklch(57.9% 0.237 29.2)

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

#848628

Autumn Sage · Olive · Honey Gold

HEX

#848628

RGB

rgb(132, 134, 40)

HSL

hsl(61, 54%, 34%)

HSB

hsb(61, 70%, 53%)

CMYK

cmyk(1%, 0%, 70%, 47%)

Oklch

oklch(60.0% 0.114 110.6)

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

#130B08

Tangerine · Black · Cinnamon

HEX

#130B08

RGB

rgb(19, 11, 8)

HSL

hsl(16, 41%, 5%)

HSB

hsb(16, 58%, 7%)

CMYK

cmyk(0%, 42%, 58%, 93%)

Oklch

oklch(16.0% 0.016 42.3)

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

#211621

Rose Purple · Black · Dark Purple

HEX

#211621

RGB

rgb(33, 22, 33)

HSL

hsl(300, 20%, 11%)

HSB

hsb(300, 33%, 13%)

CMYK

cmyk(0%, 33%, 0%, 87%)

Oklch

oklch(21.9% 0.027 326.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3D3430

2F383C

Analogous

3C2F32

3D3430

3C392F

Triadic

3D3430

2F3C33

332F3C

Split-Comp.

3D3430

2F3C39

2F323C

Tetradic

3D3430

323C2F

2F383C

392F3C

Contrast Matrix WCAG 2.1 Contrast

3D3430	E50202	848628	130B08	211621
—	2.5 Fail	3.1 AA Large	1.6 Fail	1.4 Fail
2.5 Fail	—	1.2 Fail	4.0 AA Large	3.6 AA Large
3.1 AA Large	1.2 Fail	—	5.0 AA	4.5 AA
1.6 Fail	4.0 AA Large	5.0 AA	—	1.1 Fail
1.4 Fail	3.6 AA Large	4.5 AA	1.1 Fail	—

White BG

12.1AAA

4.8AA

3.9AA Large

19.5AAA

17.5AAA

Black BG

1.7Fail

4.3AA Large

5.4AA

1.1Fail

1.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

393931

838102

85853F

100F09

1C1C1E

Deuteranopia

3A3A31

90A102

858544

101109

1D1E1E

Tritanopia

3D3232

DA0202

845155

130909

201C1C

Achromatopsia

363636

464646

7B7B7B

0D0D0D

1B1B1B

Shades & Tints Shades & Tints

#3D3430

Dark

Light

#E50202

Dark

Light

#848628

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3d3430;
  --color-2: #e50202;
  --color-3: #848628;
  --color-4: #130b08;
  --color-5: #211621;
}

SCSS

$color-1: #3d3430;
$color-2: #e50202;
$color-3: #848628;
$color-4: #130b08;
$color-5: #211621;

TAILWIND

colors: {
  'brand-1': '#3d3430',
  'brand-2': '#e50202',
  'brand-3': '#848628',
  'brand-4': '#130b08',
  'brand-5': '#211621',
}

RGB Array

[61, 52, 48], [229, 2, 2], [132, 134, 40], [19, 11, 8], [33, 22, 33]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #3D3430, #E50202, #848628, #130B08, #211621 is ideal for: tech websites, dark mode UIs, game UIs. 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: #3d3430; --color-2: #e50202; --color-3: #848628; --color-4: #130b08; --color-5: #211621. 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. 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