#D0D6AA + #BECC99 + #84CDA2 + #3BCCAB + #FC6761 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#D0D6AA

Fresh Green · Silver · Sunflower

HEX

#D0D6AA

RGB

rgb(208, 214, 170)

HSL

hsl(68, 35%, 75%)

HSB

hsb(68, 21%, 84%)

CMYK

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

Oklch

oklch(86.0% 0.059 114.0)

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

#BECC99

Willow Green · Tan · Apple Green

HEX

#BECC99

RGB

rgb(190, 204, 153)

HSL

hsl(76, 33%, 70%)

HSB

hsb(76, 25%, 80%)

CMYK

cmyk(7%, 0%, 25%, 20%)

Oklch

oklch(82.2% 0.070 120.4)

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

#84CDA2

Celadon · DarkSeaGreen · Apple Green

HEX

#84CDA2

RGB

rgb(132, 205, 162)

HSL

hsl(145, 42%, 66%)

HSB

hsb(145, 36%, 80%)

CMYK

cmyk(36%, 0%, 21%, 20%)

Oklch

oklch(78.8% 0.096 157.5)

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

#3BCCAB

Mineral Blue · MediumTurquoise · Lake Green

HEX

#3BCCAB

RGB

rgb(59, 204, 171)

HSL

hsl(166, 59%, 52%)

HSB

hsb(166, 71%, 80%)

CMYK

cmyk(71%, 0%, 16%, 20%)

Oklch

oklch(76.1% 0.130 173.9)

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

#FC6761

Peach Pink · Tomato · Coral Red

HEX

#FC6761

RGB

rgb(252, 103, 97)

HSL

hsl(2, 96%, 68%)

HSB

hsb(2, 62%, 99%)

CMYK

cmyk(0%, 59%, 62%, 1%)

Oklch

oklch(70.0% 0.184 25.3)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D0D6AA

AFA9D6

Analogous

D6C5A9

D0D6AA

B9D6A9

Triadic

D0D6AA

A9D0D6

D6A9D0

Split-Comp.

D0D6AA

A9B9D6

C5A9D6

Tetradic

D0D6AA

A9D6C5

AFA9D6

D6A9B9

Contrast Matrix WCAG 2.1 Contrast

D0D6AA	BECC99	84CDA2	3BCCAB	FC6761
—	1.1 Fail	1.2 Fail	1.3 Fail	1.9 Fail
1.1 Fail	—	1.1 Fail	1.2 Fail	1.7 Fail
1.2 Fail	1.1 Fail	—	1.1 Fail	1.5 Fail
1.3 Fail	1.2 Fail	1.1 Fail	—	1.4 Fail
1.9 Fail	1.7 Fail	1.5 Fail	1.4 Fail	—

White BG

1.5Fail

1.7Fail

1.9Fail

2.0Fail

2.9Fail

Black BG

13.9AAA

12.3AAA

11.2AAA

10.4AAA

7.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D3D3B5

C4C4A5

A4A4AC

7A7BB3

BBBA62

Deuteranopia

D2D2B7

C3C2A8

9F9AAF

7167B5

C4CF63

Tritanopia

D0BDBF

BFAFB1

88B5B6

42B9BB

F56464

Achromatopsia

CFCFCF

C2C2C2

B2B2B2

9D9D9D

939393

Shades & Tints Shades & Tints

#D0D6AA

Dark

Light

#BECC99

Dark

Light

#84CDA2

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d0d6aa;
  --color-2: #becc99;
  --color-3: #84cda2;
  --color-4: #3bccab;
  --color-5: #fc6761;
}

SCSS

$color-1: #d0d6aa;
$color-2: #becc99;
$color-3: #84cda2;
$color-4: #3bccab;
$color-5: #fc6761;

TAILWIND

colors: {
  'brand-1': '#d0d6aa',
  'brand-2': '#becc99',
  'brand-3': '#84cda2',
  'brand-4': '#3bccab',
  'brand-5': '#fc6761',
}

RGB Array

[208, 214, 170], [190, 204, 153], [132, 205, 162], [59, 204, 171], [252, 103, 97]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D0D6AA, #BECC99, #84CDA2, #3BCCAB, #FC6761 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: #d0d6aa; --color-2: #becc99; --color-3: #84cda2; --color-4: #3bccab; --color-5: #fc6761. 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