#2E7B81 + #4A8C81 + #95BA7D + #ADC67E + #BFCD83 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#2E7B81

Slate Blue · SeaGreen · Mint Ice

HEX

#2E7B81

RGB

rgb(46, 123, 129)

HSL

hsl(184, 47%, 34%)

HSB

hsb(184, 64%, 51%)

CMYK

cmyk(64%, 5%, 0%, 49%)

Oklch

oklch(53.8% 0.075 202.4)

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

#4A8C81

Mineral Blue · CadetBlue · Mint Ice

HEX

#4A8C81

RGB

rgb(74, 140, 129)

HSL

hsl(170, 31%, 42%)

HSB

hsb(170, 47%, 55%)

CMYK

cmyk(47%, 0%, 8%, 45%)

Oklch

oklch(59.3% 0.070 181.7)

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

#95BA7D

Celadon · DarkSeaGreen · Apple Green

HEX

#95BA7D

RGB

rgb(149, 186, 125)

HSL

hsl(96, 31%, 61%)

HSB

hsb(96, 33%, 73%)

CMYK

cmyk(20%, 0%, 33%, 27%)

Oklch

oklch(74.6% 0.093 133.6)

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

#ADC67E

Willow Green · DarkSeaGreen · Apple Green

HEX

#ADC67E

RGB

rgb(173, 198, 126)

HSL

hsl(81, 39%, 64%)

HSB

hsb(81, 36%, 78%)

CMYK

cmyk(13%, 0%, 36%, 22%)

Oklch

oklch(79.1% 0.100 124.2)

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

#BFCD83

Willow Green · Tan · Apple Green

HEX

#BFCD83

RGB

rgb(191, 205, 131)

HSL

hsl(71, 43%, 66%)

HSB

hsb(71, 36%, 80%)

CMYK

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

Oklch

oklch(82.0% 0.098 117.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2E7B81

7F332E

Analogous

2E7F5C

2E7B81

2E517F

Triadic

2E7B81

7F2E7A

7A7F2E

Split-Comp.

2E7B81

7F2E51

7F5C2E

Tetradic

2E7B81

5C2E7F

7F332E

517F2E

Contrast Matrix WCAG 2.1 Contrast

2E7B81	4A8C81	95BA7D	ADC67E	BFCD83
—	1.3 Fail	2.2 Fail	2.6 Fail	2.9 Fail
1.3 Fail	—	1.8 Fail	2.1 Fail	2.3 Fail
2.2 Fail	1.8 Fail	—	1.2 Fail	1.3 Fail
2.6 Fail	2.1 Fail	1.2 Fail	—	1.1 Fail
2.9 Fail	2.3 Fail	1.3 Fail	1.1 Fail	—

White BG

4.9AA

3.9AA Large

2.2Fail

1.9Fail

1.7Fail

Black BG

4.3AA Large

5.4AA

9.6AAA

11.2AAA

12.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

4F5080

676784

A5A58C

B8B88F

C5C595

Deuteranopia

4B457F

635E84

A3A08F

B6B594

C4C399

Tritanopia

327E7E

4D8686

97979A

AE9DA0

C0A3A6

Achromatopsia

656565

777777

A8A8A8

B6B6B6

C0C0C0

Shades & Tints Shades & Tints

#2E7B81

Dark

Light

#4A8C81

Dark

Light

#95BA7D

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2e7b81;
  --color-2: #4a8c81;
  --color-3: #95ba7d;
  --color-4: #adc67e;
  --color-5: #bfcd83;
}

SCSS

$color-1: #2e7b81;
$color-2: #4a8c81;
$color-3: #95ba7d;
$color-4: #adc67e;
$color-5: #bfcd83;

TAILWIND

colors: {
  'brand-1': '#2e7b81',
  'brand-2': '#4a8c81',
  'brand-3': '#95ba7d',
  'brand-4': '#adc67e',
  'brand-5': '#bfcd83',
}

RGB Array

[46, 123, 129], [74, 140, 129], [149, 186, 125], [173, 198, 126], [191, 205, 131]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #2E7B81, #4A8C81, #95BA7D, #ADC67E, #BFCD83 is ideal for: corporate websites, product showcases, portfolios. 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: #2e7b81; --color-2: #4a8c81; --color-3: #95ba7d; --color-4: #adc67e; --color-5: #bfcd83. 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. 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