← Back to Editor

#CBC8B9 · #C0A886 · #CF713D · #D4424F · #CA1447

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

#CBC8B9

Fresh Green · Silver · Lemon Cream

HEX
#CBC8B9
RGB
rgb(203, 200, 185)
HSL
hsl(50, 15%, 76%)
HSB
hsb(50, 9%, 80%)
CMYK
cmyk(0%, 1%, 9%, 20%)
Oklch
oklch(83.1% 0.021 97.6)

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

#C0A886

Ginger · Tan · Warm Sun

HEX
#C0A886
RGB
rgb(192, 168, 134)
HSL
hsl(35, 32%, 64%)
HSB
hsb(35, 30%, 75%)
CMYK
cmyk(0%, 13%, 30%, 25%)
Oklch
oklch(74.4% 0.054 76.3)

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

#CF713D

Tangerine · Chocolate · Warm Sun

HEX
#CF713D
RGB
rgb(207, 113, 61)
HSL
hsl(21, 60%, 53%)
HSB
hsb(21, 71%, 81%)
CMYK
cmyk(0%, 45%, 71%, 19%)
Oklch
oklch(64.6% 0.136 47.7)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#D4424F

Vermilion · Crimson · Passion Red

HEX
#D4424F
RGB
rgb(212, 66, 79)
HSL
hsl(355, 63%, 55%)
HSB
hsb(355, 69%, 83%)
CMYK
cmyk(0%, 69%, 63%, 17%)
Oklch
oklch(59.2% 0.182 19.8)

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

#CA1447

Dark Violet · Crimson · Camellia

HEX
#CA1447
RGB
rgb(202, 20, 71)
HSL
hsl(343, 82%, 44%)
HSB
hsb(343, 90%, 79%)
CMYK
cmyk(0%, 90%, 65%, 21%)
Oklch
oklch(54.0% 0.207 14.6)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CBC8B9
B9BCCB

Analogous

CBBFB9
CBC8B9
C5CBB9

Triadic

CBC8B9
B9CBC8
C8B9CB

Split-Comp.

CBC8B9
B9C5CB
BFB9CB

Tetradic

CBC8B9
B9CBBF
B9BCCB
CBB9C5

Contrast Matrix WCAG 2.1 Contrast

CBC8B9
C0A886
CF713D
D4424F
CA1447
—
1.4
Fail
2.1
Fail
2.7
Fail
3.4
AA Large
1.4
Fail
—
1.5
Fail
2.0
Fail
2.5
Fail
2.1
Fail
1.5
Fail
—
1.3
Fail
1.6
Fail
2.7
Fail
2.0
Fail
1.3
Fail
—
1.3
Fail
3.4
AA Large
2.5
Fail
1.6
Fail
1.3
Fail
—
White BG
1.7Fail
2.3Fail
3.5AA Large
4.5AA Large
5.7AA
Black BG
12.5AAA
9.2AAA
6.1AA
4.7AA
3.7AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

CACABD
B6B58E
A6A54A
95934C
7B7A3B

Deuteranopia

CACABE
B7B990
ACB34D
9DA84B
869338

Tritanopia

CBBFC0
BF9596
CA5456
CD4949
C1312F

Achromatopsia

C7C7C7
ABABAB
878787
6F6F6F
505050

Shades & Tints Shades & Tints

#CBC8B9

Dark
Light

#C0A886

Dark
Light

#CF713D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cbc8b9;
  --color-2: #c0a886;
  --color-3: #cf713d;
  --color-4: #d4424f;
  --color-5: #ca1447;
}

SCSS

$color-1: #cbc8b9;
$color-2: #c0a886;
$color-3: #cf713d;
$color-4: #d4424f;
$color-5: #ca1447;

TAILWIND

colors: {
  'brand-1': '#cbc8b9',
  'brand-2': '#c0a886',
  'brand-3': '#cf713d',
  'brand-4': '#d4424f',
  'brand-5': '#ca1447',
}

RGB Array

[203, 200, 185], [192, 168, 134], [207, 113, 61], [212, 66, 79], [202, 20, 71]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #CBC8B9, #C0A886, #CF713D, #D4424F, #CA1447 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: #cbc8b9; --color-2: #c0a886; --color-3: #cf713d; --color-4: #d4424f; --color-5: #ca1447. 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