← Back to Editor

#F9886A · #FFDDC3 · #D40927 · #EFCF60 · #76BBA9

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

#F9886A

Peach Pink · Salmon · Coral Red

HEX
#F9886A
RGB
rgb(249, 136, 106)
HSL
hsl(13, 92%, 70%)
HSB
hsb(13, 57%, 98%)
CMYK
cmyk(0%, 45%, 57%, 2%)
Oklch
oklch(74.5% 0.145 35.8)

TraditionalPeach Pink」· PaintCoral Red」· Creative Blush Sunrise

#FFDDC3

Apricot · Bisque · Peach Orange

HEX
#FFDDC3
RGB
rgb(255, 221, 195)
HSL
hsl(26, 100%, 88%)
HSB
hsb(26, 24%, 100%)
CMYK
cmyk(0%, 13%, 24%, 0%)
Oklch
oklch(91.9% 0.051 59.5)

TraditionalApricot」· PaintPeach Orange」· Creative Honey Glow

#D40927

Vermilion · Crimson · Passion Red

HEX
#D40927
RGB
rgb(212, 9, 39)
HSL
hsl(351, 92%, 43%)
HSB
hsb(351, 96%, 83%)
CMYK
cmyk(0%, 96%, 82%, 17%)
Oklch
oklch(55.1% 0.220 24.4)

TraditionalVermilion」· PaintPassion Red」· Creative Blush Sunrise

#EFCF60

Ginger · SandyBrown · Sunflower

HEX
#EFCF60
RGB
rgb(239, 207, 96)
HSL
hsl(47, 82%, 66%)
HSB
hsb(47, 60%, 94%)
CMYK
cmyk(0%, 13%, 60%, 6%)
Oklch
oklch(86.1% 0.134 93.3)

TraditionalGinger」· PaintSunflower」· Creative Lemon Fizz

#76BBA9

Mineral Blue · MediumAquaMarine · Lake Green

HEX
#76BBA9
RGB
rgb(118, 187, 169)
HSL
hsl(164, 34%, 60%)
HSB
hsb(164, 37%, 73%)
CMYK
cmyk(37%, 0%, 10%, 27%)
Oklch
oklch(74.1% 0.075 175.8)

TraditionalMineral Blue」· PaintLake Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F9886A
6CDAF9

Analogous

F96C94
F9886A
F9D16C

Triadic

F9886A
6CF98B
8B6CF9

Split-Comp.

F9886A
6CF9D1
6C94F9

Tetradic

F9886A
94F96C
6CDAF9
D16CF9

Contrast Matrix WCAG 2.1 Contrast

F9886A
FFDDC3
D40927
EFCF60
76BBA9
1.9
Fail
2.3
Fail
1.6
Fail
1.1
Fail
1.9
Fail
4.2
AA Large
1.2
Fail
1.7
Fail
2.3
Fail
4.2
AA Large
3.6
AA Large
2.4
Fail
1.6
Fail
1.2
Fail
3.6
AA Large
1.5
Fail
1.1
Fail
1.7
Fail
2.4
Fail
1.5
Fail
White BG
2.4Fail
1.3Fail
5.4AA
1.5Fail
2.2Fail
Black BG
8.8AAA
16.4AAA
3.9AA Large
13.8AAA
9.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C8C771
F0F0C9
7C7A20
E1E17B
9494AD

Deuteranopia

CFD773
F2F5CB
88971E
E3E581
908BAE

Tritanopia

F37778
FDCECF
CA1A19
ED9095
79B1B2

Achromatopsia

A6A6A6
E4E4E4
494949
CCCCCC
A4A4A4

Shades & Tints Shades & Tints

#F9886A

Dark
Light

#FFDDC3

Dark
Light

#D40927

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f9886a;
  --color-2: #ffddc3;
  --color-3: #d40927;
  --color-4: #efcf60;
  --color-5: #76bba9;
}

SCSS

$color-1: #f9886a;
$color-2: #ffddc3;
$color-3: #d40927;
$color-4: #efcf60;
$color-5: #76bba9;

TAILWIND

colors: {
  'brand-1': '#f9886a',
  'brand-2': '#ffddc3',
  'brand-3': '#d40927',
  'brand-4': '#efcf60',
  'brand-5': '#76bba9',
}

RGB Array

[249, 136, 106], [255, 221, 195], [212, 9, 39], [239, 207, 96], [118, 187, 169]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #F9886A, #FFDDC3, #D40927, #EFCF60, #76BBA9 is ideal for: social media posters, mobile apps, e-commerce promos, health products, baby brands, fresh-style blogs, 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: #f9886a; --color-2: #ffddc3; --color-3: #d40927; --color-4: #efcf60; --color-5: #76bba9. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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