#ABD111 + #2DA88E + #2B5ECC + #493085 + #2B2A2E - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#ABD111

Grass Green · GreenYellow · Olive Green

HEX

#ABD111

RGB

rgb(171, 209, 17)

HSL

hsl(72, 85%, 44%)

HSB

hsb(72, 92%, 82%)

CMYK

cmyk(18%, 0%, 92%, 18%)

Oklch

oklch(80.4% 0.192 122.0)

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

#2DA88E

Mineral Blue · LightSeaGreen · Mint Ice

HEX

#2DA88E

RGB

rgb(45, 168, 142)

HSL

hsl(167, 58%, 42%)

HSB

hsb(167, 73%, 66%)

CMYK

cmyk(73%, 0%, 15%, 34%)

Oklch

oklch(65.9% 0.112 175.0)

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

#2B5ECC

Indigo · SteelBlue · Navy Blue

HEX

#2B5ECC

RGB

rgb(43, 94, 204)

HSL

hsl(221, 65%, 48%)

HSB

hsb(221, 79%, 80%)

CMYK

cmyk(79%, 54%, 0%, 20%)

Oklch

oklch(51.3% 0.180 262.9)

Traditional「Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

#493085

Deep Indigo · DarkSlateBlue · Prussian Blue

HEX

#493085

RGB

rgb(73, 48, 133)

HSL

hsl(258, 47%, 35%)

HSB

hsb(258, 64%, 52%)

CMYK

cmyk(45%, 64%, 0%, 48%)

Oklch

oklch(38.8% 0.136 292.5)

Traditional「Deep Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#2B2A2E

Dark Cyan · DarkSlateGray · Dark Stone

HEX

#2B2A2E

RGB

rgb(43, 42, 46)

HSL

hsl(255, 5%, 17%)

HSB

hsb(255, 9%, 18%)

CMYK

cmyk(7%, 9%, 0%, 82%)

Oklch

oklch(28.8% 0.007 297.4)

Traditional「Dark Cyan」· Paint「Dark Stone」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

ABD111

3711D0

Analogous

D09611

ABD111

4AD011

Triadic

ABD111

11A9D0

D011A9

Split-Comp.

ABD111

114AD0

9611D0

Tetradic

ABD111

11D096

3711D0

D0114A

Contrast Matrix WCAG 2.1 Contrast

ABD111	2DA88E	2B5ECC	493085	2B2A2E
—	1.7 Fail	3.3 AA Large	5.8 AA	8.0 AAA
1.7 Fail	—	2.0 Fail	3.5 AA Large	4.8 AA
3.3 AA Large	2.0 Fail	—	1.7 Fail	2.4 Fail
5.8 AA	3.5 AA Large	1.7 Fail	—	1.4 Fail
8.0 AAA	4.8 AA	2.4 Fail	1.4 Fail	—

White BG

1.8Fail

3.0Fail

5.9AA

10.3AAA

14.3AAA

Black BG

11.9AAA

7.1AAA

3.6AA Large

2.0Fail

1.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

BBBC3F

626394

4142B1

3E3E70

2B2B2D

Deuteranopia

B9B64B

5B5296

3E3AAB

40426C

2B2B2D

Tritanopia

AD646C

33999A

2E9C98

48605D

2B2C2C

Achromatopsia

B0B0B0

808080

5B5B5B

414141

2B2B2B

Shades & Tints Shades & Tints

#ABD111

Dark

Light

#2DA88E

Dark

Light

#2B5ECC

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #abd111;
  --color-2: #2da88e;
  --color-3: #2b5ecc;
  --color-4: #493085;
  --color-5: #2b2a2e;
}

SCSS

$color-1: #abd111;
$color-2: #2da88e;
$color-3: #2b5ecc;
$color-4: #493085;
$color-5: #2b2a2e;

TAILWIND

colors: {
  'brand-1': '#abd111',
  'brand-2': '#2da88e',
  'brand-3': '#2b5ecc',
  'brand-4': '#493085',
  'brand-5': '#2b2a2e',
}

RGB Array

[171, 209, 17], [45, 168, 142], [43, 94, 204], [73, 48, 133], [43, 42, 46]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #ABD111, #2DA88E, #2B5ECC, #493085, #2B2A2E is ideal for: tech websites, dark mode UIs, game UIs. 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: #abd111; --color-2: #2da88e; --color-3: #2b5ecc; --color-4: #493085; --color-5: #2b2a2e. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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