#8FAAA2 + #58DBB4 + #94F79D + #EDFF85 + #FFFFFF - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#8FAAA2

Jade · DarkSeaGreen · Lake Green

HEX

#8FAAA2

RGB

rgb(143, 170, 162)

HSL

hsl(162, 14%, 61%)

HSB

hsb(162, 16%, 67%)

CMYK

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

Oklch

oklch(71.5% 0.032 175.5)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

#58DBB4

Mineral Blue · MediumAquaMarine · Lake Green

HEX

#58DBB4

RGB

rgb(88, 219, 180)

HSL

hsl(162, 65%, 60%)

HSB

hsb(162, 60%, 86%)

CMYK

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

Oklch

oklch(80.8% 0.129 170.2)

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

#94F79D

Emerald · LightGreen · Apple Green

HEX

#94F79D

RGB

rgb(148, 247, 157)

HSL

hsl(125, 86%, 77%)

HSB

hsb(125, 40%, 97%)

CMYK

cmyk(40%, 0%, 36%, 3%)

Oklch

oklch(89.3% 0.154 146.2)

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

#EDFF85

Fresh Green · Khaki · Lemon Cream

HEX

#EDFF85

RGB

rgb(237, 255, 133)

HSL

hsl(69, 100%, 76%)

HSB

hsb(69, 48%, 100%)

CMYK

cmyk(7%, 0%, 48%, 0%)

Oklch

oklch(96.2% 0.148 116.2)

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

#FFFFFF

Moonlight White · White · Cloud White

HEX

#FFFFFF

RGB

rgb(255, 255, 255)

HSL

hsl(0, 0%, 100%)

HSB

hsb(0, 0%, 100%)

CMYK

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

Oklch

oklch(100.0% 0.000 89.9)

Traditional「Moonlight White」· Paint「Cloud White」· Creative Morning Mist

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8FAAA2

A98E96

Analogous

8EA993

8FAAA2

8EA4A9

Triadic

8FAAA2

A18EA9

A9A18E

Split-Comp.

8FAAA2

A98EA4

A9938E

Tetradic

8FAAA2

938EA9

A98E96

A4A98E

Contrast Matrix WCAG 2.1 Contrast

8FAAA2	58DBB4	94F79D	EDFF85	FFFFFF
—	1.4 Fail	1.9 Fail	2.3 Fail	2.5 Fail
1.4 Fail	—	1.3 Fail	1.6 Fail	1.7 Fail
1.9 Fail	1.3 Fail	—	1.2 Fail	1.3 Fail
2.3 Fail	1.6 Fail	1.2 Fail	—	1.1 Fail
2.5 Fail	1.7 Fail	1.3 Fail	1.1 Fail	—

White BG

2.5Fail

1.7Fail

1.3Fail

1.1Fail

1.0Fail

Black BG

8.4AAA

12.2AAA

16.1AAA

19.2AAA

21.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9B9BA4

9192BD

BFC0B3

F5F5A3

FFFFFF

Deuteranopia

9997A4

897FC0

B9B2B8

F4F2AA

FFFFFF

Tritanopia

90A5A6

5FC5C7

99C4C8

EEBABF

FFFFFF

Achromatopsia

A1A1A1

AFAFAF

CFCFCF

ECECEC

FFFFFF

Shades & Tints Shades & Tints

#8FAAA2

Dark

Light

#58DBB4

Dark

Light

#94F79D

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8faaa2;
  --color-2: #58dbb4;
  --color-3: #94f79d;
  --color-4: #edff85;
  --color-5: #ffffff;
}

SCSS

$color-1: #8faaa2;
$color-2: #58dbb4;
$color-3: #94f79d;
$color-4: #edff85;
$color-5: #ffffff;

TAILWIND

colors: {
  'brand-1': '#8faaa2',
  'brand-2': '#58dbb4',
  'brand-3': '#94f79d',
  'brand-4': '#edff85',
  'brand-5': '#ffffff',
}

RGB Array

[143, 170, 162], [88, 219, 180], [148, 247, 157], [237, 255, 133], [255, 255, 255]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8FAAA2, #58DBB4, #94F79D, #EDFF85, #FFFFFF 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: #8faaa2; --color-2: #58dbb4; --color-3: #94f79d; --color-4: #edff85; --color-5: #ffffff. 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