#2C92B8 + #36BA8E + #5AD66B + #A2DE6A + #EDDEB9 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#2C92B8

Lake Blue · SteelBlue · Mint Ice

HEX

#2C92B8

RGB

rgb(44, 146, 184)

HSL

hsl(196, 61%, 45%)

HSB

hsb(196, 76%, 72%)

CMYK

cmyk(76%, 21%, 0%, 28%)

Oklch

oklch(61.9% 0.106 227.7)

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

#36BA8E

Mineral Blue · MediumSeaGreen · Mint Ice

HEX

#36BA8E

RGB

rgb(54, 186, 142)

HSL

hsl(160, 55%, 47%)

HSB

hsb(160, 71%, 73%)

CMYK

cmyk(71%, 0%, 24%, 27%)

Oklch

oklch(70.7% 0.130 166.1)

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

#5AD66B

Emerald · MediumSeaGreen · Olive Green

HEX

#5AD66B

RGB

rgb(90, 214, 107)

HSL

hsl(128, 60%, 60%)

HSB

hsb(128, 58%, 84%)

CMYK

cmyk(58%, 0%, 50%, 16%)

Oklch

oklch(78.2% 0.184 146.1)

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

#A2DE6A

Emerald · LightGreen · Apple Green

HEX

#A2DE6A

RGB

rgb(162, 222, 106)

HSL

hsl(91, 64%, 64%)

HSB

hsb(91, 52%, 87%)

CMYK

cmyk(27%, 0%, 52%, 13%)

Oklch

oklch(83.5% 0.160 131.7)

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

#EDDEB9

Goose Yellow · Wheat · Lemon Cream

HEX

#EDDEB9

RGB

rgb(237, 222, 185)

HSL

hsl(43, 59%, 83%)

HSB

hsb(43, 22%, 93%)

CMYK

cmyk(0%, 6%, 22%, 7%)

Oklch

oklch(90.3% 0.051 88.6)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2C92B8

B9522D

Analogous

2DB998

2C92B8

2D4DB9

Triadic

2C92B8

B92D93

93B92D

Split-Comp.

2C92B8

B92D4D

B9982D

Tetradic

2C92B8

982DB9

B9522D

4DB92D

Contrast Matrix WCAG 2.1 Contrast

2C92B8	36BA8E	5AD66B	A2DE6A	EDDEB9
—	1.5 Fail	1.9 Fail	2.2 Fail	2.7 Fail
1.5 Fail	—	1.3 Fail	1.5 Fail	1.8 Fail
1.9 Fail	1.3 Fail	—	1.2 Fail	1.4 Fail
2.2 Fail	1.5 Fail	1.2 Fail	—	1.2 Fail
2.7 Fail	1.8 Fail	1.4 Fail	1.2 Fail	—

White BG

3.6AA Large

2.5Fail

1.9Fail

1.6Fail

1.3Fail

Black BG

5.9AA

8.6AAA

11.3AAA

13.2AAA

15.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

5859AF

6F7099

909185

BCBD86

E7E6C2

Deuteranopia

524BAD

685E9B

897F8B

B9B48D

E7E8C4

Tritanopia

31A8A6

3DA1A3

60999E

A59CA1

ECC9CB

Achromatopsia

787878

8E8E8E

A5A5A5

BFBFBF

DEDEDE

Shades & Tints Shades & Tints

#2C92B8

Dark

Light

#36BA8E

Dark

Light

#5AD66B

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2c92b8;
  --color-2: #36ba8e;
  --color-3: #5ad66b;
  --color-4: #a2de6a;
  --color-5: #eddeb9;
}

SCSS

$color-1: #2c92b8;
$color-2: #36ba8e;
$color-3: #5ad66b;
$color-4: #a2de6a;
$color-5: #eddeb9;

TAILWIND

colors: {
  'brand-1': '#2c92b8',
  'brand-2': '#36ba8e',
  'brand-3': '#5ad66b',
  'brand-4': '#a2de6a',
  'brand-5': '#eddeb9',
}

RGB Array

[44, 146, 184], [54, 186, 142], [90, 214, 107], [162, 222, 106], [237, 222, 185]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #2C92B8, #36BA8E, #5AD66B, #A2DE6A, #EDDEB9 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: #2c92b8; --color-2: #36ba8e; --color-3: #5ad66b; --color-4: #a2de6a; --color-5: #eddeb9. 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