← Back to Editor

#BFDDCF · #A2C0AD · #EEEEE9 · #C2C6BA · #DEE2D0

nature

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

CalmOrganicGroundedCool

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Brand WebsiteBlog

Color Details Color Details

#BFDDCF

Jade · LightGray · Mint Green

HEX
#BFDDCF
RGB
rgb(191, 221, 207)
HSL
hsl(152, 31%, 81%)
HSB
hsb(152, 14%, 87%)
CMYK
cmyk(14%, 0%, 6%, 13%)
Oklch
oklch(87.2% 0.037 165.7)

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

#A2C0AD

Celadon · DarkGray · Apple Green

HEX
#A2C0AD
RGB
rgb(162, 192, 173)
HSL
hsl(142, 19%, 69%)
HSB
hsb(142, 16%, 75%)
CMYK
cmyk(16%, 0%, 10%, 25%)
Oklch
oklch(78.0% 0.042 157.5)

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

#EEEEE9

Fresh Green · Linen · Lemon Cream

HEX
#EEEEE9
RGB
rgb(238, 238, 233)
HSL
hsl(60, 13%, 92%)
HSB
hsb(60, 2%, 93%)
CMYK
cmyk(0%, 0%, 2%, 7%)
Oklch
oklch(94.8% 0.007 106.5)

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

#C2C6BA

Willow Green · Silver · Apple Green

HEX
#C2C6BA
RGB
rgb(194, 198, 186)
HSL
hsl(80, 10%, 75%)
HSB
hsb(80, 6%, 78%)
CMYK
cmyk(2%, 0%, 6%, 22%)
Oklch
oklch(82.0% 0.017 121.8)

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

#DEE2D0

Willow Green · LightGray · Mint Green

HEX
#DEE2D0
RGB
rgb(222, 226, 208)
HSL
hsl(73, 24%, 85%)
HSB
hsb(73, 8%, 89%)
CMYK
cmyk(2%, 0%, 8%, 11%)
Oklch
oklch(90.5% 0.024 117.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BFDDCF
DEC0CE

Analogous

C0DEC1
BFDDCF
C0DDDE

Triadic

BFDDCF
D0C0DE
DED0C0

Split-Comp.

BFDDCF
DEC0DD
DEC1C0

Tetradic

BFDDCF
C1C0DE
DEC0CE
DDDEC0

Contrast Matrix WCAG 2.1 Contrast

BFDDCF
A2C0AD
EEEEE9
C2C6BA
DEE2D0
—
1.4
Fail
1.2
Fail
1.2
Fail
1.1
Fail
1.4
Fail
—
1.7
Fail
1.1
Fail
1.5
Fail
1.2
Fail
1.7
Fail
—
1.5
Fail
1.1
Fail
1.2
Fail
1.1
Fail
1.5
Fail
—
1.3
Fail
1.1
Fail
1.5
Fail
1.1
Fail
1.3
Fail
—
White BG
1.5Fail
2.0Fail
1.2Fail
1.7Fail
1.3Fail
Black BG
14.5AAA
10.7AAA
18.0AAA
12.1AAA
15.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CCCCD2
AFAFB2
EEEEEA
C4C4BD
E0E0D4

Deuteranopia

CAC8D3
ADABB3
EEEEEB
C4C3BE
E0DFD5

Tritanopia

C1D5D6
A4B5B6
EEEBEB
C2BFC0
DED8D9

Achromatopsia

D2D2D2
B5B5B5
EDEDED
C3C3C3
DFDFDF

Shades & Tints Shades & Tints

#BFDDCF

Dark
Light

#A2C0AD

Dark
Light

#EEEEE9

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bfddcf;
  --color-2: #a2c0ad;
  --color-3: #eeeee9;
  --color-4: #c2c6ba;
  --color-5: #dee2d0;
}

SCSS

$color-1: #bfddcf;
$color-2: #a2c0ad;
$color-3: #eeeee9;
$color-4: #c2c6ba;
$color-5: #dee2d0;

TAILWIND

colors: {
  'brand-1': '#bfddcf',
  'brand-2': '#a2c0ad',
  'brand-3': '#eeeee9',
  'brand-4': '#c2c6ba',
  'brand-5': '#dee2d0',
}

RGB Array

[191, 221, 207], [162, 192, 173], [238, 238, 233], [194, 198, 186], [222, 226, 208]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #BFDDCF, #A2C0AD, #EEEEE9, #C2C6BA, #DEE2D0 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: #bfddcf; --color-2: #a2c0ad; --color-3: #eeeee9; --color-4: #c2c6ba; --color-5: #dee2d0. 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