#3EE9B9 + #61D096 + #97AD87 + #B9787F + #C73E7A - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#3EE9B9

Mineral Blue · Turquoise · Lake Green

HEX

#3EE9B9

RGB

rgb(62, 233, 185)

HSL

hsl(163, 80%, 58%)

HSB

hsb(163, 73%, 91%)

CMYK

cmyk(73%, 0%, 21%, 9%)

Oklch

oklch(83.7% 0.153 169.3)

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

#61D096

Emerald · MediumAquaMarine · Olive Green

HEX

#61D096

RGB

rgb(97, 208, 150)

HSL

hsl(149, 54%, 60%)

HSB

hsb(149, 53%, 82%)

CMYK

cmyk(53%, 0%, 28%, 18%)

Oklch

oklch(77.7% 0.133 158.3)

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

#97AD87

Celadon · DarkSeaGreen · Olive Green

HEX

#97AD87

RGB

rgb(151, 173, 135)

HSL

hsl(95, 19%, 60%)

HSB

hsb(95, 22%, 68%)

CMYK

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

Oklch

oklch(72.0% 0.059 132.3)

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

#B9787F

Crimson · LightCoral · Passion Red

HEX

#B9787F

RGB

rgb(185, 120, 127)

HSL

hsl(354, 32%, 60%)

HSB

hsb(354, 35%, 73%)

CMYK

cmyk(0%, 35%, 31%, 27%)

Oklch

oklch(64.2% 0.082 12.6)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#C73E7A

Dark Violet · MediumVioletRed · Rose Pink

HEX

#C73E7A

RGB

rgb(199, 62, 122)

HSL

hsl(334, 55%, 51%)

HSB

hsb(334, 69%, 78%)

CMYK

cmyk(0%, 69%, 39%, 22%)

Oklch

oklch(57.8% 0.180 357.5)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3EE9B9

EA3E6F

Analogous

3EEA63

3EE9B9

3EC4EA

Triadic

3EE9B9

B93EEA

EAB93E

Split-Comp.

3EE9B9

EA3EC4

EA633E

Tetradic

3EE9B9

633EEA

EA3E6F

C4EA3E

Contrast Matrix WCAG 2.1 Contrast

3EE9B9	61D096	97AD87	B9787F	C73E7A
—	1.2 Fail	1.6 Fail	2.2 Fail	3.1 AA Large
1.2 Fail	—	1.3 Fail	1.8 Fail	2.5 Fail
1.6 Fail	1.3 Fail	—	1.4 Fail	2.0 Fail
2.2 Fail	1.8 Fail	1.4 Fail	—	1.4 Fail
3.1 AA Large	2.5 Fail	2.0 Fail	1.4 Fail	—

White BG

1.5Fail

1.9Fail

2.4Fail

3.5AA Large

4.8AA

Black BG

13.6AAA

11.0AAA

8.6AAA

6.1AA

4.4AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

888AC5

9192A4

A1A190

9D9C7D

8C8A6B

Deuteranopia

7E71C7

8B82A7

9F9E92

A1A67D

949E68

Tritanopia

47CED0

67AFB2

989799

B67C7C

C0605E

Achromatopsia

B0B0B0

A8A8A8

A2A2A2

8C8C8C

6E6E6E

Shades & Tints Shades & Tints

#3EE9B9

Dark

Light

#61D096

Dark

Light

#97AD87

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3ee9b9;
  --color-2: #61d096;
  --color-3: #97ad87;
  --color-4: #b9787f;
  --color-5: #c73e7a;
}

SCSS

$color-1: #3ee9b9;
$color-2: #61d096;
$color-3: #97ad87;
$color-4: #b9787f;
$color-5: #c73e7a;

TAILWIND

colors: {
  'brand-1': '#3ee9b9',
  'brand-2': '#61d096',
  'brand-3': '#97ad87',
  'brand-4': '#b9787f',
  'brand-5': '#c73e7a',
}

RGB Array

[62, 233, 185], [97, 208, 150], [151, 173, 135], [185, 120, 127], [199, 62, 122]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #3EE9B9, #61D096, #97AD87, #B9787F, #C73E7A 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: #3ee9b9; --color-2: #61d096; --color-3: #97ad87; --color-4: #b9787f; --color-5: #c73e7a. 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