#CBCD6C + #D5D97C + #E3EDA8 + #D2D870 + #C8D06D - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryClean

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#CBCD6C

Fresh Green · BurlyWood · Sunflower

HEX

#CBCD6C

RGB

rgb(203, 205, 108)

HSL

hsl(61, 49%, 61%)

HSB

hsb(61, 47%, 80%)

CMYK

cmyk(1%, 0%, 47%, 20%)

Oklch

oklch(82.6% 0.121 109.8)

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

#D5D97C

Fresh Green · Khaki · Sunflower

HEX

#D5D97C

RGB

rgb(213, 217, 124)

HSL

hsl(63, 55%, 67%)

HSB

hsb(63, 43%, 85%)

CMYK

cmyk(2%, 0%, 43%, 15%)

Oklch

oklch(86.2% 0.117 110.8)

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

#E3EDA8

Fresh Green · Wheat · Lemon Cream

HEX

#E3EDA8

RGB

rgb(227, 237, 168)

HSL

hsl(69, 66%, 79%)

HSB

hsb(69, 29%, 93%)

CMYK

cmyk(4%, 0%, 29%, 7%)

Oklch

oklch(92.2% 0.089 114.9)

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

#D2D870

Fresh Green · BurlyWood · Sunflower

HEX

#D2D870

RGB

rgb(210, 216, 112)

HSL

hsl(63, 57%, 64%)

HSB

hsb(63, 48%, 85%)

CMYK

cmyk(3%, 0%, 48%, 15%)

Oklch

oklch(85.6% 0.128 111.7)

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

#C8D06D

Fresh Green · BurlyWood · Sunflower

HEX

#C8D06D

RGB

rgb(200, 208, 109)

HSL

hsl(65, 51%, 62%)

HSB

hsb(65, 48%, 82%)

CMYK

cmyk(4%, 0%, 48%, 18%)

Oklch

oklch(83.0% 0.124 112.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CBCD6C

6C6BCC

Analogous

CC9D6B

CBCD6C

9ACC6B

Triadic

CBCD6C

6BCBCC

CC6BCB

Split-Comp.

CBCD6C

6B9ACC

9D6BCC

Tetradic

CBCD6C

6BCC9D

6C6BCC

CC6B9A

Contrast Matrix WCAG 2.1 Contrast

CBCD6C	D5D97C	E3EDA8	D2D870	C8D06D
—	1.1 Fail	1.4 Fail	1.1 Fail	1.0 Fail
1.1 Fail	—	1.2 Fail	1.0 Fail	1.1 Fail
1.4 Fail	1.2 Fail	—	1.2 Fail	1.3 Fail
1.1 Fail	1.0 Fail	1.2 Fail	—	1.1 Fail
1.0 Fail	1.1 Fail	1.3 Fail	1.1 Fail	—

White BG

1.7Fail

1.5Fail

1.2Fail

1.5Fail

1.7Fail

Black BG

12.5AAA

14.0AAA

16.9AAA

13.8AAA

12.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CCCC83

D7D793

E7E7B9

D5D589

CBCC85

Deuteranopia

CCCC89

D7D698

E7E6BD

D4D48F

CBCA8B

Tritanopia

CB969A

D5A4A8

E3C6C9

D29DA1

C8989C

Achromatopsia

C1C1C1

CDCDCD

E2E2E2

CACACA

C2C2C2

Shades & Tints Shades & Tints

#CBCD6C

Dark

Light

#D5D97C

Dark

Light

#E3EDA8

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cbcd6c;
  --color-2: #d5d97c;
  --color-3: #e3eda8;
  --color-4: #d2d870;
  --color-5: #c8d06d;
}

SCSS

$color-1: #cbcd6c;
$color-2: #d5d97c;
$color-3: #e3eda8;
$color-4: #d2d870;
$color-5: #c8d06d;

TAILWIND

colors: {
  'brand-1': '#cbcd6c',
  'brand-2': '#d5d97c',
  'brand-3': '#e3eda8',
  'brand-4': '#d2d870',
  'brand-5': '#c8d06d',
}

RGB Array

[203, 205, 108], [213, 217, 124], [227, 237, 168], [210, 216, 112], [200, 208, 109]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CBCD6C, #D5D97C, #E3EDA8, #D2D870, #C8D06D 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: #cbcd6c; --color-2: #d5d97c; --color-3: #e3eda8; --color-4: #d2d870; --color-5: #c8d06d. 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 general-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