#CFD1C3 + #D1D4B4 + #CED49F + #CFD88C + #CADF2E - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryClean

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#CFD1C3

Fresh Green · LightGray · Lemon Cream

HEX

#CFD1C3

RGB

rgb(207, 209, 195)

HSL

hsl(69, 13%, 79%)

HSB

hsb(69, 7%, 82%)

CMYK

cmyk(1%, 0%, 7%, 18%)

Oklch

oklch(85.5% 0.019 113.4)

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

#D1D4B4

Fresh Green · Silver · Lemon Cream

HEX

#D1D4B4

RGB

rgb(209, 212, 180)

HSL

hsl(66, 27%, 77%)

HSB

hsb(66, 15%, 83%)

CMYK

cmyk(1%, 0%, 15%, 17%)

Oklch

oklch(85.9% 0.043 111.7)

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

#CED49F

Fresh Green · Tan · Sunflower

HEX

#CED49F

RGB

rgb(206, 212, 159)

HSL

hsl(67, 38%, 73%)

HSB

hsb(67, 25%, 83%)

CMYK

cmyk(3%, 0%, 25%, 17%)

Oklch

oklch(85.2% 0.070 113.2)

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

#CFD88C

Fresh Green · BurlyWood · Sunflower

HEX

#CFD88C

RGB

rgb(207, 216, 140)

HSL

hsl(67, 49%, 70%)

HSB

hsb(67, 35%, 85%)

CMYK

cmyk(4%, 0%, 35%, 15%)

Oklch

oklch(85.8% 0.098 114.0)

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

#CADF2E

Autumn Sage · GreenYellow · Sunflower

HEX

#CADF2E

RGB

rgb(202, 223, 46)

HSL

hsl(67, 73%, 53%)

HSB

hsb(67, 79%, 87%)

CMYK

cmyk(9%, 0%, 79%, 13%)

Oklch

oklch(85.9% 0.186 116.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CFD1C3

C5C2D0

Analogous

D0CCC2

CFD1C3

C7D0C2

Triadic

CFD1C3

C2CED0

D0C2CE

Split-Comp.

CFD1C3

C2C7D0

CCC2D0

Tetradic

CFD1C3

C2D0CC

C5C2D0

D0C2C7

Contrast Matrix WCAG 2.1 Contrast

CFD1C3	D1D4B4	CED49F	CFD88C	CADF2E
—	1.0 Fail	1.0 Fail	1.0 Fail	1.0 Fail
1.0 Fail	—	1.0 Fail	1.0 Fail	1.0 Fail
1.0 Fail	1.0 Fail	—	1.0 Fail	1.0 Fail
1.0 Fail	1.0 Fail	1.0 Fail	—	1.0 Fail
1.0 Fail	1.0 Fail	1.0 Fail	1.0 Fail	—

White BG

1.5Fail

1.6Fail

1.5Fail

Black BG

13.6AAA

13.8AAA

13.5AAA

13.9AAA

14.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D0D0C6

D2D2BC

D1D1AC

D3D39E

D3D359

Deuteranopia

D0D0C7

D2D2BE

D0D0AF

D2D2A3

D2D063

Tritanopia

CFC9CA

D1C2C3

CEB6B8

CFADB0

CB7B82

Achromatopsia

CFCFCF

CCCCCC

CDCDCD

C5C5C5

Shades & Tints Shades & Tints

#CFD1C3

Dark

Light

#D1D4B4

Dark

Light

#CED49F

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cfd1c3;
  --color-2: #d1d4b4;
  --color-3: #ced49f;
  --color-4: #cfd88c;
  --color-5: #cadf2e;
}

SCSS

$color-1: #cfd1c3;
$color-2: #d1d4b4;
$color-3: #ced49f;
$color-4: #cfd88c;
$color-5: #cadf2e;

TAILWIND

colors: {
  'brand-1': '#cfd1c3',
  'brand-2': '#d1d4b4',
  'brand-3': '#ced49f',
  'brand-4': '#cfd88c',
  'brand-5': '#cadf2e',
}

RGB Array

[207, 209, 195], [209, 212, 180], [206, 212, 159], [207, 216, 140], [202, 223, 46]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CFD1C3, #D1D4B4, #CED49F, #CFD88C, #CADF2E 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: #cfd1c3; --color-2: #d1d4b4; --color-3: #ced49f; --color-4: #cfd88c; --color-5: #cadf2e. 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