← Back to Editor

#EB9C4D · #F2D680 · #F3FFCF · #BAC9A9 · #697060

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

#EB9C4D

Ginger · SandyBrown · Warm Sun

HEX
#EB9C4D
RGB
rgb(235, 156, 77)
HSL
hsl(30, 80%, 61%)
HSB
hsb(30, 67%, 92%)
CMYK
cmyk(0%, 34%, 67%, 8%)
Oklch
oklch(75.7% 0.133 63.2)

Traditional「Ginger」· Paint「Warm Sun」· Creative Honey Glow

#F2D680

Goose Yellow · Khaki · Sunflower

HEX
#F2D680
RGB
rgb(242, 214, 128)
HSL
hsl(45, 81%, 73%)
HSB
hsb(45, 47%, 95%)
CMYK
cmyk(0%, 12%, 47%, 5%)
Oklch
oklch(88.1% 0.110 91.9)

Traditional「Goose Yellow」· Paint「Sunflower」· Creative Lemon Fizz

#F3FFCF

Willow Green · Beige · Mint Green

HEX
#F3FFCF
RGB
rgb(243, 255, 207)
HSL
hsl(75, 100%, 91%)
HSB
hsb(75, 19%, 100%)
CMYK
cmyk(5%, 0%, 19%, 0%)
Oklch
oklch(97.9% 0.063 119.0)

Traditional「Willow Green」· Paint「Mint Green」· Creative Mint Breeze

#BAC9A9

Willow Green · Silver · Apple Green

HEX
#BAC9A9
RGB
rgb(186, 201, 169)
HSL
hsl(88, 23%, 73%)
HSB
hsb(88, 16%, 79%)
CMYK
cmyk(7%, 0%, 16%, 21%)
Oklch
oklch(81.6% 0.047 127.9)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#697060

Grass Green · DimGray · Warm Gray

HEX
#697060
RGB
rgb(105, 112, 96)
HSL
hsl(86, 8%, 41%)
HSB
hsb(86, 14%, 44%)
CMYK
cmyk(6%, 0%, 14%, 56%)
Oklch
oklch(53.4% 0.026 126.6)

Traditional「Grass Green」· Paint「Warm Gray」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

EB9C4D
4C9CEB

Analogous

EB4C4C
EB9C4D
EBEB4C

Triadic

EB9C4D
4CEB9C
9C4CEB

Split-Comp.

EB9C4D
4CEBEB
4C4CEB

Tetradic

EB9C4D
4CEB4C
4C9CEB
EB4CEB

Contrast Matrix WCAG 2.1 Contrast

EB9C4D
F2D680
F3FFCF
BAC9A9
697060
—
1.6
Fail
2.1
Fail
1.3
Fail
2.3
Fail
1.6
Fail
—
1.4
Fail
1.2
Fail
3.6
AA Large
2.1
Fail
1.4
Fail
—
1.7
Fail
4.9
AA
1.3
Fail
1.2
Fail
1.7
Fail
—
2.9
Fail
2.3
Fail
3.6
AA Large
4.9
AA
2.9
Fail
—
White BG
2.2Fail
1.4Fail
1.0Fail
1.7Fail
5.1AA
Black BG
9.4AAA
14.7AAA
20.0AAA
12.0AAA
4.1AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

C9C860
E6E695
F8F8DB
C0C1B1
6C6C64

Deuteranopia

CDD365
E8EA9A
F8F7DD
C0BFB3
6C6B65

Tritanopia

E76F73
F1A5A9
F4E4E6
BBB7B8
696768

Achromatopsia

ABABAB
D5D5D5
F6F6F6
C1C1C1
6C6C6C

Shades & Tints Shades & Tints

#EB9C4D

Dark
Light

#F2D680

Dark
Light

#F3FFCF

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #eb9c4d;
  --color-2: #f2d680;
  --color-3: #f3ffcf;
  --color-4: #bac9a9;
  --color-5: #697060;
}

SCSS

$color-1: #eb9c4d;
$color-2: #f2d680;
$color-3: #f3ffcf;
$color-4: #bac9a9;
$color-5: #697060;

TAILWIND

colors: {
  'brand-1': '#eb9c4d',
  'brand-2': '#f2d680',
  'brand-3': '#f3ffcf',
  'brand-4': '#bac9a9',
  'brand-5': '#697060',
}

RGB Array

[235, 156, 77], [242, 214, 128], [243, 255, 207], [186, 201, 169], [105, 112, 96]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #EB9C4D, #F2D680, #F3FFCF, #BAC9A9, #697060 is ideal for: health products, baby brands, fresh-style blogs, 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: #eb9c4d; --color-2: #f2d680; --color-3: #f3ffcf; --color-4: #bac9a9; --color-5: #697060. 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 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