← Back to Editor

#4CD4B0 · #FFFCE6 · #EDD834 · #F24D16 · #7D1424

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

#4CD4B0

Mineral Blue · MediumAquaMarine · Lake Green

HEX
#4CD4B0
RGB
rgb(76, 212, 176)
HSL
hsl(164, 61%, 56%)
HSB
hsb(164, 64%, 83%)
CMYK
cmyk(64%, 0%, 17%, 17%)
Oklch
oklch(78.7% 0.129 172.0)

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

#FFFCE6

Fresh Green · LightYellow · Lemon Cream

HEX
#FFFCE6
RGB
rgb(255, 252, 230)
HSL
hsl(53, 100%, 95%)
HSB
hsb(53, 10%, 100%)
CMYK
cmyk(0%, 1%, 10%, 0%)
Oklch
oklch(98.8% 0.029 100.6)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

#EDD834

Autumn Sage · Gold · Sunflower

HEX
#EDD834
RGB
rgb(237, 216, 52)
HSL
hsl(53, 84%, 57%)
HSB
hsb(53, 78%, 93%)
CMYK
cmyk(0%, 9%, 78%, 7%)
Oklch
oklch(87.4% 0.170 101.6)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#F24D16

Tangerine · OrangeRed · Warm Sun

HEX
#F24D16
RGB
rgb(242, 77, 22)
HSL
hsl(15, 89%, 52%)
HSB
hsb(15, 91%, 95%)
CMYK
cmyk(0%, 68%, 91%, 5%)
Oklch
oklch(64.7% 0.210 36.4)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#7D1424

Vermilion · Maroon · Wine Red

HEX
#7D1424
RGB
rgb(125, 20, 36)
HSL
hsl(351, 72%, 28%)
HSB
hsb(351, 84%, 49%)
CMYK
cmyk(0%, 84%, 71%, 51%)
Oklch
oklch(38.5% 0.138 19.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

4CD4B0
D34A6F

Analogous

4AD36A
4CD4B0
4AB3D3

Triadic

4CD4B0
AF4AD3
D3AF4A

Split-Comp.

4CD4B0
D34AB3
D36A4A

Tetradic

4CD4B0
6A4AD3
D34A6F
B3D34A

Contrast Matrix WCAG 2.1 Contrast

4CD4B0
FFFCE6
EDD834
F24D16
7D1424
—
1.8
Fail
1.3
Fail
1.9
Fail
5.7
AA
1.8
Fail
—
1.4
Fail
3.5
AA Large
10.2
AAA
1.3
Fail
1.4
Fail
—
2.5
Fail
7.2
AAA
1.9
Fail
3.5
AA Large
2.5
Fail
—
2.9
Fail
5.7
AA
10.2
AAA
7.2
AAA
2.9
Fail
—
White BG
1.8Fail
1.0Fail
1.5Fail
3.6AA Large
10.5AAA
Black BG
11.4AAA
20.3AAA
14.5AAA
5.8AA
2.0Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

8788B9
FEFEEB
E4E45C
ABA923
504F20

Deuteranopia

7F75BB
FEFEED
E5E765
B4C027
565E1F

Tritanopia

53C0C1
FFF0F0
EC7B82
EA2E30
781D1C

Achromatopsia

A7A7A7
FAFAFA
CCCCCC
787878
353535

Shades & Tints Shades & Tints

#4CD4B0

Dark
Light

#FFFCE6

Dark
Light

#EDD834

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #4cd4b0;
  --color-2: #fffce6;
  --color-3: #edd834;
  --color-4: #f24d16;
  --color-5: #7d1424;
}

SCSS

$color-1: #4cd4b0;
$color-2: #fffce6;
$color-3: #edd834;
$color-4: #f24d16;
$color-5: #7d1424;

TAILWIND

colors: {
  'brand-1': '#4cd4b0',
  'brand-2': '#fffce6',
  'brand-3': '#edd834',
  'brand-4': '#f24d16',
  'brand-5': '#7d1424',
}

RGB Array

[76, 212, 176], [255, 252, 230], [237, 216, 52], [242, 77, 22], [125, 20, 36]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #4CD4B0, #FFFCE6, #EDD834, #F24D16, #7D1424 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: #4cd4b0; --color-2: #fffce6; --color-3: #edd834; --color-4: #f24d16; --color-5: #7d1424. 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