#F0D8C0 + #F09060 + #F01860 + #609078 + #C0D8C0 · vintage - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

NostalgicClassicTimelessWarm

Industry INDUSTRY

CafePublishingCraft

UI Context UI CONTEXT

StorefrontDigital MenuPoster

Color Details Color Details

#F0D8C0

Goose Yellow · Wheat · Peach Orange

HEX

#F0D8C0

RGB

rgb(240, 216, 192)

HSL

hsl(30, 62%, 85%)

HSB

hsb(30, 20%, 94%)

CMYK

cmyk(0%, 10%, 20%, 6%)

Oklch

oklch(89.6% 0.042 67.3)

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

#F09060

Apricot · SandyBrown · Warm Sun

HEX

#F09060

RGB

rgb(240, 144, 96)

HSL

hsl(20, 83%, 66%)

HSB

hsb(20, 60%, 94%)

CMYK

cmyk(0%, 40%, 60%, 6%)

Oklch

oklch(74.5% 0.133 46.6)

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

#F01860

Dark Violet · Crimson · Rose Pink

HEX

#F01860

RGB

rgb(240, 24, 96)

HSL

hsl(340, 88%, 52%)

HSB

hsb(340, 90%, 94%)

CMYK

cmyk(0%, 90%, 60%, 6%)

Oklch

oklch(61.6% 0.238 11.2)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#609078

Mineral Blue · SlateGray · Olive Green

HEX

#609078

RGB

rgb(96, 144, 120)

HSL

hsl(150, 20%, 47%)

HSB

hsb(150, 33%, 56%)

CMYK

cmyk(33%, 0%, 17%, 44%)

Oklch

oklch(61.2% 0.064 162.0)

Traditional「Mineral Blue」· Paint「Olive Green」· Creative Blush Sunrise

#C0D8C0

Celadon · Silver · Apple Green

HEX

#C0D8C0

RGB

rgb(192, 216, 192)

HSL

hsl(120, 24%, 80%)

HSB

hsb(120, 11%, 85%)

CMYK

cmyk(11%, 0%, 11%, 15%)

Oklch

oklch(85.8% 0.042 145.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F0D8C0

C1D9F0

Analogous

F0C1C1

F0D8C0

F0F0C1

Triadic

F0D8C0

C1F0D9

D9C1F0

Split-Comp.

F0D8C0

C1F0F0

C1C1F0

Tetradic

F0D8C0

C1F0C1

C1D9F0

F0C1F0

Contrast Matrix WCAG 2.1 Contrast

F0D8C0	F09060	F01860	609078	C0D8C0
—	1.7 Fail	3.1 AA Large	2.7 Fail	1.1 Fail
1.7 Fail	—	1.8 Fail	1.5 Fail	1.6 Fail
3.1 AA Large	1.8 Fail	—	1.2 Fail	2.8 Fail
2.7 Fail	1.5 Fail	1.2 Fail	—	2.4 Fail
1.1 Fail	1.6 Fail	2.8 Fail	2.4 Fail	—

White BG

1.4Fail

2.4Fail

4.2AA Large

3.6AA Large

1.5Fail

Black BG

15.3AAA

8.9AAA

5.0AA

5.8AA

13.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E6E5C6

C6C66C

92914F

75757E

CACBC6

Deuteranopia

E7E9C7

CCD36E

9FAF4A

726E7F

C9C7C7

Tritanopia

EFCACB

EB7577

E5413E

628283

C1CACB

Achromatopsia

DCDCDC

A7A7A7

616161

7F7F7F

CECECE

Shades & Tints Shades & Tints

#F0D8C0

Dark

Light

#F09060

Dark

Light

#F01860

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f0d8c0;
  --color-2: #f09060;
  --color-3: #f01860;
  --color-4: #609078;
  --color-5: #c0d8c0;
}

SCSS

$color-1: #f0d8c0;
$color-2: #f09060;
$color-3: #f01860;
$color-4: #609078;
$color-5: #c0d8c0;

TAILWIND

colors: {
  'brand-1': '#f0d8c0',
  'brand-2': '#f09060',
  'brand-3': '#f01860',
  'brand-4': '#609078',
  'brand-5': '#c0d8c0',
}

RGB Array

[240, 216, 192], [240, 144, 96], [240, 24, 96], [96, 144, 120], [192, 216, 192]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #F0D8C0, #F09060, #F01860, #609078, #C0D8C0 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: #f0d8c0; --color-2: #f09060; --color-3: #f01860; --color-4: #609078; --color-5: #c0d8c0. 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