← Back to Editor

#DE196B · #F37E8E · #F9EBBA · #5A9B87 · #055D71

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

#DE196B

Dark Violet · MediumVioletRed · Camellia

HEX
#DE196B
RGB
rgb(222, 25, 107)
HSL
hsl(335, 80%, 48%)
HSB
hsb(335, 89%, 87%)
CMYK
cmyk(0%, 89%, 52%, 13%)
Oklch
oklch(58.7% 0.225 4.7)

TraditionalDark Violet」· PaintCamellia」· Creative Blush Sunrise

#F37E8E

Peach Pink · LightCoral · Coral Red

HEX
#F37E8E
RGB
rgb(243, 126, 142)
HSL
hsl(352, 83%, 72%)
HSB
hsb(352, 48%, 95%)
CMYK
cmyk(0%, 48%, 42%, 5%)
Oklch
oklch(72.9% 0.144 12.7)

TraditionalPeach Pink」· PaintCoral Red」· Creative Rose Petal

#F9EBBA

Goose Yellow · Bisque · Lemon Cream

HEX
#F9EBBA
RGB
rgb(249, 235, 186)
HSL
hsl(47, 84%, 85%)
HSB
hsb(47, 25%, 98%)
CMYK
cmyk(0%, 6%, 25%, 2%)
Oklch
oklch(93.9% 0.065 94.0)

TraditionalGoose Yellow」· PaintLemon Cream」· Creative Lemon Fizz

#5A9B87

Mineral Blue · CadetBlue · Mint Ice

HEX
#5A9B87
RGB
rgb(90, 155, 135)
HSL
hsl(162, 27%, 48%)
HSB
hsb(162, 42%, 61%)
CMYK
cmyk(42%, 0%, 13%, 39%)
Oklch
oklch(64.0% 0.074 172.1)

TraditionalMineral Blue」· PaintMint Ice」· Creative Blush Sunrise

#055D71

Lake Blue · Teal · Peacock Green

HEX
#055D71
RGB
rgb(5, 93, 113)
HSL
hsl(191, 92%, 23%)
HSB
hsb(191, 96%, 44%)
CMYK
cmyk(96%, 18%, 0%, 56%)
Oklch
oklch(44.3% 0.079 219.5)

TraditionalLake Blue」· PaintPeacock Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DE196B
18DC8B

Analogous

DC18CC
DE196B
DC2918

Triadic

DE196B
6ADC18
186ADC

Split-Comp.

DE196B
18DC29
18CCDC

Tetradic

DE196B
CCDC18
18DC8B
2918DC

Contrast Matrix WCAG 2.1 Contrast

DE196B
F37E8E
F9EBBA
5A9B87
055D71
1.8
Fail
4.0
AA Large
1.5
Fail
1.6
Fail
1.8
Fail
2.2
Fail
1.3
Fail
2.9
Fail
4.0
AA Large
2.2
Fail
2.7
Fail
6.3
AA
1.5
Fail
1.3
Fail
2.7
Fail
2.3
Fail
1.6
Fail
2.9
Fail
6.3
AA
2.3
Fail
White BG
4.7AA
2.6Fail
1.2Fail
3.2AA Large
7.5AAA
Black BG
4.5AA Large
8.2AAA
17.6AAA
6.5AA
2.8Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

898757
C0BF8A
F3F3C6
76778C
2B2C6C

Deuteranopia

94A352
C7D089
F4F5C9
726E8D
261F6B

Tritanopia

D44744
ED8786
F8CFD1
5D9091
096868

Achromatopsia

5D5D5D
A3A3A3
EAEAEA
858585
454545

Shades & Tints Shades & Tints

#DE196B

Dark
Light

#F37E8E

Dark
Light

#F9EBBA

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #de196b;
  --color-2: #f37e8e;
  --color-3: #f9ebba;
  --color-4: #5a9b87;
  --color-5: #055d71;
}

SCSS

$color-1: #de196b;
$color-2: #f37e8e;
$color-3: #f9ebba;
$color-4: #5a9b87;
$color-5: #055d71;

TAILWIND

colors: {
  'brand-1': '#de196b',
  'brand-2': '#f37e8e',
  'brand-3': '#f9ebba',
  'brand-4': '#5a9b87',
  'brand-5': '#055d71',
}

RGB Array

[222, 25, 107], [243, 126, 142], [249, 235, 186], [90, 155, 135], [5, 93, 113]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #DE196B, #F37E8E, #F9EBBA, #5A9B87, #055D71 is ideal for: social media posters, mobile apps, e-commerce promos, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #de196b; --color-2: #f37e8e; --color-3: #f9ebba; --color-4: #5a9b87; --color-5: #055d71. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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