#C5DBCA + #CFE7D8 + #E8ECD9 + #DBD3A3 + #B3B68F - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#C5DBCA

Celadon · LightGray · Mint Green

HEX

#C5DBCA

RGB

rgb(197, 219, 202)

HSL

hsl(134, 23%, 82%)

HSB

hsb(134, 10%, 86%)

CMYK

cmyk(10%, 0%, 8%, 14%)

Oklch

oklch(87.0% 0.033 152.4)

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

#CFE7D8

Celadon · LightGray · Mint Green

HEX

#CFE7D8

RGB

rgb(207, 231, 216)

HSL

hsl(143, 33%, 86%)

HSB

hsb(143, 10%, 91%)

CMYK

cmyk(10%, 0%, 6%, 9%)

Oklch

oklch(90.6% 0.032 158.3)

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

#E8ECD9

Willow Green · Beige · Mint Green

HEX

#E8ECD9

RGB

rgb(232, 236, 217)

HSL

hsl(73, 33%, 89%)

HSB

hsb(73, 8%, 93%)

CMYK

cmyk(2%, 0%, 8%, 7%)

Oklch

oklch(93.5% 0.026 116.6)

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

#DBD3A3

Fresh Green · Wheat · Sunflower

HEX

#DBD3A3

RGB

rgb(219, 211, 163)

HSL

hsl(51, 44%, 75%)

HSB

hsb(51, 26%, 86%)

CMYK

cmyk(0%, 4%, 26%, 14%)

Oklch

oklch(86.1% 0.064 99.7)

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

#B3B68F

Fresh Green · DarkGray · Sunflower

HEX

#B3B68F

RGB

rgb(179, 182, 143)

HSL

hsl(65, 21%, 64%)

HSB

hsb(65, 21%, 71%)

CMYK

cmyk(2%, 0%, 21%, 29%)

Oklch

oklch(76.4% 0.053 111.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C5DBCA

DCC7D7

Analogous

CCDCC7

C5DBCA

C7DCD6

Triadic

C5DBCA

CBC7DC

DCCBC7

Split-Comp.

C5DBCA

D6C7DC

DCC7CC

Tetradic

C5DBCA

C7CCDC

DCC7D7

DCD6C7

Contrast Matrix WCAG 2.1 Contrast

C5DBCA	CFE7D8	E8ECD9	DBD3A3	B3B68F
—	1.1 Fail	1.2 Fail	1.0 Fail	1.4 Fail
1.1 Fail	—	1.1 Fail	1.2 Fail	1.6 Fail
1.2 Fail	1.1 Fail	—	1.3 Fail	1.7 Fail
1.0 Fail	1.2 Fail	1.3 Fail	—	1.4 Fail
1.4 Fail	1.6 Fail	1.7 Fail	1.4 Fail	—

White BG

1.5Fail

1.3Fail

1.2Fail

1.5Fail

2.1Fail

Black BG

14.4AAA

16.1AAA

17.4AAA

13.9AAA

10.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CFCFCE

D9DADC

EAEADE

D8D7AF

B4B498

Deuteranopia

CDCCCF

D8D6DD

EAE9DF

D8D9B1

B4B49B

Tritanopia

C6D1D2

D0DEDF

E8E1E2

DBB8BA

B3A0A2

Achromatopsia

D2D2D2

DEDEDE

E9E9E9

D0D0D0

B1B1B1

Shades & Tints Shades & Tints

#C5DBCA

Dark

Light

#CFE7D8

Dark

Light

#E8ECD9

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c5dbca;
  --color-2: #cfe7d8;
  --color-3: #e8ecd9;
  --color-4: #dbd3a3;
  --color-5: #b3b68f;
}

SCSS

$color-1: #c5dbca;
$color-2: #cfe7d8;
$color-3: #e8ecd9;
$color-4: #dbd3a3;
$color-5: #b3b68f;

TAILWIND

colors: {
  'brand-1': '#c5dbca',
  'brand-2': '#cfe7d8',
  'brand-3': '#e8ecd9',
  'brand-4': '#dbd3a3',
  'brand-5': '#b3b68f',
}

RGB Array

[197, 219, 202], [207, 231, 216], [232, 236, 217], [219, 211, 163], [179, 182, 143]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C5DBCA, #CFE7D8, #E8ECD9, #DBD3A3, #B3B68F 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: #c5dbca; --color-2: #cfe7d8; --color-3: #e8ecd9; --color-4: #dbd3a3; --color-5: #b3b68f. 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