← Back to Editor

#CACF7E · #D2B04C · #F3725C · #BD6957 · #665751

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 MenuPoster

Color Details Color Details

#CACF7E

Fresh Green · Tan · Sunflower

HEX
#CACF7E
RGB
rgb(202, 207, 126)
HSL
hsl(64, 46%, 65%)
HSB
hsb(64, 39%, 81%)
CMYK
cmyk(2%, 0%, 39%, 19%)
Oklch
oklch(83.2% 0.104 111.5)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#D2B04C

Ginger · SandyBrown · Sunflower

HEX
#D2B04C
RGB
rgb(210, 176, 76)
HSL
hsl(45, 60%, 56%)
HSB
hsb(45, 64%, 82%)
CMYK
cmyk(0%, 16%, 64%, 18%)
Oklch
oklch(76.8% 0.124 90.3)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#F3725C

Peach Pink · Coral · Coral Red

HEX
#F3725C
RGB
rgb(243, 114, 92)
HSL
hsl(9, 86%, 66%)
HSB
hsb(9, 62%, 95%)
CMYK
cmyk(0%, 53%, 62%, 5%)
Oklch
oklch(70.1% 0.163 31.4)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#BD6957

Crimson · Sienna · Passion Red

HEX
#BD6957
RGB
rgb(189, 105, 87)
HSL
hsl(11, 44%, 54%)
HSB
hsb(11, 54%, 74%)
CMYK
cmyk(0%, 44%, 54%, 26%)
Oklch
oklch(61.2% 0.111 33.1)

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

#665751

Tangerine · DimGray · Amber Brown

HEX
#665751
RGB
rgb(102, 87, 81)
HSL
hsl(17, 11%, 36%)
HSB
hsb(17, 21%, 40%)
CMYK
cmyk(0%, 15%, 21%, 60%)
Oklch
oklch(47.0% 0.022 43.0)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CACF7E
827DCF

Analogous

CFAB7D
CACF7E
A0CF7D

Triadic

CACF7E
7DC9CF
CF7DC9

Split-Comp.

CACF7E
7DA0CF
AB7DCF

Tetradic

CACF7E
7DCFAB
827DCF
CF7DA0

Contrast Matrix WCAG 2.1 Contrast

CACF7E
D2B04C
F3725C
BD6957
665751
—
1.3
Fail
1.7
Fail
2.4
Fail
4.2
AA Large
1.3
Fail
—
1.4
Fail
1.9
Fail
3.3
AA Large
1.7
Fail
1.4
Fail
—
1.4
Fail
2.4
Fail
2.4
Fail
1.9
Fail
1.4
Fail
—
1.7
Fail
4.2
AA Large
3.3
AA Large
2.4
Fail
1.7
Fail
—
White BG
1.6Fail
2.1Fail
2.8Fail
3.9AA Large
6.9AA
Black BG
12.7AAA
10.1AAA
7.4AAA
5.3AA
3.0AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

CCCC92
C3C364
BBBA61
99985B
605F52

Deuteranopia

CCCB96
C5C86A
C3CC63
9EA45C
606153

Tritanopia

CAA1A4
D0777C
ED6666
B95F60
655454

Achromatopsia

C4C4C4
AFAFAF
969696
808080
5B5B5B

Shades & Tints Shades & Tints

#CACF7E

Dark
Light

#D2B04C

Dark
Light

#F3725C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cacf7e;
  --color-2: #d2b04c;
  --color-3: #f3725c;
  --color-4: #bd6957;
  --color-5: #665751;
}

SCSS

$color-1: #cacf7e;
$color-2: #d2b04c;
$color-3: #f3725c;
$color-4: #bd6957;
$color-5: #665751;

TAILWIND

colors: {
  'brand-1': '#cacf7e',
  'brand-2': '#d2b04c',
  'brand-3': '#f3725c',
  'brand-4': '#bd6957',
  'brand-5': '#665751',
}

RGB Array

[202, 207, 126], [210, 176, 76], [243, 114, 92], [189, 105, 87], [102, 87, 81]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #CACF7E, #D2B04C, #F3725C, #BD6957, #665751 is ideal for: corporate websites, product showcases, portfolios. 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: #cacf7e; --color-2: #d2b04c; --color-3: #f3725c; --color-4: #bd6957; --color-5: #665751. 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. 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