#84AA9B + #D7B7AA + #DBD0B4 + #CAD5B7 + #C6E0BB - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#84AA9B

Mineral Blue · DarkSeaGreen · Olive Green

HEX

#84AA9B

RGB

rgb(132, 170, 155)

HSL

hsl(156, 18%, 59%)

HSB

hsb(156, 22%, 67%)

CMYK

cmyk(22%, 0%, 9%, 33%)

Oklch

oklch(70.6% 0.047 168.9)

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

#D7B7AA

Apricot · Tan · Warm Sun

HEX

#D7B7AA

RGB

rgb(215, 183, 170)

HSL

hsl(17, 36%, 75%)

HSB

hsb(17, 21%, 84%)

CMYK

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

Oklch

oklch(80.4% 0.041 43.3)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#DBD0B4

Goose Yellow · Wheat · Lemon Cream

HEX

#DBD0B4

RGB

rgb(219, 208, 180)

HSL

hsl(43, 35%, 78%)

HSB

hsb(43, 18%, 86%)

CMYK

cmyk(0%, 5%, 18%, 14%)

Oklch

oklch(85.9% 0.039 89.1)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#CAD5B7

Willow Green · Silver · Apple Green

HEX

#CAD5B7

RGB

rgb(202, 213, 183)

HSL

hsl(82, 26%, 78%)

HSB

hsb(82, 14%, 84%)

CMYK

cmyk(5%, 0%, 14%, 16%)

Oklch

oklch(85.7% 0.042 123.7)

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

#C6E0BB

Celadon · LightGray · Mint Green

HEX

#C6E0BB

RGB

rgb(198, 224, 187)

HSL

hsl(102, 37%, 81%)

HSB

hsb(102, 17%, 88%)

CMYK

cmyk(12%, 0%, 17%, 12%)

Oklch

oklch(87.8% 0.057 136.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

84AA9B

A98493

Analogous

84A987

84AA9B

84A6A9

Triadic

84AA9B

9A84A9

A99A84

Split-Comp.

84AA9B

A984A6

A98784

Tetradic

84AA9B

8784A9

A98493

A6A984

Contrast Matrix WCAG 2.1 Contrast

84AA9B	D7B7AA	DBD0B4	CAD5B7	C6E0BB
—	1.4 Fail	1.7 Fail	1.7 Fail	1.8 Fail
1.4 Fail	—	1.2 Fail	1.2 Fail	1.3 Fail
1.7 Fail	1.2 Fail	—	1.0 Fail	1.1 Fail
1.7 Fail	1.2 Fail	1.0 Fail	—	1.1 Fail
1.8 Fail	1.3 Fail	1.1 Fail	1.1 Fail	—

White BG

2.6Fail

1.9Fail

1.5Fail

1.4Fail

Black BG

8.2AAA

11.2AAA

13.7AAA

14.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

94959F

C9C9AD

D6D6BB

CFCFBE

D1D1C4

Deuteranopia

928FA0

CBCDAE

D7D8BC

CECDC0

D0CEC6

Tritanopia

86A1A2

D5B0B0

DAC0C1

CBC4C5

C7CBCD

Achromatopsia

9D9D9D

BFBFBF

D0D0D0

CECECE

D4D4D4

Shades & Tints Shades & Tints

#84AA9B

Dark

Light

#D7B7AA

Dark

Light

#DBD0B4

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #84aa9b;
  --color-2: #d7b7aa;
  --color-3: #dbd0b4;
  --color-4: #cad5b7;
  --color-5: #c6e0bb;
}

SCSS

$color-1: #84aa9b;
$color-2: #d7b7aa;
$color-3: #dbd0b4;
$color-4: #cad5b7;
$color-5: #c6e0bb;

TAILWIND

colors: {
  'brand-1': '#84aa9b',
  'brand-2': '#d7b7aa',
  'brand-3': '#dbd0b4',
  'brand-4': '#cad5b7',
  'brand-5': '#c6e0bb',
}

RGB Array

[132, 170, 155], [215, 183, 170], [219, 208, 180], [202, 213, 183], [198, 224, 187]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #84AA9B, #D7B7AA, #DBD0B4, #CAD5B7, #C6E0BB 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: #84aa9b; --color-2: #d7b7aa; --color-3: #dbd0b4; --color-4: #cad5b7; --color-5: #c6e0bb. 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