← Back to Editor

#F7D4C1 · #B9A985 · #A28A64 · #453921 · #A2A976

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

#F7D4C1

Apricot · Wheat · Peach Orange

HEX
#F7D4C1
RGB
rgb(247, 212, 193)
HSL
hsl(21, 77%, 86%)
HSB
hsb(21, 22%, 97%)
CMYK
cmyk(0%, 14%, 22%, 3%)
Oklch
oklch(89.4% 0.047 50.2)

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

#B9A985

Ginger · Tan · Sunflower

HEX
#B9A985
RGB
rgb(185, 169, 133)
HSL
hsl(42, 27%, 62%)
HSB
hsb(42, 28%, 73%)
CMYK
cmyk(0%, 9%, 28%, 27%)
Oklch
oklch(73.9% 0.053 86.8)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#A28A64

Ginger · Gray · Warm Sun

HEX
#A28A64
RGB
rgb(162, 138, 100)
HSL
hsl(37, 25%, 51%)
HSB
hsb(37, 38%, 64%)
CMYK
cmyk(0%, 15%, 38%, 36%)
Oklch
oklch(64.6% 0.060 78.8)

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

#453921

Ochre · DarkOliveGreen · Amber Gold

HEX
#453921
RGB
rgb(69, 57, 33)
HSL
hsl(40, 35%, 20%)
HSB
hsb(40, 52%, 27%)
CMYK
cmyk(0%, 17%, 52%, 73%)
Oklch
oklch(35.1% 0.041 83.9)

Traditional「Ochre」· Paint「Amber Gold」· Creative Blush Sunrise

#A2A976

Autumn Sage · DarkSeaGreen · Sunflower

HEX
#A2A976
RGB
rgb(162, 169, 118)
HSL
hsl(68, 23%, 56%)
HSB
hsb(68, 30%, 66%)
CMYK
cmyk(4%, 0%, 30%, 34%)
Oklch
oklch(71.6% 0.070 114.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F7D4C1
C0E4F7

Analogous

F7C0C8
F7D4C1
F7EFC0

Triadic

F7D4C1
C0F7D3
D3C0F7

Split-Comp.

F7D4C1
C0F7EF
C0C8F7

Tetradic

F7D4C1
C8F7C0
C0E4F7
EFC0F7

Contrast Matrix WCAG 2.1 Contrast

F7D4C1
B9A985
A28A64
453921
A2A976
—
1.7
Fail
2.4
Fail
8.1
AAA
1.8
Fail
1.7
Fail
—
1.4
Fail
4.9
AA
1.1
Fail
2.4
Fail
1.4
Fail
—
3.4
AA Large
1.3
Fail
8.1
AAA
4.9
AA
3.4
AA Large
—
4.6
AA
1.8
Fail
1.1
Fail
1.3
Fail
4.6
AA
—
White BG
1.4Fail
2.3Fail
3.3AA Large
11.3AAA
2.5Fail
Black BG
15.1AAA
9.1AAA
6.4AA
1.9Fail
8.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E8E8C6
B2B28E
98976D
404027
A5A582

Deuteranopia

EAECC7
B3B490
999B6F
414128
A5A485

Tritanopia

F5C9CA
B89596
A17476
442B2C
A28C8E

Achromatopsia

DCDCDC
AAAAAA
8D8D8D
3A3A3A
A1A1A1

Shades & Tints Shades & Tints

#F7D4C1

Dark
Light

#B9A985

Dark
Light

#A28A64

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f7d4c1;
  --color-2: #b9a985;
  --color-3: #a28a64;
  --color-4: #453921;
  --color-5: #a2a976;
}

SCSS

$color-1: #f7d4c1;
$color-2: #b9a985;
$color-3: #a28a64;
$color-4: #453921;
$color-5: #a2a976;

TAILWIND

colors: {
  'brand-1': '#f7d4c1',
  'brand-2': '#b9a985',
  'brand-3': '#a28a64',
  'brand-4': '#453921',
  'brand-5': '#a2a976',
}

RGB Array

[247, 212, 193], [185, 169, 133], [162, 138, 100], [69, 57, 33], [162, 169, 118]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #F7D4C1, #B9A985, #A28A64, #453921, #A2A976 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: #f7d4c1; --color-2: #b9a985; --color-3: #a28a64; --color-4: #453921; --color-5: #a2a976. 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