← Back to Editor

#60D6A4 · #88E2A5 · #B2F2A4 · #D1F1A5 · #4B6870

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#60D6A4

Jade · MediumAquaMarine · Apple Green

HEX
#60D6A4
RGB
rgb(96, 214, 164)
HSL
hsl(155, 59%, 61%)
HSB
hsb(155, 55%, 84%)
CMYK
cmyk(55%, 0%, 23%, 16%)
Oklch
oklch(79.5% 0.130 163.1)

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

#88E2A5

Emerald · LightGreen · Apple Green

HEX
#88E2A5
RGB
rgb(136, 226, 165)
HSL
hsl(139, 61%, 71%)
HSB
hsb(139, 40%, 89%)
CMYK
cmyk(40%, 0%, 27%, 11%)
Oklch
oklch(84.0% 0.122 153.4)

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

#B2F2A4

Emerald · LightGreen · Apple Green

HEX
#B2F2A4
RGB
rgb(178, 242, 164)
HSL
hsl(109, 75%, 80%)
HSB
hsb(109, 32%, 95%)
CMYK
cmyk(26%, 0%, 32%, 5%)
Oklch
oklch(89.9% 0.122 140.0)

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

#D1F1A5

Willow Green · Khaki · Apple Green

HEX
#D1F1A5
RGB
rgb(209, 241, 165)
HSL
hsl(85, 73%, 80%)
HSB
hsb(85, 32%, 95%)
CMYK
cmyk(13%, 0%, 32%, 5%)
Oklch
oklch(91.7% 0.104 126.9)

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

#4B6870

Slate Blue · DimGray · Mint Ice

HEX
#4B6870
RGB
rgb(75, 104, 112)
HSL
hsl(193, 20%, 37%)
HSB
hsb(193, 33%, 44%)
CMYK
cmyk(33%, 7%, 0%, 56%)
Oklch
oklch(49.8% 0.036 216.7)

Traditional「Slate Blue」· Paint「Mint Ice」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

60D6A4
D66192

Analogous

61D66B
60D6A4
61CCD6

Triadic

60D6A4
A561D6
D6A561

Split-Comp.

60D6A4
D661CC
D66B61

Tetradic

60D6A4
6B61D6
D66192
CCD661

Contrast Matrix WCAG 2.1 Contrast

60D6A4
88E2A5
B2F2A4
D1F1A5
4B6870
—
1.2
Fail
1.4
Fail
1.4
Fail
3.3
AA Large
1.2
Fail
—
1.2
Fail
1.3
Fail
3.8
AA Large
1.4
Fail
1.2
Fail
—
1.0
Fail
4.6
AA
1.4
Fail
1.3
Fail
1.0
Fail
—
4.8
AA
3.3
AA Large
3.8
AA Large
4.6
AA
4.8
AA
—
White BG
1.8Fail
1.6Fail
1.3Fail
1.2Fail
6.0AA
Black BG
11.7AAA
13.5AAA
16.1AAA
16.8AAA
3.5AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

9394B0
AFB0B4
CECEB7
DFDFB7
58586E

Deuteranopia

8C83B3
AAA3B7
CAC5BB
DDDBBC
56546E

Tritanopia

66BABC
8DBFC2
B5C6C9
D3C6C9
4C6D6C

Achromatopsia

ADADAD
C0C0C0
D6D6D6
DFDFDF
606060

Shades & Tints Shades & Tints

#60D6A4

Dark
Light

#88E2A5

Dark
Light

#B2F2A4

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #60d6a4;
  --color-2: #88e2a5;
  --color-3: #b2f2a4;
  --color-4: #d1f1a5;
  --color-5: #4b6870;
}

SCSS

$color-1: #60d6a4;
$color-2: #88e2a5;
$color-3: #b2f2a4;
$color-4: #d1f1a5;
$color-5: #4b6870;

TAILWIND

colors: {
  'brand-1': '#60d6a4',
  'brand-2': '#88e2a5',
  'brand-3': '#b2f2a4',
  'brand-4': '#d1f1a5',
  'brand-5': '#4b6870',
}

RGB Array

[96, 214, 164], [136, 226, 165], [178, 242, 164], [209, 241, 165], [75, 104, 112]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #60D6A4, #88E2A5, #B2F2A4, #D1F1A5, #4B6870 is ideal for: health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #60d6a4; --color-2: #88e2a5; --color-3: #b2f2a4; --color-4: #d1f1a5; --color-5: #4b6870. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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