← Back to Editor

#643C57 · #F58F8F · #FDD0A1 · #FFFFCC · #E3F3CB

vintage

A 5-color vintage palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

NostalgicClassicTimelessWarm

Industry INDUSTRY

CafePublishingCraft

UI Context UI CONTEXT

StorefrontDigital MenuPosterData Visualization

Color Details Color Details

#643C57

Rose Purple · DimGray · Camellia

HEX
#643C57
RGB
rgb(100, 60, 87)
HSL
hsl(320, 25%, 31%)
HSB
hsb(320, 40%, 39%)
CMYK
cmyk(0%, 40%, 13%, 61%)
Oklch
oklch(41.3% 0.068 340.0)

TraditionalRose Purple」· PaintCamellia」· Creative Blush Sunrise

#F58F8F

Peach Pink · LightCoral · Coral Red

HEX
#F58F8F
RGB
rgb(245, 143, 143)
HSL
hsl(0, 84%, 76%)
HSB
hsb(0, 42%, 96%)
CMYK
cmyk(0%, 42%, 42%, 4%)
Oklch
oklch(75.8% 0.124 20.4)

TraditionalPeach Pink」· PaintCoral Red」· Creative Blush Sunrise

#FDD0A1

Goose Yellow · Wheat · Peach Orange

HEX
#FDD0A1
RGB
rgb(253, 208, 161)
HSL
hsl(31, 96%, 81%)
HSB
hsb(31, 36%, 99%)
CMYK
cmyk(0%, 18%, 36%, 1%)
Oklch
oklch(88.5% 0.079 67.7)

TraditionalGoose Yellow」· PaintPeach Orange」· Creative Honey Glow

#FFFFCC

Fresh Green · LightYellow · Lemon Cream

HEX
#FFFFCC
RGB
rgb(255, 255, 204)
HSL
hsl(60, 100%, 90%)
HSB
hsb(60, 20%, 100%)
CMYK
cmyk(0%, 0%, 20%, 0%)
Oklch
oklch(98.8% 0.065 107.5)

TraditionalFresh Green」· PaintLemon Cream」· Creative Lemon Fizz

#E3F3CB

Willow Green · Beige · Mint Green

HEX
#E3F3CB
RGB
rgb(227, 243, 203)
HSL
hsl(84, 62%, 87%)
HSB
hsb(84, 16%, 95%)
CMYK
cmyk(7%, 0%, 16%, 5%)
Oklch
oklch(94.2% 0.055 125.2)

TraditionalWillow Green」· PaintMint Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

643C57
3B6348

Analogous

5C3B63
643C57
633B42

Triadic

643C57
56633B
3B5663

Split-Comp.

643C57
42633B
3B635C

Tetradic

643C57
635C3B
3B6348
3B4263

Contrast Matrix WCAG 2.1 Contrast

643C57
F58F8F
FDD0A1
FFFFCC
E3F3CB
4.0
AA Large
6.3
AA
8.8
AAA
7.7
AAA
4.0
AA Large
1.6
Fail
2.2
Fail
1.9
Fail
6.3
AA
1.6
Fail
1.4
Fail
1.2
Fail
8.8
AAA
2.2
Fail
1.4
Fail
1.1
Fail
7.7
AAA
1.9
Fail
1.2
Fail
1.1
Fail
White BG
9.0AAA
2.3Fail
1.4Fail
1.0Fail
1.2Fail
Black BG
2.3Fail
9.2AAA
14.7AAA
20.4AAA
17.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

535250
C9C88F
EAE9AC
FFFFD8
EAEAD5

Deuteranopia

55584F
CFD68F
ECF0AF
FFFFDB
E9E8D7

Tritanopia

624B4A
F08F8F
FBB5B7
FFE2E4
E4DCDE

Achromatopsia

4B4B4B
ADADAD
D8D8D8
F9F9F9
EAEAEA

Shades & Tints Shades & Tints

#643C57

Dark
Light

#F58F8F

Dark
Light

#FDD0A1

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #643c57;
  --color-2: #f58f8f;
  --color-3: #fdd0a1;
  --color-4: #ffffcc;
  --color-5: #e3f3cb;
}

SCSS

$color-1: #643c57;
$color-2: #f58f8f;
$color-3: #fdd0a1;
$color-4: #ffffcc;
$color-5: #e3f3cb;

TAILWIND

colors: {
  'brand-1': '#643c57',
  'brand-2': '#f58f8f',
  'brand-3': '#fdd0a1',
  'brand-4': '#ffffcc',
  'brand-5': '#e3f3cb',
}

RGB Array

[100, 60, 87], [245, 143, 143], [253, 208, 161], [255, 255, 204], [227, 243, 203]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #643C57, #F58F8F, #FDD0A1, #FFFFCC, #E3F3CB 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: #643c57; --color-2: #f58f8f; --color-3: #fdd0a1; --color-4: #ffffcc; --color-5: #e3f3cb. 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