#3B294A + #2E3A46 + #10603C + #2DB541 + #99CC5C · dark - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#3B294A

Dark Plum · DarkSlateGray · Eggplant

HEX

#3B294A

RGB

rgb(59, 41, 74)

HSL

hsl(273, 29%, 23%)

HSB

hsb(273, 45%, 29%)

CMYK

cmyk(20%, 45%, 0%, 71%)

Oklch

oklch(31.7% 0.061 308.3)

Traditional「Dark Plum」· Paint「Eggplant」· Creative Blush Sunrise

#2E3A46

Indigo · DarkSlateGray · Prussian Blue

HEX

#2E3A46

RGB

rgb(46, 58, 70)

HSL

hsl(210, 21%, 23%)

HSB

hsb(210, 34%, 27%)

CMYK

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

Oklch

oklch(34.3% 0.027 248.6)

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

#10603C

Mineral Blue · DarkSlateGray · Forest Green

HEX

#10603C

RGB

rgb(16, 96, 60)

HSL

hsl(153, 71%, 22%)

HSB

hsb(153, 83%, 38%)

CMYK

cmyk(83%, 0%, 37%, 62%)

Oklch

oklch(43.4% 0.095 157.9)

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

#2DB541

Pine Green · LimeGreen · Olive Green

HEX

#2DB541

RGB

rgb(45, 181, 65)

HSL

hsl(129, 60%, 44%)

HSB

hsb(129, 75%, 71%)

CMYK

cmyk(75%, 0%, 64%, 29%)

Oklch

oklch(67.8% 0.194 145.1)

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

#99CC5C

Grass Green · DarkSeaGreen · Olive Green

HEX

#99CC5C

RGB

rgb(153, 204, 92)

HSL

hsl(87, 52%, 58%)

HSB

hsb(87, 55%, 80%)

CMYK

cmyk(25%, 0%, 55%, 20%)

Oklch

oklch(78.6% 0.152 129.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3B294A

394C2A

Analogous

2B2A4C

3B294A

4C2A4A

Triadic

3B294A

4C3C2A

2A4C3C

Split-Comp.

3B294A

4A4C2A

2A4C2B

Tetradic

3B294A

4C2B2A

394C2A

2A4A4C

Contrast Matrix WCAG 2.1 Contrast

3B294A	2E3A46	10603C	2DB541	99CC5C
—	1.1 Fail	1.7 Fail	4.9 AA	7.0 AA
1.1 Fail	—	1.5 Fail	4.3 AA Large	6.2 AA
1.7 Fail	1.5 Fail	—	2.8 Fail	4.0 AA Large
4.9 AA	4.3 AA Large	2.8 Fail	—	1.4 Fail
7.0 AA	6.2 AA	4.0 AA Large	1.4 Fail	—

White BG

13.1AAA

11.6AAA

7.6AAA

2.7Fail

1.9Fail

Black BG

1.6Fail

1.8Fail

2.8Fail

7.8AAA

11.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

333342

333343

333345

68695D

AFB077

Deuteranopia

343640

333242

2E2847

605664

ACA87E

Tritanopia

3A3C3A

2F4140

144C4D

347378

9C8C91

Achromatopsia

323232

383838

444444

7F7F7F

B0B0B0

Shades & Tints Shades & Tints

#3B294A

Dark

Light

#2E3A46

Dark

Light

#10603C

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3b294a;
  --color-2: #2e3a46;
  --color-3: #10603c;
  --color-4: #2db541;
  --color-5: #99cc5c;
}

SCSS

$color-1: #3b294a;
$color-2: #2e3a46;
$color-3: #10603c;
$color-4: #2db541;
$color-5: #99cc5c;

TAILWIND

colors: {
  'brand-1': '#3b294a',
  'brand-2': '#2e3a46',
  'brand-3': '#10603c',
  'brand-4': '#2db541',
  'brand-5': '#99cc5c',
}

RGB Array

[59, 41, 74], [46, 58, 70], [16, 96, 60], [45, 181, 65], [153, 204, 92]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This dark-style palette of #3B294A, #2E3A46, #10603C, #2DB541, #99CC5C 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: #3b294a; --color-2: #2e3a46; --color-3: #10603c; --color-4: #2db541; --color-5: #99cc5c. 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 dark-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