← Back to Editor

#C9CCB1 · #DFD5BA · #9BC8AB · #9EBEA6 · #8FB4A2

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#C9CCB1

Fresh Green · Silver · Sunflower

HEX
#C9CCB1
RGB
rgb(201, 204, 177)
HSL
hsl(67, 21%, 75%)
HSB
hsb(67, 13%, 80%)
CMYK
cmyk(1%, 0%, 13%, 20%)
Oklch
oklch(83.6% 0.037 112.3)

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

#DFD5BA

Goose Yellow · Wheat · Lemon Cream

HEX
#DFD5BA
RGB
rgb(223, 213, 186)
HSL
hsl(44, 37%, 80%)
HSB
hsb(44, 17%, 87%)
CMYK
cmyk(0%, 4%, 17%, 13%)
Oklch
oklch(87.4% 0.038 90.1)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#9BC8AB

Celadon · DarkSeaGreen · Apple Green

HEX
#9BC8AB
RGB
rgb(155, 200, 171)
HSL
hsl(141, 29%, 70%)
HSB
hsb(141, 23%, 78%)
CMYK
cmyk(23%, 0%, 15%, 22%)
Oklch
oklch(79.3% 0.063 156.4)

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

#9EBEA6

Celadon · DarkGray · Apple Green

HEX
#9EBEA6
RGB
rgb(158, 190, 166)
HSL
hsl(135, 20%, 68%)
HSB
hsb(135, 17%, 75%)
CMYK
cmyk(17%, 0%, 13%, 25%)
Oklch
oklch(77.1% 0.048 152.8)

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

#8FB4A2

Jade · DarkSeaGreen · Apple Green

HEX
#8FB4A2
RGB
rgb(143, 180, 162)
HSL
hsl(151, 20%, 63%)
HSB
hsb(151, 21%, 71%)
CMYK
cmyk(21%, 0%, 10%, 29%)
Oklch
oklch(73.7% 0.048 164.0)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C9CCB1
B5B2CD

Analogous

CDC2B2
C9CCB1
BCCDB2

Triadic

C9CCB1
B2CACD
CDB2CA

Split-Comp.

C9CCB1
B2BCCD
C2B2CD

Tetradic

C9CCB1
B2CDC2
B5B2CD
CDB2BC

Contrast Matrix WCAG 2.1 Contrast

C9CCB1
DFD5BA
9BC8AB
9EBEA6
8FB4A2
—
1.1
Fail
1.1
Fail
1.2
Fail
1.4
Fail
1.1
Fail
—
1.3
Fail
1.4
Fail
1.6
Fail
1.1
Fail
1.3
Fail
—
1.1
Fail
1.2
Fail
1.2
Fail
1.4
Fail
1.1
Fail
—
1.1
Fail
1.4
Fail
1.6
Fail
1.2
Fail
1.1
Fail
—
White BG
1.6Fail
1.5Fail
1.9Fail
2.0Fail
2.3Fail
Black BG
12.8AAA
14.4AAA
11.2AAA
10.4AAA
9.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CACAB8
DBDBC1
AEAFB2
ACACAC
9F9FA6

Deuteranopia

CACAB9
DBDCC2
ACA9B4
AAA8AD
9D9AA7

Tritanopia

C9BDBE
DFC6C7
9DB8B9
A0B0B1
91AAAB

Achromatopsia

C8C8C8
D5D5D5
B7B7B7
B2B2B2
A7A7A7

Shades & Tints Shades & Tints

#C9CCB1

Dark
Light

#DFD5BA

Dark
Light

#9BC8AB

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c9ccb1;
  --color-2: #dfd5ba;
  --color-3: #9bc8ab;
  --color-4: #9ebea6;
  --color-5: #8fb4a2;
}

SCSS

$color-1: #c9ccb1;
$color-2: #dfd5ba;
$color-3: #9bc8ab;
$color-4: #9ebea6;
$color-5: #8fb4a2;

TAILWIND

colors: {
  'brand-1': '#c9ccb1',
  'brand-2': '#dfd5ba',
  'brand-3': '#9bc8ab',
  'brand-4': '#9ebea6',
  'brand-5': '#8fb4a2',
}

RGB Array

[201, 204, 177], [223, 213, 186], [155, 200, 171], [158, 190, 166], [143, 180, 162]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C9CCB1, #DFD5BA, #9BC8AB, #9EBEA6, #8FB4A2 is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #c9ccb1; --color-2: #dfd5ba; --color-3: #9bc8ab; --color-4: #9ebea6; --color-5: #8fb4a2. 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 beauty, lifestyle, arts industries. Restrained colors convey professionalism and trust. 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