← Back to Editor

#CBBE8F · #8E878E · #D5BDA8 · #C8CDAB · #B2D3B2

nature

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

CalmOrganicGroundedWarm

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Brand WebsiteBlog

Color Details Color Details

#CBBE8F

Ginger · Tan · Sunflower

HEX
#CBBE8F
RGB
rgb(203, 190, 143)
HSL
hsl(47, 37%, 68%)
HSB
hsb(47, 30%, 80%)
CMYK
cmyk(0%, 6%, 30%, 20%)
Oklch
oklch(80.1% 0.064 94.5)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#8E878E

Ash · Gray · Warm Gray

HEX
#8E878E
RGB
rgb(142, 135, 142)
HSL
hsl(300, 3%, 54%)
HSB
hsb(300, 5%, 56%)
CMYK
cmyk(0%, 5%, 0%, 44%)
Oklch
oklch(63.2% 0.013 325.7)

Traditional「Ash」· Paint「Warm Gray」· Creative Urban Concrete

#D5BDA8

Apricot · Tan · Warm Sun

HEX
#D5BDA8
RGB
rgb(213, 189, 168)
HSL
hsl(28, 35%, 75%)
HSB
hsb(28, 21%, 84%)
CMYK
cmyk(0%, 11%, 21%, 16%)
Oklch
oklch(81.3% 0.040 63.4)

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

#C8CDAB

Fresh Green · Silver · Sunflower

HEX
#C8CDAB
RGB
rgb(200, 205, 171)
HSL
hsl(69, 25%, 74%)
HSB
hsb(69, 17%, 80%)
CMYK
cmyk(2%, 0%, 17%, 20%)
Oklch
oklch(83.5% 0.046 114.2)

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

#B2D3B2

Celadon · Silver · Apple Green

HEX
#B2D3B2
RGB
rgb(178, 211, 178)
HSL
hsl(120, 27%, 76%)
HSB
hsb(120, 16%, 83%)
CMYK
cmyk(16%, 0%, 16%, 17%)
Oklch
oklch(83.4% 0.057 145.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CBBE8F
8F9CCC

Analogous

CCA08F
CBBE8F
BACC8F

Triadic

CBBE8F
8FCCBF
BF8FCC

Split-Comp.

CBBE8F
8FBACC
A08FCC

Tetradic

CBBE8F
8FCCA0
8F9CCC
CC8FBA

Contrast Matrix WCAG 2.1 Contrast

CBBE8F
8E878E
D5BDA8
C8CDAB
B2D3B2
—
1.9
Fail
1.0
Fail
1.1
Fail
1.1
Fail
1.9
Fail
—
1.9
Fail
2.1
Fail
2.1
Fail
1.0
Fail
1.9
Fail
—
1.1
Fail
1.1
Fail
1.1
Fail
2.1
Fail
1.1
Fail
—
1.0
Fail
1.1
Fail
2.1
Fail
1.1
Fail
1.0
Fail
—
White BG
1.9Fail
3.5AA Large
1.8Fail
1.6Fail
1.6Fail
Black BG
11.3AAA
6.0AA
11.7AAA
12.8AAA
12.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C5C59A
8B8B8C
CBCAAD
CACAB3
C0C1BA

Deuteranopia

C6C79D
8B8C8C
CCCEAE
CACAB5
BEBCBC

Tritanopia

CAA3A5
8E8B8B
D4B1B2
C8BABB
B4C0C2

Achromatopsia

BDBDBD
8A8A8A
C2C2C2
C8C8C8
C5C5C5

Shades & Tints Shades & Tints

#CBBE8F

Dark
Light

#8E878E

Dark
Light

#D5BDA8

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cbbe8f;
  --color-2: #8e878e;
  --color-3: #d5bda8;
  --color-4: #c8cdab;
  --color-5: #b2d3b2;
}

SCSS

$color-1: #cbbe8f;
$color-2: #8e878e;
$color-3: #d5bda8;
$color-4: #c8cdab;
$color-5: #b2d3b2;

TAILWIND

colors: {
  'brand-1': '#cbbe8f',
  'brand-2': '#8e878e',
  'brand-3': '#d5bda8',
  'brand-4': '#c8cdab',
  'brand-5': '#b2d3b2',
}

RGB Array

[203, 190, 143], [142, 135, 142], [213, 189, 168], [200, 205, 171], [178, 211, 178]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #CBBE8F, #8E878E, #D5BDA8, #C8CDAB, #B2D3B2 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: #cbbe8f; --color-2: #8e878e; --color-3: #d5bda8; --color-4: #c8cdab; --color-5: #b2d3b2. 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 nature-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