#DCF9BC + #BDEDB3 + #A3D8B6 + #91BFB9 + #85A7B0 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#DCF9BC

Willow Green · Wheat · Mint Green

HEX

#DCF9BC

RGB

rgb(220, 249, 188)

HSL

hsl(89, 84%, 86%)

HSB

hsb(89, 24%, 98%)

CMYK

cmyk(12%, 0%, 24%, 2%)

Oklch

oklch(94.6% 0.085 128.6)

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

#BDEDB3

Emerald · LightGray · Mint Green

HEX

#BDEDB3

RGB

rgb(189, 237, 179)

HSL

hsl(110, 62%, 82%)

HSB

hsb(110, 24%, 93%)

CMYK

cmyk(20%, 0%, 24%, 7%)

Oklch

oklch(89.8% 0.092 140.2)

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

#A3D8B6

Celadon · Silver · Apple Green

HEX

#A3D8B6

RGB

rgb(163, 216, 182)

HSL

hsl(142, 40%, 74%)

HSB

hsb(142, 25%, 85%)

CMYK

cmyk(25%, 0%, 16%, 15%)

Oklch

oklch(83.6% 0.073 156.3)

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

#91BFB9

Jade · DarkGray · Lake Green

HEX

#91BFB9

RGB

rgb(145, 191, 185)

HSL

hsl(172, 26%, 66%)

HSB

hsb(172, 24%, 75%)

CMYK

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

Oklch

oklch(77.0% 0.049 186.3)

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

#85A7B0

Sky Blue · DarkGray · Lake Green

HEX

#85A7B0

RGB

rgb(133, 167, 176)

HSL

hsl(193, 21%, 61%)

HSB

hsb(193, 24%, 69%)

CMYK

cmyk(24%, 5%, 0%, 31%)

Oklch

oklch(70.6% 0.039 215.7)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DCF9BC

DABDF9

Analogous

F9F8BD

DCF9BC

BEF9BD

Triadic

DCF9BC

BDDCF9

F9BDDC

Split-Comp.

DCF9BC

BDBEF9

F8BDF9

Tetradic

DCF9BC

BDF9F8

DABDF9

F9BDBE

Contrast Matrix WCAG 2.1 Contrast

DCF9BC	BDEDB3	A3D8B6	91BFB9	85A7B0
—	1.2 Fail	1.4 Fail	1.8 Fail	2.2 Fail
1.2 Fail	—	1.2 Fail	1.5 Fail	2.0 Fail
1.4 Fail	1.2 Fail	—	1.3 Fail	1.6 Fail
1.8 Fail	1.5 Fail	1.3 Fail	—	1.3 Fail
2.2 Fail	2.0 Fail	1.6 Fail	1.3 Fail	—

White BG

1.1Fail

1.3Fail

1.6Fail

2.0Fail

2.6Fail

Black BG

18.3AAA

15.9AAA

13.1AAA

10.4AAA

8.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E9E9CB

D2D2C1

BABABE

A5A5BA

9494AE

Deuteranopia

E7E5CE

CFCBC4

B7B3C0

A29FBB

928FAD

Tritanopia

DDD6D9

BFCCCF

A6C5C6

93BCBC

87ACAC

Achromatopsia

E9E9E9

D8D8D8

C4C4C4

B1B1B1

9E9E9E

Shades & Tints Shades & Tints

#DCF9BC

Dark

Light

#BDEDB3

Dark

Light

#A3D8B6

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #dcf9bc;
  --color-2: #bdedb3;
  --color-3: #a3d8b6;
  --color-4: #91bfb9;
  --color-5: #85a7b0;
}

SCSS

$color-1: #dcf9bc;
$color-2: #bdedb3;
$color-3: #a3d8b6;
$color-4: #91bfb9;
$color-5: #85a7b0;

TAILWIND

colors: {
  'brand-1': '#dcf9bc',
  'brand-2': '#bdedb3',
  'brand-3': '#a3d8b6',
  'brand-4': '#91bfb9',
  'brand-5': '#85a7b0',
}

RGB Array

[220, 249, 188], [189, 237, 179], [163, 216, 182], [145, 191, 185], [133, 167, 176]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #DCF9BC, #BDEDB3, #A3D8B6, #91BFB9, #85A7B0 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: #dcf9bc; --color-2: #bdedb3; --color-3: #a3d8b6; --color-4: #91bfb9; --color-5: #85a7b0. 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