← Back to Editor

#F4E8DA · #F3CEBB · #AE9EA8 · #80697B · #695767

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

#F4E8DA

Goose Yellow · Beige · Peach Orange

HEX
#F4E8DA
RGB
rgb(244, 232, 218)
HSL
hsl(32, 54%, 91%)
HSB
hsb(32, 11%, 96%)
CMYK
cmyk(0%, 5%, 11%, 4%)
Oklch
oklch(93.7% 0.023 71.8)

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

#F3CEBB

Apricot · Wheat · Peach Orange

HEX
#F3CEBB
RGB
rgb(243, 206, 187)
HSL
hsl(20, 70%, 84%)
HSB
hsb(20, 23%, 95%)
CMYK
cmyk(0%, 15%, 23%, 5%)
Oklch
oklch(87.8% 0.049 48.8)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#AE9EA8

Mauve · DarkGray · Silver Sand

HEX
#AE9EA8
RGB
rgb(174, 158, 168)
HSL
hsl(323, 9%, 65%)
HSB
hsb(323, 9%, 68%)
CMYK
cmyk(0%, 9%, 3%, 32%)
Oklch
oklch(71.6% 0.023 339.8)

Traditional「Mauve」· Paint「Silver Sand」· Creative Urban Concrete

#80697B

Rose Purple · Gray · Violet

HEX
#80697B
RGB
rgb(128, 105, 123)
HSL
hsl(313, 10%, 46%)
HSB
hsb(313, 18%, 50%)
CMYK
cmyk(0%, 18%, 4%, 50%)
Oklch
oklch(54.9% 0.039 333.7)

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

#695767

Rose Purple · DimGray · Charcoal

HEX
#695767
RGB
rgb(105, 87, 103)
HSL
hsl(307, 9%, 38%)
HSB
hsb(307, 17%, 41%)
CMYK
cmyk(0%, 17%, 2%, 59%)
Oklch
oklch(48.0% 0.034 329.7)

Traditional「Rose Purple」· Paint「Charcoal」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F4E8DA
DCE7F4

Analogous

F4DCDC
F4E8DA
F4F4DC

Triadic

F4E8DA
DCF4E9
E9DCF4

Split-Comp.

F4E8DA
DCF4F4
DCDCF4

Tetradic

F4E8DA
DCF4DC
DCE7F4
F4DCF4

Contrast Matrix WCAG 2.1 Contrast

F4E8DA
F3CEBB
AE9EA8
80697B
695767
—
1.2
Fail
2.1
Fail
4.1
AA Large
5.5
AA
1.2
Fail
—
1.7
Fail
3.4
AA Large
4.5
AA
2.1
Fail
1.7
Fail
—
2.0
Fail
2.6
Fail
4.1
AA Large
3.4
AA Large
2.0
Fail
—
1.3
Fail
5.5
AA
4.5
AA
2.6
Fail
1.3
Fail
—
White BG
1.2Fail
1.5Fail
2.5Fail
5.0AA
6.6AA
Black BG
17.4AAA
14.4AAA
8.3AAA
4.2AA Large
3.2AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

EFEFDD
E3E3C0
A7A7A6
767677
616163

Deuteranopia

F0F0DE
E5E8C1
A8A9A5
777976
626462

Tritanopia

F3E0E1
F1C3C4
ADA4A3
7F7372
68605F

Achromatopsia

EAEAEA
D7D7D7
A4A4A4
727272
5E5E5E

Shades & Tints Shades & Tints

#F4E8DA

Dark
Light

#F3CEBB

Dark
Light

#AE9EA8

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f4e8da;
  --color-2: #f3cebb;
  --color-3: #ae9ea8;
  --color-4: #80697b;
  --color-5: #695767;
}

SCSS

$color-1: #f4e8da;
$color-2: #f3cebb;
$color-3: #ae9ea8;
$color-4: #80697b;
$color-5: #695767;

TAILWIND

colors: {
  'brand-1': '#f4e8da',
  'brand-2': '#f3cebb',
  'brand-3': '#ae9ea8',
  'brand-4': '#80697b',
  'brand-5': '#695767',
}

RGB Array

[244, 232, 218], [243, 206, 187], [174, 158, 168], [128, 105, 123], [105, 87, 103]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #F4E8DA, #F3CEBB, #AE9EA8, #80697B, #695767 is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #f4e8da; --color-2: #f3cebb; --color-3: #ae9ea8; --color-4: #80697b; --color-5: #695767. 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 tech, SaaS, healthcare, eco industries. 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