#2E2C2C + #246C47 + #1AAB62 + #73D531 + #CCFF00 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#2E2C2C

Dark Cyan · DarkSlateGray · Dark Stone

HEX

#2E2C2C

RGB

rgb(46, 44, 44)

HSL

hsl(0, 2%, 18%)

HSB

hsb(0, 4%, 18%)

CMYK

cmyk(0%, 4%, 4%, 82%)

Oklch

oklch(29.5% 0.003 17.3)

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

#246C47

Celadon · DarkSlateGray · Forest Green

HEX

#246C47

RGB

rgb(36, 108, 71)

HSL

hsl(149, 50%, 28%)

HSB

hsb(149, 67%, 42%)

CMYK

cmyk(67%, 0%, 34%, 58%)

Oklch

oklch(47.6% 0.094 157.2)

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

#1AAB62

Mineral Blue · MediumSeaGreen · Forest Green

HEX

#1AAB62

RGB

rgb(26, 171, 98)

HSL

hsl(150, 74%, 39%)

HSB

hsb(150, 85%, 67%)

CMYK

cmyk(85%, 0%, 43%, 33%)

Oklch

oklch(65.3% 0.158 154.2)

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

#73D531

Emerald · LimeGreen · Olive Green

HEX

#73D531

RGB

rgb(115, 213, 49)

HSL

hsl(96, 66%, 51%)

HSB

hsb(96, 77%, 84%)

CMYK

cmyk(46%, 0%, 77%, 16%)

Oklch

oklch(78.3% 0.213 136.0)

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

#CCFF00

Grass Green · Yellow · Olive Green

HEX

#CCFF00

RGB

rgb(204, 255, 0)

HSL

hsl(72, 100%, 50%)

HSB

hsb(72, 100%, 100%)

CMYK

cmyk(20%, 0%, 100%, 0%)

Oklch

oklch(93.1% 0.229 123.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2E2C2C

2D2F2F

Analogous

2F2D2E

2E2C2C

2F2E2D

Triadic

2E2C2C

2D2F2D

2D2D2F

Split-Comp.

2E2C2C

2D2F2E

2D2E2F

Tetradic

2E2C2C

2E2F2D

2D2F2F

2E2D2F

Contrast Matrix WCAG 2.1 Contrast

2E2C2C	246C47	1AAB62	73D531	CCFF00
—	2.2 Fail	4.7 AA	7.5 AAA	11.8 AAA
2.2 Fail	—	2.1 Fail	3.4 AA Large	5.4 AA
4.7 AA	2.1 Fail	—	1.6 Fail	2.5 Fail
7.5 AAA	3.4 AA Large	1.6 Fail	—	1.6 Fail
11.8 AAA	5.4 AA	2.5 Fail	1.6 Fail	—

White BG

13.9AAA

6.3AA

3.0Fail

1.9Fail

1.2Fail

Black BG

1.5Fail

3.3AA Large

7.0AAA

11.3AAA

17.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2D2D2C

434450

595A74

9D9E59

E2E33E

Deuteranopia

2D2D2C

3F3A52

504678

989062

DFDB4D

Tritanopia

2E2C2C

285759

218285

78787F

CF6E79

Achromatopsia

2D2D2D

525252

777777

A5A5A5

D3D3D3

Shades & Tints Shades & Tints

#2E2C2C

Dark

Light

#246C47

Dark

Light

#1AAB62

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2e2c2c;
  --color-2: #246c47;
  --color-3: #1aab62;
  --color-4: #73d531;
  --color-5: #ccff00;
}

SCSS

$color-1: #2e2c2c;
$color-2: #246c47;
$color-3: #1aab62;
$color-4: #73d531;
$color-5: #ccff00;

TAILWIND

colors: {
  'brand-1': '#2e2c2c',
  'brand-2': '#246c47',
  'brand-3': '#1aab62',
  'brand-4': '#73d531',
  'brand-5': '#ccff00',
}

RGB Array

[46, 44, 44], [36, 108, 71], [26, 171, 98], [115, 213, 49], [204, 255, 0]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #2E2C2C, #246C47, #1AAB62, #73D531, #CCFF00 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: #2e2c2c; --color-2: #246c47; --color-3: #1aab62; --color-4: #73d531; --color-5: #ccff00. 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