← Back to Editor

#E7F1B2 · #96E8D2 · #12B99F · #7B9677 · #C5DB5F

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#E7F1B2

Willow Green · Wheat · Mint Green

HEX
#E7F1B2
RGB
rgb(231, 241, 178)
HSL
hsl(70, 69%, 82%)
HSB
hsb(70, 26%, 95%)
CMYK
cmyk(4%, 0%, 26%, 5%)
Oklch
oklch(93.5% 0.082 115.3)

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

#96E8D2

Jade · LightBlue · Lake Green

HEX
#96E8D2
RGB
rgb(150, 232, 210)
HSL
hsl(164, 64%, 75%)
HSB
hsb(164, 35%, 91%)
CMYK
cmyk(35%, 0%, 9%, 9%)
Oklch
oklch(87.2% 0.086 175.4)

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

#12B99F

Mineral Blue · LightSeaGreen · Mint Ice

HEX
#12B99F
RGB
rgb(18, 185, 159)
HSL
hsl(171, 82%, 40%)
HSB
hsb(171, 90%, 73%)
CMYK
cmyk(90%, 0%, 14%, 27%)
Oklch
oklch(70.4% 0.128 177.6)

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

#7B9677

Celadon · Gray · Olive Green

HEX
#7B9677
RGB
rgb(123, 150, 119)
HSL
hsl(112, 13%, 53%)
HSB
hsb(112, 21%, 59%)
CMYK
cmyk(18%, 0%, 21%, 41%)
Oklch
oklch(64.4% 0.055 141.5)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#C5DB5F

Willow Green · BurlyWood · Apple Green

HEX
#C5DB5F
RGB
rgb(197, 219, 95)
HSL
hsl(71, 63%, 62%)
HSB
hsb(71, 57%, 86%)
CMYK
cmyk(10%, 0%, 57%, 14%)
Oklch
oklch(85.0% 0.151 118.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E7F1B2
BCB1F1

Analogous

F1DCB1
E7F1B2
C7F1B1

Triadic

E7F1B2
B1E6F1
F1B1E6

Split-Comp.

E7F1B2
B1C7F1
DCB1F1

Tetradic

E7F1B2
B1F1DC
BCB1F1
F1B1C7

Contrast Matrix WCAG 2.1 Contrast

E7F1B2
96E8D2
12B99F
7B9677
C5DB5F
—
1.2
Fail
2.1
Fail
2.7
Fail
1.3
Fail
1.2
Fail
—
1.7
Fail
2.3
Fail
1.1
Fail
2.1
Fail
1.7
Fail
—
1.3
Fail
1.6
Fail
2.7
Fail
2.3
Fail
1.3
Fail
—
2.1
Fail
1.3
Fail
1.1
Fail
1.6
Fail
2.1
Fail
—
White BG
1.2Fail
1.4Fail
2.5Fail
3.2AA Large
1.5Fail
Black BG
17.6AAA
14.8AAA
8.5AAA
6.5AA
13.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

EBEBC1
BABAD7
5A5CA5
87877F
CFCF7D

Deuteranopia

EBEAC5
B5AFD9
5144A7
858380
CDCC84

Tritanopia

E8CDD0
9ADCDC
1AAAAB
7C8486
C6959A

Achromatopsia

E7E7E7
CDCDCD
848484
8A8A8A
C6C6C6

Shades & Tints Shades & Tints

#E7F1B2

Dark
Light

#96E8D2

Dark
Light

#12B99F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e7f1b2;
  --color-2: #96e8d2;
  --color-3: #12b99f;
  --color-4: #7b9677;
  --color-5: #c5db5f;
}

SCSS

$color-1: #e7f1b2;
$color-2: #96e8d2;
$color-3: #12b99f;
$color-4: #7b9677;
$color-5: #c5db5f;

TAILWIND

colors: {
  'brand-1': '#e7f1b2',
  'brand-2': '#96e8d2',
  'brand-3': '#12b99f',
  'brand-4': '#7b9677',
  'brand-5': '#c5db5f',
}

RGB Array

[231, 241, 178], [150, 232, 210], [18, 185, 159], [123, 150, 119], [197, 219, 95]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E7F1B2, #96E8D2, #12B99F, #7B9677, #C5DB5F is ideal for: 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: #e7f1b2; --color-2: #96e8d2; --color-3: #12b99f; --color-4: #7b9677; --color-5: #c5db5f. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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