← Back to Editor

#563356 · #BF4F42 · #E68C48 · #E1D079 · #FBD7AF

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

#563356

Rose Purple · DarkSlateGray · Eggplant

HEX
#563356
RGB
rgb(86, 51, 86)
HSL
hsl(300, 26%, 27%)
HSB
hsb(300, 41%, 34%)
CMYK
cmyk(0%, 41%, 0%, 66%)
Oklch
oklch(37.8% 0.073 326.9)

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

#BF4F42

Crimson · Sienna · Passion Red

HEX
#BF4F42
RGB
rgb(191, 79, 66)
HSL
hsl(6, 49%, 50%)
HSB
hsb(6, 65%, 75%)
CMYK
cmyk(0%, 59%, 65%, 25%)
Oklch
oklch(57.2% 0.147 29.1)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#E68C48

Tangerine · Coral · Warm Sun

HEX
#E68C48
RGB
rgb(230, 140, 72)
HSL
hsl(26, 76%, 59%)
HSB
hsb(26, 69%, 90%)
CMYK
cmyk(0%, 39%, 69%, 10%)
Oklch
oklch(72.2% 0.137 55.4)

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

#E1D079

Fresh Green · BurlyWood · Sunflower

HEX
#E1D079
RGB
rgb(225, 208, 121)
HSL
hsl(50, 63%, 68%)
HSB
hsb(50, 46%, 88%)
CMYK
cmyk(0%, 8%, 46%, 12%)
Oklch
oklch(85.3% 0.110 98.5)

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

#FBD7AF

Goose Yellow · Wheat · Peach Orange

HEX
#FBD7AF
RGB
rgb(251, 215, 175)
HSL
hsl(32, 90%, 84%)
HSB
hsb(32, 30%, 98%)
CMYK
cmyk(0%, 14%, 30%, 2%)
Oklch
oklch(90.0% 0.066 69.8)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

563356
335733

Analogous

453357
563356
573345

Triadic

563356
575733
335757

Split-Comp.

563356
455733
335745

Tetradic

563356
574533
335733
334557

Contrast Matrix WCAG 2.1 Contrast

563356
BF4F42
E68C48
E1D079
FBD7AF
—
2.2
Fail
4.1
AA Large
6.7
AA
7.7
AAA
2.2
Fail
—
1.9
Fail
3.1
AA Large
3.5
AA Large
4.1
AA Large
1.9
Fail
—
1.6
Fail
1.9
Fail
6.7
AA
3.1
AA Large
1.6
Fail
—
1.1
Fail
7.7
AAA
3.5
AA Large
1.9
Fail
1.1
Fail
—
White BG
10.5AAA
4.8AA
2.6Fail
1.6Fail
1.4Fail
Black BG
2.0Fail
4.4AA Large
8.2AAA
13.5AAA
15.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

47474E
8F8D45
BFBE58
DAD98E
EBEBB9

Deuteranopia

494C4C
959D46
C4CB5C
DBDC93
EEF0BB

Tritanopia

544745
B94848
E26568
E09FA2
F9C0C2

Achromatopsia

414141
6F6F6F
9F9F9F
CBCBCB
DDDDDD

Shades & Tints Shades & Tints

#563356

Dark
Light

#BF4F42

Dark
Light

#E68C48

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #563356;
  --color-2: #bf4f42;
  --color-3: #e68c48;
  --color-4: #e1d079;
  --color-5: #fbd7af;
}

SCSS

$color-1: #563356;
$color-2: #bf4f42;
$color-3: #e68c48;
$color-4: #e1d079;
$color-5: #fbd7af;

TAILWIND

colors: {
  'brand-1': '#563356',
  'brand-2': '#bf4f42',
  'brand-3': '#e68c48',
  'brand-4': '#e1d079',
  'brand-5': '#fbd7af',
}

RGB Array

[86, 51, 86], [191, 79, 66], [230, 140, 72], [225, 208, 121], [251, 215, 175]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #563356, #BF4F42, #E68C48, #E1D079, #FBD7AF 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: #563356; --color-2: #bf4f42; --color-3: #e68c48; --color-4: #e1d079; --color-5: #fbd7af. 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