#2D5161 + #333E55 + #382B4A + #3E173E + #430432 · vintage - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

NostalgicClassicTimelessWarmCool

Industry INDUSTRY

CafePublishingCraft

UI Context UI CONTEXT

StorefrontDigital MenuPoster

Color Details Color Details

#2D5161

Slate Blue · DarkSlateGray · Mint Ice

HEX

#2D5161

RGB

rgb(45, 81, 97)

HSL

hsl(198, 37%, 28%)

HSB

hsb(198, 54%, 38%)

CMYK

cmyk(54%, 16%, 0%, 62%)

Oklch

oklch(41.5% 0.049 228.5)

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

#333E55

Indigo · DarkSlateGray · Prussian Blue

HEX

#333E55

RGB

rgb(51, 62, 85)

HSL

hsl(221, 25%, 27%)

HSB

hsb(221, 40%, 33%)

CMYK

cmyk(40%, 27%, 0%, 67%)

Oklch

oklch(36.4% 0.043 264.6)

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

#382B4A

Deep Indigo · DarkSlateGray · Eggplant

HEX

#382B4A

RGB

rgb(56, 43, 74)

HSL

hsl(265, 26%, 23%)

HSB

hsb(265, 42%, 29%)

CMYK

cmyk(24%, 42%, 0%, 71%)

Oklch

oklch(31.8% 0.056 302.6)

Traditional「Deep Indigo」· Paint「Eggplant」· Creative Blush Sunrise

#3E173E

Rose Purple · DarkSlateGray · Dark Purple

HEX

#3E173E

RGB

rgb(62, 23, 62)

HSL

hsl(300, 46%, 17%)

HSB

hsb(300, 63%, 24%)

CMYK

cmyk(0%, 63%, 0%, 76%)

Oklch

oklch(28.1% 0.084 327.5)

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

#430432

Rose Purple · MidnightBlue · Dark Purple

HEX

#430432

RGB

rgb(67, 4, 50)

HSL

hsl(316, 89%, 14%)

HSB

hsb(316, 94%, 26%)

CMYK

cmyk(0%, 94%, 25%, 74%)

Oklch

oklch(26.1% 0.105 342.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2D5161

623D2D

Analogous

2D6257

2D5161

2D3862

Triadic

2D5161

622D52

52622D

Split-Comp.

2D5161

622D38

62572D

Tetradic

2D5161

572D62

623D2D

38622D

Contrast Matrix WCAG 2.1 Contrast

2D5161	333E55	382B4A	3E173E	430432
—	1.3 Fail	1.5 Fail	1.8 Fail	1.9 Fail
1.3 Fail	—	1.2 Fail	1.4 Fail	1.5 Fail
1.5 Fail	1.2 Fail	—	1.2 Fail	1.2 Fail
1.8 Fail	1.4 Fail	1.2 Fail	—	1.1 Fail
1.9 Fail	1.5 Fail	1.2 Fail	1.1 Fail	—

White BG

8.5AAA

10.7AAA

13.0AAA

15.0AAA

16.1AAA

Black BG

2.5Fail

2.0Fail

1.6Fail

1.4Fail

1.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

3D3D5D

38384F

323242

2D2D35

282727

Deuteranopia

3B385C

37364E

333441

2F3232

2B3024

Tritanopia

2F5A59

344B4A

373D3B

3C2D2B

401E1C

Achromatopsia

484848

3D3D3D

323232

272727

1C1C1C

Shades & Tints Shades & Tints

#2D5161

Dark

Light

#333E55

Dark

Light

#382B4A

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2d5161;
  --color-2: #333e55;
  --color-3: #382b4a;
  --color-4: #3e173e;
  --color-5: #430432;
}

SCSS

$color-1: #2d5161;
$color-2: #333e55;
$color-3: #382b4a;
$color-4: #3e173e;
$color-5: #430432;

TAILWIND

colors: {
  'brand-1': '#2d5161',
  'brand-2': '#333e55',
  'brand-3': '#382b4a',
  'brand-4': '#3e173e',
  'brand-5': '#430432',
}

RGB Array

[45, 81, 97], [51, 62, 85], [56, 43, 74], [62, 23, 62], [67, 4, 50]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #2D5161, #333E55, #382B4A, #3E173E, #430432 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: #2d5161; --color-2: #333e55; --color-3: #382b4a; --color-4: #3e173e; --color-5: #430432. 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