#CCCB49 + #E07251 + #DCDB96 + #A6DA90 + #BED164 · vintage - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

NostalgicClassicTimelessWarm

Industry INDUSTRY

CafePublishingCraft

UI Context UI CONTEXT

StorefrontDigital MenuPoster

Color Details Color Details

#CCCB49

Autumn Sage · GoldenRod · Sunflower

HEX

#CCCB49

RGB

rgb(204, 203, 73)

HSL

hsl(60, 56%, 54%)

HSB

hsb(60, 64%, 80%)

CMYK

cmyk(0%, 0%, 64%, 20%)

Oklch

oklch(81.9% 0.149 108.9)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#E07251

Vermilion · Coral · Passion Red

HEX

#E07251

RGB

rgb(224, 114, 81)

HSL

hsl(14, 70%, 60%)

HSB

hsb(14, 64%, 88%)

CMYK

cmyk(0%, 49%, 64%, 12%)

Oklch

oklch(67.3% 0.145 37.5)

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

#DCDB96

Fresh Green · Khaki · Sunflower

HEX

#DCDB96

RGB

rgb(220, 219, 150)

HSL

hsl(59, 50%, 73%)

HSB

hsb(59, 32%, 86%)

CMYK

cmyk(0%, 0%, 32%, 14%)

Oklch

oklch(87.6% 0.089 107.4)

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

#A6DA90

Celadon · LightGreen · Apple Green

HEX

#A6DA90

RGB

rgb(166, 218, 144)

HSL

hsl(102, 50%, 71%)

HSB

hsb(102, 34%, 85%)

CMYK

cmyk(24%, 0%, 34%, 15%)

Oklch

oklch(83.4% 0.113 136.7)

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

#BED164

Willow Green · Tan · Apple Green

HEX

#BED164

RGB

rgb(190, 209, 100)

HSL

hsl(70, 54%, 61%)

HSB

hsb(70, 52%, 82%)

CMYK

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

Oklch

oklch(82.4% 0.136 117.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CCCB49

4848CB

Analogous

CB8A48

CCCB49

8ACB48

Triadic

CCCB49

48CBCB

CB48CB

Split-Comp.

CCCB49

488ACB

8A48CB

Tetradic

CCCB49

48CB8A

4848CB

CB488A

Contrast Matrix WCAG 2.1 Contrast

CCCB49	E07251	DCDB96	A6DA90	BED164
—	1.8 Fail	1.2 Fail	1.1 Fail	1.0 Fail
1.8 Fail	—	2.2 Fail	1.9 Fail	1.9 Fail
1.2 Fail	2.2 Fail	—	1.1 Fail	1.2 Fail
1.1 Fail	1.9 Fail	1.1 Fail	—	1.0 Fail
1.0 Fail	1.9 Fail	1.2 Fail	1.0 Fail	—

White BG

1.7Fail

3.1AA Large

1.4Fail

1.6Fail

1.7Fail

Black BG

12.2AAA

6.7AA

14.6AAA

13.1AAA

12.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CCCC68

B0AF59

DCDCA7

BDBDA2

C6C67E

Deuteranopia

CCCC70

B7BF5B

DCDCAB

BAB6A6

C5C485

Tritanopia

CC8187

DA5F61

DCB4B7

A9B0B3

BF9398

Achromatopsia

BCBCBC

8F8F8F

D3D3D3

C2C2C2

BFBFBF

Shades & Tints Shades & Tints

#CCCB49

Dark

Light

#E07251

Dark

Light

#DCDB96

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cccb49;
  --color-2: #e07251;
  --color-3: #dcdb96;
  --color-4: #a6da90;
  --color-5: #bed164;
}

SCSS

$color-1: #cccb49;
$color-2: #e07251;
$color-3: #dcdb96;
$color-4: #a6da90;
$color-5: #bed164;

TAILWIND

colors: {
  'brand-1': '#cccb49',
  'brand-2': '#e07251',
  'brand-3': '#dcdb96',
  'brand-4': '#a6da90',
  'brand-5': '#bed164',
}

RGB Array

[204, 203, 73], [224, 114, 81], [220, 219, 150], [166, 218, 144], [190, 209, 100]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #CCCB49, #E07251, #DCDB96, #A6DA90, #BED164 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: #cccb49; --color-2: #e07251; --color-3: #dcdb96; --color-4: #a6da90; --color-5: #bed164. 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