#A6F1D9 + #BED6A4 + #998577 + #D6D5A4 + #C4EEA3 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#A6F1D9

Jade · LightBlue · Glacier Blue

HEX

#A6F1D9

RGB

rgb(166, 241, 217)

HSL

hsl(161, 73%, 80%)

HSB

hsb(161, 31%, 95%)

CMYK

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

Oklch

oklch(90.2% 0.081 172.4)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

#BED6A4

Willow Green · Silver · Apple Green

HEX

#BED6A4

RGB

rgb(190, 214, 164)

HSL

hsl(89, 38%, 74%)

HSB

hsb(89, 23%, 84%)

CMYK

cmyk(11%, 0%, 23%, 16%)

Oklch

oklch(84.5% 0.072 128.7)

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

#998577

Tangerine · Gray · Warm Sun

HEX

#998577

RGB

rgb(153, 133, 119)

HSL

hsl(25, 14%, 53%)

HSB

hsb(25, 22%, 60%)

CMYK

cmyk(0%, 13%, 22%, 40%)

Oklch

oklch(63.1% 0.032 57.1)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#D6D5A4

Fresh Green · Wheat · Sunflower

HEX

#D6D5A4

RGB

rgb(214, 213, 164)

HSL

hsl(59, 38%, 74%)

HSB

hsb(59, 23%, 84%)

CMYK

cmyk(0%, 0%, 23%, 16%)

Oklch

oklch(86.2% 0.065 106.7)

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

#C4EEA3

Emerald · Khaki · Apple Green

HEX

#C4EEA3

RGB

rgb(196, 238, 163)

HSL

hsl(94, 69%, 79%)

HSB

hsb(94, 32%, 93%)

CMYK

cmyk(18%, 0%, 32%, 7%)

Oklch

oklch(90.1% 0.108 132.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A6F1D9

F1A7BE

Analogous

A7F1B4

A6F1D9

A7E4F1

Triadic

A6F1D9

DAA7F1

F1DAA7

Split-Comp.

A6F1D9

F1A7E4

F1B4A7

Tetradic

A6F1D9

B4A7F1

F1A7BE

E4F1A7

Contrast Matrix WCAG 2.1 Contrast

A6F1D9	BED6A4	998577	D6D5A4	C4EEA3
—	1.2 Fail	2.7 Fail	1.2 Fail	1.0 Fail
1.2 Fail	—	2.2 Fail	1.0 Fail	1.2 Fail
2.7 Fail	2.2 Fail	—	2.3 Fail	2.7 Fail
1.2 Fail	1.0 Fail	2.3 Fail	—	1.2 Fail
1.0 Fail	1.2 Fail	2.7 Fail	1.2 Fail	—

White BG

1.3Fail

1.6Fail

3.5AA Large

1.5Fail

1.3Fail

Black BG

16.2AAA

13.3AAA

6.0AA

13.9AAA

16.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C6C7DF

C8C9B0

90907A

D6D6B0

D6D7B5

Deuteranopia

C2BDE0

C7C5B3

92937B

D6D6B3

D4D1BA

Tritanopia

AAE3E4

BFBABC

987D7E

D6B9BB

C6C3C7

Achromatopsia

D8D8D8

C9C9C9

898989

D0D0D0

D9D9D9

Shades & Tints Shades & Tints

#A6F1D9

Dark

Light

#BED6A4

Dark

Light

#998577

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a6f1d9;
  --color-2: #bed6a4;
  --color-3: #998577;
  --color-4: #d6d5a4;
  --color-5: #c4eea3;
}

SCSS

$color-1: #a6f1d9;
$color-2: #bed6a4;
$color-3: #998577;
$color-4: #d6d5a4;
$color-5: #c4eea3;

TAILWIND

colors: {
  'brand-1': '#a6f1d9',
  'brand-2': '#bed6a4',
  'brand-3': '#998577',
  'brand-4': '#d6d5a4',
  'brand-5': '#c4eea3',
}

RGB Array

[166, 241, 217], [190, 214, 164], [153, 133, 119], [214, 213, 164], [196, 238, 163]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A6F1D9, #BED6A4, #998577, #D6D5A4, #C4EEA3 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: #a6f1d9; --color-2: #bed6a4; --color-3: #998577; --color-4: #d6d5a4; --color-5: #c4eea3. 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