#D6DAAD + #B8DF9E + #9BDA9C + #7BD0A1 + #53C2A7 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#D6DAAD

Fresh Green · Wheat · Lemon Cream

HEX

#D6DAAD

RGB

rgb(214, 218, 173)

HSL

hsl(65, 38%, 77%)

HSB

hsb(65, 21%, 85%)

CMYK

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

Oklch

oklch(87.4% 0.060 111.8)

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

#B8DF9E

Celadon · LightGreen · Apple Green

HEX

#B8DF9E

RGB

rgb(184, 223, 158)

HSL

hsl(96, 50%, 75%)

HSB

hsb(96, 29%, 87%)

CMYK

cmyk(17%, 0%, 29%, 13%)

Oklch

oklch(86.0% 0.096 133.3)

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

#9BDA9C

Celadon · LightGreen · Apple Green

HEX

#9BDA9C

RGB

rgb(155, 218, 156)

HSL

hsl(121, 46%, 73%)

HSB

hsb(121, 29%, 85%)

CMYK

cmyk(29%, 0%, 28%, 15%)

Oklch

oklch(83.0% 0.107 144.9)

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

#7BD0A1

Celadon · MediumAquaMarine · Apple Green

HEX

#7BD0A1

RGB

rgb(123, 208, 161)

HSL

hsl(147, 47%, 65%)

HSB

hsb(147, 41%, 82%)

CMYK

cmyk(41%, 0%, 23%, 18%)

Oklch

oklch(79.1% 0.107 158.5)

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

#53C2A7

Mineral Blue · MediumAquaMarine · Lake Green

HEX

#53C2A7

RGB

rgb(83, 194, 167)

HSL

hsl(165, 48%, 54%)

HSB

hsb(165, 57%, 76%)

CMYK

cmyk(57%, 0%, 14%, 24%)

Oklch

oklch(74.2% 0.109 174.6)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D6DAAD

B2AEDB

Analogous

DBC8AE

D6DAAD

C1DBAE

Triadic

D6DAAD

AED7DB

DBAED7

Split-Comp.

D6DAAD

AEC1DB

C8AEDB

Tetradic

D6DAAD

AEDBC8

B2AEDB

DBAEC1

Contrast Matrix WCAG 2.1 Contrast

D6DAAD	B8DF9E	9BDA9C	7BD0A1	53C2A7
—	1.0 Fail	1.1 Fail	1.3 Fail	1.5 Fail
1.0 Fail	—	1.1 Fail	1.2 Fail	1.5 Fail
1.1 Fail	1.1 Fail	—	1.1 Fail	1.3 Fail
1.3 Fail	1.2 Fail	1.1 Fail	—	1.2 Fail
1.5 Fail	1.5 Fail	1.3 Fail	1.2 Fail	—

White BG

1.4Fail

1.5Fail

1.6Fail

1.8Fail

2.2Fail

Black BG

14.5AAA

14.1AAA

12.9AAA

11.4AAA

9.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D8D8B8

C9C9AE

B6B7AB

A0A1AC

8384AE

Deuteranopia

D8D7BB

C7C4B2

B3AEAF

9B95AF

7D74AF

Tritanopia

D6C0C2

BABABD

9EB7B9

7FB5B7

59B3B4

Achromatopsia

D4D4D4

CCCCCC

C0C0C0

B1B1B1

9E9E9E

Shades & Tints Shades & Tints

#D6DAAD

Dark

Light

#B8DF9E

Dark

Light

#9BDA9C

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d6daad;
  --color-2: #b8df9e;
  --color-3: #9bda9c;
  --color-4: #7bd0a1;
  --color-5: #53c2a7;
}

SCSS

$color-1: #d6daad;
$color-2: #b8df9e;
$color-3: #9bda9c;
$color-4: #7bd0a1;
$color-5: #53c2a7;

TAILWIND

colors: {
  'brand-1': '#d6daad',
  'brand-2': '#b8df9e',
  'brand-3': '#9bda9c',
  'brand-4': '#7bd0a1',
  'brand-5': '#53c2a7',
}

RGB Array

[214, 218, 173], [184, 223, 158], [155, 218, 156], [123, 208, 161], [83, 194, 167]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D6DAAD, #B8DF9E, #9BDA9C, #7BD0A1, #53C2A7 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: #d6daad; --color-2: #b8df9e; --color-3: #9bda9c; --color-4: #7bd0a1; --color-5: #53c2a7. 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