#D3D086 + #C6DA94 + #C0DDA9 + #C0E6BB + #C2ECC9 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#D3D086

Fresh Green · BurlyWood · Sunflower

HEX

#D3D086

RGB

rgb(211, 208, 134)

HSL

hsl(58, 47%, 68%)

HSB

hsb(58, 36%, 83%)

CMYK

cmyk(0%, 1%, 36%, 17%)

Oklch

oklch(84.3% 0.095 106.3)

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

#C6DA94

Willow Green · Tan · Apple Green

HEX

#C6DA94

RGB

rgb(198, 218, 148)

HSL

hsl(77, 49%, 72%)

HSB

hsb(77, 32%, 85%)

CMYK

cmyk(9%, 0%, 32%, 15%)

Oklch

oklch(85.7% 0.094 121.4)

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

#C0DDA9

Celadon · Silver · Apple Green

HEX

#C0DDA9

RGB

rgb(192, 221, 169)

HSL

hsl(93, 43%, 76%)

HSB

hsb(93, 24%, 87%)

CMYK

cmyk(13%, 0%, 24%, 13%)

Oklch

oklch(86.3% 0.076 131.6)

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

#C0E6BB

Celadon · LightGray · Mint Green

HEX

#C0E6BB

RGB

rgb(192, 230, 187)

HSL

hsl(113, 46%, 82%)

HSB

hsb(113, 19%, 90%)

CMYK

cmyk(17%, 0%, 19%, 10%)

Oklch

oklch(88.6% 0.070 141.8)

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

#C2ECC9

Emerald · LightGray · Mint Green

HEX

#C2ECC9

RGB

rgb(194, 236, 201)

HSL

hsl(130, 53%, 84%)

HSB

hsb(130, 18%, 93%)

CMYK

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

Oklch

oklch(90.4% 0.064 149.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D3D086

878AD4

Analogous

D4AB87

D3D086

B0D487

Triadic

D3D086

87D4D1

D187D4

Split-Comp.

D3D086

87B0D4

AB87D4

Tetradic

D3D086

87D4AB

878AD4

D487B0

Contrast Matrix WCAG 2.1 Contrast

D3D086	C6DA94	C0DDA9	C0E6BB	C2ECC9
—	1.1 Fail	1.1 Fail	1.2 Fail	1.2 Fail
1.1 Fail	—	1.0 Fail	1.1 Fail	1.2 Fail
1.1 Fail	1.0 Fail	—	1.1 Fail	1.1 Fail
1.2 Fail	1.1 Fail	1.1 Fail	—	1.1 Fail
1.2 Fail	1.2 Fail	1.1 Fail	1.1 Fail	—

White BG

1.6Fail

1.5Fail

1.4Fail

1.3Fail

Black BG

13.1AAA

13.9AAA

14.2AAA

15.3AAA

16.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D2D298

CFCFA5

CDCDB6

D0D1C5

D4D5D1

Deuteranopia

D2D29C

CECCA9

CBC9B9

CECBC8

D2CFD4

Tritanopia

D3A6A9

C7B2B5

C1C0C2

C2CECF

C4D8DA

Achromatopsia

C8C8C8

CCCCCC

CECECE

D6D6D6

DBDBDB

Shades & Tints Shades & Tints

#D3D086

Dark

Light

#C6DA94

Dark

Light

#C0DDA9

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d3d086;
  --color-2: #c6da94;
  --color-3: #c0dda9;
  --color-4: #c0e6bb;
  --color-5: #c2ecc9;
}

SCSS

$color-1: #d3d086;
$color-2: #c6da94;
$color-3: #c0dda9;
$color-4: #c0e6bb;
$color-5: #c2ecc9;

TAILWIND

colors: {
  'brand-1': '#d3d086',
  'brand-2': '#c6da94',
  'brand-3': '#c0dda9',
  'brand-4': '#c0e6bb',
  'brand-5': '#c2ecc9',
}

RGB Array

[211, 208, 134], [198, 218, 148], [192, 221, 169], [192, 230, 187], [194, 236, 201]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D3D086, #C6DA94, #C0DDA9, #C0E6BB, #C2ECC9 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: #d3d086; --color-2: #c6da94; --color-3: #c0dda9; --color-4: #c0e6bb; --color-5: #c2ecc9. 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