← Back to Editor

#C0BB9B · #CBC289 · #D0BF63 · #CEA35F · #C68E73

spring

A 5-color spring palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#C0BB9B

Fresh Green · Tan · Sunflower

HEX
#C0BB9B
RGB
rgb(192, 187, 155)
HSL
hsl(52, 23%, 68%)
HSB
hsb(52, 19%, 75%)
CMYK
cmyk(0%, 3%, 19%, 25%)
Oklch
oklch(78.8% 0.044 100.0)

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

#CBC289

Fresh Green · Tan · Sunflower

HEX
#CBC289
RGB
rgb(203, 194, 137)
HSL
hsl(52, 39%, 67%)
HSB
hsb(52, 33%, 80%)
CMYK
cmyk(0%, 4%, 33%, 20%)
Oklch
oklch(80.8% 0.076 100.3)

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

#D0BF63

Autumn Sage · BurlyWood · Sunflower

HEX
#D0BF63
RGB
rgb(208, 191, 99)
HSL
hsl(51, 54%, 60%)
HSB
hsb(51, 52%, 82%)
CMYK
cmyk(0%, 8%, 52%, 18%)
Oklch
oklch(80.0% 0.115 99.0)

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

#CEA35F

Ginger · SandyBrown · Warm Sun

HEX
#CEA35F
RGB
rgb(206, 163, 95)
HSL
hsl(37, 53%, 59%)
HSB
hsb(37, 54%, 81%)
CMYK
cmyk(0%, 21%, 54%, 19%)
Oklch
oklch(74.1% 0.100 77.7)

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

#C68E73

Apricot · DarkSalmon · Warm Sun

HEX
#C68E73
RGB
rgb(198, 142, 115)
HSL
hsl(20, 42%, 61%)
HSB
hsb(20, 42%, 78%)
CMYK
cmyk(0%, 28%, 42%, 22%)
Oklch
oklch(69.5% 0.078 46.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C0BB9B
9BA0C0

Analogous

C0A89B
C0BB9B
B2C09B

Triadic

C0BB9B
9BC0BB
BB9BC0

Split-Comp.

C0BB9B
9BB2C0
A89BC0

Tetradic

C0BB9B
9BC0A8
9BA0C0
C09BB2

Contrast Matrix WCAG 2.1 Contrast

C0BB9B
CBC289
D0BF63
CEA35F
C68E73
—
1.1
Fail
1.0
Fail
1.2
Fail
1.4
Fail
1.1
Fail
—
1.0
Fail
1.3
Fail
1.5
Fail
1.0
Fail
1.0
Fail
—
1.3
Fail
1.5
Fail
1.2
Fail
1.3
Fail
1.3
Fail
—
1.2
Fail
1.4
Fail
1.5
Fail
1.5
Fail
1.2
Fail
—
White BG
1.9Fail
1.8Fail
1.9Fail
2.3Fail
2.8Fail
Black BG
10.8AAA
11.6AAA
11.3AAA
9.0AAA
7.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

BEBEA3
C7C797
C9C879
BBBB6F
AEAD7A

Deuteranopia

BEBEA5
C8C89A
CACB7F
BEC173
B1B57B

Tritanopia

C0A9AA
CBA2A4
CF8B8F
CC7C7F
C37F80

Achromatopsia

B9B9B9
BEBEBE
BABABA
A8A8A8
9C9C9C

Shades & Tints Shades & Tints

#C0BB9B

Dark
Light

#CBC289

Dark
Light

#D0BF63

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c0bb9b;
  --color-2: #cbc289;
  --color-3: #d0bf63;
  --color-4: #cea35f;
  --color-5: #c68e73;
}

SCSS

$color-1: #c0bb9b;
$color-2: #cbc289;
$color-3: #d0bf63;
$color-4: #cea35f;
$color-5: #c68e73;

TAILWIND

colors: {
  'brand-1': '#c0bb9b',
  'brand-2': '#cbc289',
  'brand-3': '#d0bf63',
  'brand-4': '#cea35f',
  'brand-5': '#c68e73',
}

RGB Array

[192, 187, 155], [203, 194, 137], [208, 191, 99], [206, 163, 95], [198, 142, 115]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This spring-style palette of #C0BB9B, #CBC289, #D0BF63, #CEA35F, #C68E73 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: #c0bb9b; --color-2: #cbc289; --color-3: #d0bf63; --color-4: #cea35f; --color-5: #c68e73. 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 spring-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