← Back to Editor

#332222 · #555566 · #443344 · #669999 · #779999

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 MenuPoster

Color Details Color Details

#332222

Crimson · DarkSlateGray · Deep Berry

HEX
#332222
RGB
rgb(51, 34, 34)
HSL
hsl(0, 20%, 17%)
HSB
hsb(0, 33%, 20%)
CMYK
cmyk(0%, 33%, 33%, 80%)
Oklch
oklch(27.3% 0.026 18.9)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

#555566

Deep Indigo · DimGray · Charcoal

HEX
#555566
RGB
rgb(85, 85, 102)
HSL
hsl(240, 9%, 37%)
HSB
hsb(240, 17%, 40%)
CMYK
cmyk(17%, 17%, 0%, 60%)
Oklch
oklch(45.6% 0.027 285.3)

Traditional「Deep Indigo」· Paint「Charcoal」· Creative Midnight Shadow

#443344

Rose Purple · DarkSlateGray · Eggplant

HEX
#443344
RGB
rgb(68, 51, 68)
HSL
hsl(300, 14%, 23%)
HSB
hsb(300, 25%, 27%)
CMYK
cmyk(0%, 25%, 0%, 73%)
Oklch
oklch(34.7% 0.037 326.3)

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

#669999

Slate Blue · CadetBlue · Mint Ice

HEX
#669999
RGB
rgb(102, 153, 153)
HSL
hsl(180, 20%, 50%)
HSB
hsb(180, 33%, 60%)
CMYK
cmyk(33%, 0%, 0%, 40%)
Oklch
oklch(64.7% 0.054 195.9)

Traditional「Slate Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#779999

Slate Blue · LightSlateGray · Lake Green

HEX
#779999
RGB
rgb(119, 153, 153)
HSL
hsl(180, 14%, 53%)
HSB
hsb(180, 22%, 60%)
CMYK
cmyk(22%, 0%, 0%, 40%)
Oklch
oklch(65.8% 0.038 196.3)

Traditional「Slate Blue」· Paint「Lake Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

332222
233434

Analogous

34232B
332222
342B23

Triadic

332222
233423
232334

Split-Comp.

332222
23342B
232B34

Tetradic

332222
2B3423
233434
2B2334

Contrast Matrix WCAG 2.1 Contrast

332222
555566
443344
669999
779999
—
2.1
Fail
1.3
Fail
4.7
AA
4.9
AA
2.1
Fail
—
1.6
Fail
2.3
Fail
2.4
Fail
1.3
Fail
1.6
Fail
—
3.7
AA Large
3.8
AA Large
4.7
AA
2.3
Fail
3.7
AA Large
—
1.0
Fail
4.9
AA
2.4
Fail
3.8
AA Large
1.0
Fail
—
White BG
15.1AAA
7.3AAA
11.6AAA
3.2AA Large
3.1AA Large
Black BG
1.4Fail
2.9Fail
1.8Fail
6.6AA
6.8AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2C2B22
555562
3D3C40
7C7D99
868699

Deuteranopia

2D2E22
555561
3E3F3F
797599
848199

Tritanopia

322222
555F5E
433D3C
699999
799999

Achromatopsia

272727
575757
3A3A3A
8A8A8A
8F8F8F

Shades & Tints Shades & Tints

#332222

Dark
Light

#555566

Dark
Light

#443344

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #332222;
  --color-2: #555566;
  --color-3: #443344;
  --color-4: #669999;
  --color-5: #779999;
}

SCSS

$color-1: #332222;
$color-2: #555566;
$color-3: #443344;
$color-4: #669999;
$color-5: #779999;

TAILWIND

colors: {
  'brand-1': '#332222',
  'brand-2': '#555566',
  'brand-3': '#443344',
  'brand-4': '#669999',
  'brand-5': '#779999',
}

RGB Array

[51, 34, 34], [85, 85, 102], [68, 51, 68], [102, 153, 153], [119, 153, 153]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #332222, #555566, #443344, #669999, #779999 is ideal for: brand design, premium product pages, magazine layouts, tech websites, dark mode UIs, game UIs. Low-saturation colors convey a sophisticated, premium feel. 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: #332222; --color-2: #555566; --color-3: #443344; --color-4: #669999; --color-5: #779999. 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 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