← Back to Editor

#97CFAF · #C8FABD · #EBFFB3 · #FFD7A6 · #78554E

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

#97CFAF

Celadon · DarkSeaGreen · Apple Green

HEX
#97CFAF
RGB
rgb(151, 207, 175)
HSL
hsl(146, 37%, 70%)
HSB
hsb(146, 27%, 81%)
CMYK
cmyk(27%, 0%, 15%, 19%)
Oklch
oklch(80.7% 0.074 159.2)

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

#C8FABD

Emerald · LightGray · Mint Green

HEX
#C8FABD
RGB
rgb(200, 250, 189)
HSL
hsl(109, 86%, 86%)
HSB
hsb(109, 24%, 98%)
CMYK
cmyk(20%, 0%, 24%, 2%)
Oklch
oklch(93.5% 0.096 140.0)

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

#EBFFB3

Willow Green · Wheat · Mint Green

HEX
#EBFFB3
RGB
rgb(235, 255, 179)
HSL
hsl(76, 100%, 85%)
HSB
hsb(76, 30%, 100%)
CMYK
cmyk(8%, 0%, 30%, 0%)
Oklch
oklch(96.8% 0.099 120.3)

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

#FFD7A6

Goose Yellow · Wheat · Peach Orange

HEX
#FFD7A6
RGB
rgb(255, 215, 166)
HSL
hsl(33, 100%, 83%)
HSB
hsb(33, 35%, 100%)
CMYK
cmyk(0%, 16%, 35%, 0%)
Oklch
oklch(90.2% 0.078 72.2)

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

#78554E

Crimson · DimGray · Wine Red

HEX
#78554E
RGB
rgb(120, 85, 78)
HSL
hsl(10, 21%, 39%)
HSB
hsb(10, 35%, 47%)
CMYK
cmyk(0%, 29%, 35%, 53%)
Oklch
oklch(48.5% 0.048 31.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

97CFAF
CF96B6

Analogous

9ACF96
97CFAF
96CFCB

Triadic

97CFAF
AF96CF
CFAF96

Split-Comp.

97CFAF
CB96CF
CF969A

Tetradic

97CFAF
969ACF
CF96B6
CFCB96

Contrast Matrix WCAG 2.1 Contrast

97CFAF
C8FABD
EBFFB3
FFD7A6
78554E
—
1.5
Fail
1.6
Fail
1.3
Fail
3.7
AA Large
1.5
Fail
—
1.1
Fail
1.2
Fail
5.6
AA
1.6
Fail
1.1
Fail
—
1.3
Fail
6.1
AA
1.3
Fail
1.2
Fail
1.3
Fail
—
4.8
AA
3.7
AA Large
5.6
AA
6.1
AA
4.8
AA
—
White BG
1.8Fail
1.2Fail
1.1Fail
1.4Fail
6.5AA
Black BG
11.9AAA
17.9AAA
19.5AAA
15.5AAA
3.2AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

AFB0B7
DEDECC
F4F4C5
EEEDB2
696950

Deuteranopia

ACA8B9
DBD7CF
F3F1CA
F0F3B5
6B6E50

Tritanopia

9ABDBE
CBD7DA
ECD4D7
FDBBBD
765151

Achromatopsia

BBBBBB
E4E4E4
F0F0F0
DDDDDD
5F5F5F

Shades & Tints Shades & Tints

#97CFAF

Dark
Light

#C8FABD

Dark
Light

#EBFFB3

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #97cfaf;
  --color-2: #c8fabd;
  --color-3: #ebffb3;
  --color-4: #ffd7a6;
  --color-5: #78554e;
}

SCSS

$color-1: #97cfaf;
$color-2: #c8fabd;
$color-3: #ebffb3;
$color-4: #ffd7a6;
$color-5: #78554e;

TAILWIND

colors: {
  'brand-1': '#97cfaf',
  'brand-2': '#c8fabd',
  'brand-3': '#ebffb3',
  'brand-4': '#ffd7a6',
  'brand-5': '#78554e',
}

RGB Array

[151, 207, 175], [200, 250, 189], [235, 255, 179], [255, 215, 166], [120, 85, 78]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #97CFAF, #C8FABD, #EBFFB3, #FFD7A6, #78554E 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: #97cfaf; --color-2: #c8fabd; --color-3: #ebffb3; --color-4: #ffd7a6; --color-5: #78554e. 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