#E76EA1 + #F79CAE + #FDCDB1 + #E1E8CC + #B7C2BF · vintage - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

NostalgicClassicTimelessWarmCool

Industry INDUSTRY

CafePublishingCraft

UI Context UI CONTEXT

StorefrontDigital MenuPoster

Color Details Color Details

#E76EA1

Rouge · LightCoral · Rose Pink

HEX

#E76EA1

RGB

rgb(231, 110, 161)

HSL

hsl(335, 72%, 67%)

HSB

hsb(335, 52%, 91%)

CMYK

cmyk(0%, 52%, 30%, 9%)

Oklch

oklch(69.5% 0.159 355.5)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

#F79CAE

Peach Pink · LightPink · Coral Red

HEX

#F79CAE

RGB

rgb(247, 156, 174)

HSL

hsl(348, 85%, 79%)

HSB

hsb(348, 37%, 97%)

CMYK

cmyk(0%, 37%, 30%, 3%)

Oklch

oklch(78.9% 0.110 7.1)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#FDCDB1

Apricot · Wheat · Peach Orange

HEX

#FDCDB1

RGB

rgb(253, 205, 177)

HSL

hsl(22, 95%, 84%)

HSB

hsb(22, 30%, 99%)

CMYK

cmyk(0%, 19%, 30%, 1%)

Oklch

oklch(88.3% 0.066 51.8)

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

#E1E8CC

Willow Green · LightGray · Mint Green

HEX

#E1E8CC

RGB

rgb(225, 232, 204)

HSL

hsl(75, 38%, 85%)

HSB

hsb(75, 12%, 91%)

CMYK

cmyk(3%, 0%, 12%, 9%)

Oklch

oklch(91.8% 0.038 118.6)

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

#B7C2BF

Jade · Silver · Pearl Gray

HEX

#B7C2BF

RGB

rgb(183, 194, 191)

HSL

hsl(164, 8%, 74%)

HSB

hsb(164, 6%, 76%)

CMYK

cmyk(6%, 0%, 2%, 24%)

Oklch

oklch(80.5% 0.013 177.9)

Traditional「Jade」· Paint「Pearl Gray」· Creative Silver Lining

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E76EA1

6EE7B5

Analogous

E76EDD

E76EA1

E7786E

Triadic

E76EA1

A1E76E

6EA1E7

Split-Comp.

E76EA1

6EE778

6EDDE7

Tetradic

E76EA1

DDE76E

6EE7B5

786EE7

Contrast Matrix WCAG 2.1 Contrast

E76EA1	F79CAE	FDCDB1	E1E8CC	B7C2BF
—	1.4 Fail	2.0 Fail	2.3 Fail	1.6 Fail
1.4 Fail	—	1.4 Fail	1.6 Fail	1.1 Fail
2.0 Fail	1.4 Fail	—	1.1 Fail	1.3 Fail
2.3 Fail	1.6 Fail	1.1 Fail	—	1.4 Fail
1.6 Fail	1.1 Fail	1.3 Fail	1.4 Fail	—

White BG

2.9Fail

2.0Fail

1.4Fail

1.3Fail

1.8Fail

Black BG

7.1AAA

10.3AAA

14.5AAA

16.6AAA

11.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B3B295

D0CFAA

E8E8B8

E4E4D3

BCBCC0

Deuteranopia

BAC392

D5DCA9

EBEFB9

E4E3D4

BBBAC0

Tritanopia

E18B89

F2A6A5

FBBDBE

E1D8D9

B8C0C0

Achromatopsia

989898

B9B9B9

D8D8D8

E3E3E3

BEBEBE

Shades & Tints Shades & Tints

#E76EA1

Dark

Light

#F79CAE

Dark

Light

#FDCDB1

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e76ea1;
  --color-2: #f79cae;
  --color-3: #fdcdb1;
  --color-4: #e1e8cc;
  --color-5: #b7c2bf;
}

SCSS

$color-1: #e76ea1;
$color-2: #f79cae;
$color-3: #fdcdb1;
$color-4: #e1e8cc;
$color-5: #b7c2bf;

TAILWIND

colors: {
  'brand-1': '#e76ea1',
  'brand-2': '#f79cae',
  'brand-3': '#fdcdb1',
  'brand-4': '#e1e8cc',
  'brand-5': '#b7c2bf',
}

RGB Array

[231, 110, 161], [247, 156, 174], [253, 205, 177], [225, 232, 204], [183, 194, 191]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #E76EA1, #F79CAE, #FDCDB1, #E1E8CC, #B7C2BF is ideal for: health products, baby brands, fresh-style blogs. 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: #e76ea1; --color-2: #f79cae; --color-3: #fdcdb1; --color-4: #e1e8cc; --color-5: #b7c2bf. 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. 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