#DBED9F + #CAE0A6 + #BBD5AC + #ADCBB1 + #A1C3B5 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#DBED9F

Willow Green · Khaki · Apple Green

HEX

#DBED9F

RGB

rgb(219, 237, 159)

HSL

hsl(74, 68%, 78%)

HSB

hsb(74, 33%, 93%)

CMYK

cmyk(8%, 0%, 33%, 7%)

Oklch

oklch(91.5% 0.102 119.0)

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

#CAE0A6

Willow Green · Silver · Apple Green

HEX

#CAE0A6

RGB

rgb(202, 224, 166)

HSL

hsl(83, 48%, 76%)

HSB

hsb(83, 26%, 88%)

CMYK

cmyk(10%, 0%, 26%, 12%)

Oklch

oklch(87.6% 0.080 124.9)

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

#BBD5AC

Celadon · Silver · Apple Green

HEX

#BBD5AC

RGB

rgb(187, 213, 172)

HSL

hsl(98, 33%, 75%)

HSB

hsb(98, 19%, 84%)

CMYK

cmyk(12%, 0%, 19%, 16%)

Oklch

oklch(84.3% 0.062 134.1)

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

#ADCBB1

Celadon · Silver · Apple Green

HEX

#ADCBB1

RGB

rgb(173, 203, 177)

HSL

hsl(128, 22%, 74%)

HSB

hsb(128, 15%, 80%)

CMYK

cmyk(15%, 0%, 13%, 20%)

Oklch

oklch(81.3% 0.048 148.9)

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

#A1C3B5

Jade · DarkGray · Apple Green

HEX

#A1C3B5

RGB

rgb(161, 195, 181)

HSL

hsl(155, 22%, 70%)

HSB

hsb(155, 17%, 76%)

CMYK

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

Oklch

oklch(78.8% 0.042 168.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DBED9F

B3A1ED

Analogous

EDD9A1

DBED9F

B5EDA1

Triadic

DBED9F

A1DBED

EDA1DB

Split-Comp.

DBED9F

A1B5ED

D9A1ED

Tetradic

DBED9F

A1EDD9

B3A1ED

EDA1B5

Contrast Matrix WCAG 2.1 Contrast

DBED9F	CAE0A6	BBD5AC	ADCBB1	A1C3B5
—	1.1 Fail	1.3 Fail	1.4 Fail	1.5 Fail
1.1 Fail	—	1.1 Fail	1.2 Fail	1.3 Fail
1.3 Fail	1.1 Fail	—	1.1 Fail	1.2 Fail
1.4 Fail	1.2 Fail	1.1 Fail	—	1.1 Fail
1.5 Fail	1.3 Fail	1.2 Fail	1.1 Fail	—

White BG

1.3Fail

1.4Fail

1.6Fail

1.8Fail

1.9Fail

Black BG

16.6AAA

14.7AAA

13.2AAA

12.0AAA

11.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E3E3B2

D4D4B4

C6C6B6

BABAB7

B0B0B8

Deuteranopia

E2E0B6

D2D1B7

C5C3B8

B8B6B9

AEABB9

Tritanopia

DCC1C4

CBBFC2

BCBEBF

AFBCBD

A3BBBC

Achromatopsia

DFDFDF

D3D3D3

C9C9C9

BFBFBF

B7B7B7

Shades & Tints Shades & Tints

#DBED9F

Dark

Light

#CAE0A6

Dark

Light

#BBD5AC

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #dbed9f;
  --color-2: #cae0a6;
  --color-3: #bbd5ac;
  --color-4: #adcbb1;
  --color-5: #a1c3b5;
}

SCSS

$color-1: #dbed9f;
$color-2: #cae0a6;
$color-3: #bbd5ac;
$color-4: #adcbb1;
$color-5: #a1c3b5;

TAILWIND

colors: {
  'brand-1': '#dbed9f',
  'brand-2': '#cae0a6',
  'brand-3': '#bbd5ac',
  'brand-4': '#adcbb1',
  'brand-5': '#a1c3b5',
}

RGB Array

[219, 237, 159], [202, 224, 166], [187, 213, 172], [173, 203, 177], [161, 195, 181]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #DBED9F, #CAE0A6, #BBD5AC, #ADCBB1, #A1C3B5 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: #dbed9f; --color-2: #cae0a6; --color-3: #bbd5ac; --color-4: #adcbb1; --color-5: #a1c3b5. 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