#80BE95 + #61D1AD + #92DAAC + #C3E2AB + #ECF5EB - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#80BE95

Celadon · DarkSeaGreen · Apple Green

HEX

#80BE95

RGB

rgb(128, 190, 149)

HSL

hsl(140, 32%, 62%)

HSB

hsb(140, 33%, 75%)

CMYK

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

Oklch

oklch(74.8% 0.087 154.8)

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

#61D1AD

Mineral Blue · MediumAquaMarine · Lake Green

HEX

#61D1AD

RGB

rgb(97, 209, 173)

HSL

hsl(161, 55%, 60%)

HSB

hsb(161, 54%, 82%)

CMYK

cmyk(54%, 0%, 17%, 18%)

Oklch

oklch(78.5% 0.116 169.5)

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

#92DAAC

Celadon · LightGreen · Apple Green

HEX

#92DAAC

RGB

rgb(146, 218, 172)

HSL

hsl(142, 49%, 71%)

HSB

hsb(142, 33%, 85%)

CMYK

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

Oklch

oklch(82.8% 0.097 155.6)

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

#C3E2AB

Celadon · Silver · Apple Green

HEX

#C3E2AB

RGB

rgb(195, 226, 171)

HSL

hsl(94, 49%, 78%)

HSB

hsb(94, 24%, 89%)

CMYK

cmyk(14%, 0%, 24%, 11%)

Oklch

oklch(87.6% 0.080 131.8)

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

#ECF5EB

Celadon · Linen · Mint Green

HEX

#ECF5EB

RGB

rgb(236, 245, 235)

HSL

hsl(114, 33%, 94%)

HSB

hsb(114, 4%, 96%)

CMYK

cmyk(4%, 0%, 4%, 4%)

Oklch

oklch(96.1% 0.016 142.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

80BE95

BD7FA8

Analogous

89BD7F

80BE95

7FBDB3

Triadic

80BE95

947FBD

BD947F

Split-Comp.

80BE95

B37FBD

BD7F89

Tetradic

80BE95

7F89BD

BD7FA8

BDB37F

Contrast Matrix WCAG 2.1 Contrast

80BE95	61D1AD	92DAAC	C3E2AB	ECF5EB
—	1.2 Fail	1.3 Fail	1.5 Fail	1.9 Fail
1.2 Fail	—	1.1 Fail	1.3 Fail	1.7 Fail
1.3 Fail	1.1 Fail	—	1.2 Fail	1.5 Fail
1.5 Fail	1.3 Fail	1.2 Fail	—	1.3 Fail
1.9 Fail	1.7 Fail	1.5 Fail	1.3 Fail	—

White BG

2.2Fail

1.9Fail

1.6Fail

1.4Fail

1.1Fail

Black BG

9.7AAA

11.2AAA

12.8AAA

14.8AAA

18.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9B9B9F

9193B6

B1B2B7

D0D1B8

F0F0ED

Deuteranopia

9793A1

8B83B8

ADA8BA

CFCCBC

EFEFEE

Tritanopia

83A7A8

67BDBE

96C0C2

C5C3C5

ECEFF0

Achromatopsia

A7A7A7

ABABAB

BFBFBF

D2D2D2

F1F1F1

Shades & Tints Shades & Tints

#80BE95

Dark

Light

#61D1AD

Dark

Light

#92DAAC

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #80be95;
  --color-2: #61d1ad;
  --color-3: #92daac;
  --color-4: #c3e2ab;
  --color-5: #ecf5eb;
}

SCSS

$color-1: #80be95;
$color-2: #61d1ad;
$color-3: #92daac;
$color-4: #c3e2ab;
$color-5: #ecf5eb;

TAILWIND

colors: {
  'brand-1': '#80be95',
  'brand-2': '#61d1ad',
  'brand-3': '#92daac',
  'brand-4': '#c3e2ab',
  'brand-5': '#ecf5eb',
}

RGB Array

[128, 190, 149], [97, 209, 173], [146, 218, 172], [195, 226, 171], [236, 245, 235]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #80BE95, #61D1AD, #92DAAC, #C3E2AB, #ECF5EB 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: #80be95; --color-2: #61d1ad; --color-3: #92daac; --color-4: #c3e2ab; --color-5: #ecf5eb. 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