#A9D4C0 + #A8CEA9 + #D3CF76 + #BEC28F + #BBC5A0 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#A9D4C0

Jade · Silver · Apple Green

HEX

#A9D4C0

RGB

rgb(169, 212, 192)

HSL

hsl(152, 33%, 75%)

HSB

hsb(152, 20%, 83%)

CMYK

cmyk(20%, 0%, 9%, 17%)

Oklch

oklch(83.4% 0.053 165.1)

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

#A8CEA9

Celadon · Silver · Apple Green

HEX

#A8CEA9

RGB

rgb(168, 206, 169)

HSL

hsl(122, 28%, 73%)

HSB

hsb(122, 18%, 81%)

CMYK

cmyk(18%, 0%, 18%, 19%)

Oklch

oklch(81.4% 0.065 145.6)

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

#D3CF76

Fresh Green · BurlyWood · Sunflower

HEX

#D3CF76

RGB

rgb(211, 207, 118)

HSL

hsl(57, 51%, 65%)

HSB

hsb(57, 44%, 83%)

CMYK

cmyk(0%, 2%, 44%, 17%)

Oklch

oklch(83.9% 0.112 106.3)

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

#BEC28F

Fresh Green · Tan · Sunflower

HEX

#BEC28F

RGB

rgb(190, 194, 143)

HSL

hsl(65, 29%, 66%)

HSB

hsb(65, 26%, 76%)

CMYK

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

Oklch

oklch(79.8% 0.068 111.6)

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

#BBC5A0

Willow Green · Silver · Apple Green

HEX

#BBC5A0

RGB

rgb(187, 197, 160)

HSL

hsl(76, 24%, 70%)

HSB

hsb(76, 19%, 77%)

CMYK

cmyk(5%, 0%, 19%, 23%)

Oklch

oklch(80.6% 0.052 119.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A9D4C0

D4AABE

Analogous

AAD4AC

A9D4C0

AAD3D4

Triadic

A9D4C0

C1AAD4

D4C1AA

Split-Comp.

A9D4C0

D4AAD3

D4ACAA

Tetradic

A9D4C0

ACAAD4

D4AABE

D3D4AA

Contrast Matrix WCAG 2.1 Contrast

A9D4C0	A8CEA9	D3CF76	BEC28F	BBC5A0
—	1.1 Fail	1.0 Fail	1.1 Fail	1.1 Fail
1.1 Fail	—	1.1 Fail	1.1 Fail	1.0 Fail
1.0 Fail	1.1 Fail	—	1.1 Fail	1.1 Fail
1.1 Fail	1.1 Fail	1.1 Fail	—	1.0 Fail
1.1 Fail	1.0 Fail	1.1 Fail	1.0 Fail	—

White BG

1.6Fail

1.7Fail

1.6Fail

1.9Fail

1.8Fail

Black BG

12.9AAA

12.1AAA

13.0AAA

11.3AAA

11.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

BCBCC5

B8B9B2

D1D18C

C0C09B

BFBFA9

Deuteranopia

B9B6C6

B6B3B4

D2D291

C0BF9E

BFBEAB

Tritanopia

ABC9CA

AAB9BB

D39DA0

BEA5A7

BCB0B2

Achromatopsia

C5C5C5

BEBEBE

C6C6C6

BBBBBB

BEBEBE

Shades & Tints Shades & Tints

#A9D4C0

Dark

Light

#A8CEA9

Dark

Light

#D3CF76

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a9d4c0;
  --color-2: #a8cea9;
  --color-3: #d3cf76;
  --color-4: #bec28f;
  --color-5: #bbc5a0;
}

SCSS

$color-1: #a9d4c0;
$color-2: #a8cea9;
$color-3: #d3cf76;
$color-4: #bec28f;
$color-5: #bbc5a0;

TAILWIND

colors: {
  'brand-1': '#a9d4c0',
  'brand-2': '#a8cea9',
  'brand-3': '#d3cf76',
  'brand-4': '#bec28f',
  'brand-5': '#bbc5a0',
}

RGB Array

[169, 212, 192], [168, 206, 169], [211, 207, 118], [190, 194, 143], [187, 197, 160]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A9D4C0, #A8CEA9, #D3CF76, #BEC28F, #BBC5A0 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: #a9d4c0; --color-2: #a8cea9; --color-3: #d3cf76; --color-4: #bec28f; --color-5: #bbc5a0. 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