#361F3C + #2D3970 + #137A64 + #41B837 + #A8DF23 · cool - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#361F3C

Dark Plum · DarkSlateGray · Dark Purple

HEX

#361F3C

RGB

rgb(54, 31, 60)

HSL

hsl(288, 32%, 18%)

HSB

hsb(288, 48%, 24%)

CMYK

cmyk(10%, 48%, 0%, 76%)

Oklch

oklch(28.2% 0.060 319.1)

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

#2D3970

Indigo · MidnightBlue · Prussian Blue

HEX

#2D3970

RGB

rgb(45, 57, 112)

HSL

hsl(229, 43%, 31%)

HSB

hsb(229, 60%, 44%)

CMYK

cmyk(60%, 49%, 0%, 56%)

Oklch

oklch(36.5% 0.095 271.7)

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

#137A64

Mineral Blue · Teal · Mint Ice

HEX

#137A64

RGB

rgb(19, 122, 100)

HSL

hsl(167, 73%, 28%)

HSB

hsb(167, 84%, 48%)

CMYK

cmyk(84%, 0%, 18%, 52%)

Oklch

oklch(51.9% 0.094 173.5)

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

#41B837

Pine Green · LimeGreen · Olive Green

HEX

#41B837

RGB

rgb(65, 184, 55)

HSL

hsl(115, 54%, 47%)

HSB

hsb(115, 70%, 72%)

CMYK

cmyk(65%, 0%, 70%, 28%)

Oklch

oklch(69.0% 0.198 142.0)

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

#A8DF23

Grass Green · GreenYellow · Olive Green

HEX

#A8DF23

RGB

rgb(168, 223, 35)

HSL

hsl(78, 75%, 51%)

HSB

hsb(78, 84%, 87%)

CMYK

cmyk(25%, 0%, 84%, 13%)

Oklch

oklch(83.5% 0.204 126.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

361F3C

253D1F

Analogous

281F3D

361F3C

3D1F34

Triadic

361F3C

3D371F

1F3D37

Split-Comp.

361F3C

343D1F

1F3D28

Tetradic

361F3C

3D281F

253D1F

1F343D

Contrast Matrix WCAG 2.1 Contrast

361F3C	2D3970	137A64	41B837	A8DF23
—	1.4 Fail	2.8 Fail	5.7 AA	9.3 AAA
1.4 Fail	—	2.1 Fail	4.2 AA Large	6.9 AA
2.8 Fail	2.1 Fail	—	2.0 Fail	3.3 AA Large
5.7 AA	4.2 AA Large	2.0 Fail	—	1.6 Fail
9.3 AAA	6.9 AA	3.3 AA Large	1.6 Fail	—

White BG

14.8AAA

10.9AAA

5.3AA

2.6Fail

1.6Fail

Black BG

1.4Fail

1.9Fail

4.0AA Large

8.1AAA

13.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2C2C35

323263

404169

757656

C0C050

Deuteranopia

2D2F33

32315F

3A326B

6E655E

BDB95B

Tritanopia

352F2E

2E5856

186E6E

476F74

AB747C

Achromatopsia

292929

3C3C3C

595959

868686

B9B9B9

Shades & Tints Shades & Tints

#361F3C

Dark

Light

#2D3970

Dark

Light

#137A64

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #361f3c;
  --color-2: #2d3970;
  --color-3: #137a64;
  --color-4: #41b837;
  --color-5: #a8df23;
}

SCSS

$color-1: #361f3c;
$color-2: #2d3970;
$color-3: #137a64;
$color-4: #41b837;
$color-5: #a8df23;

TAILWIND

colors: {
  'brand-1': '#361f3c',
  'brand-2': '#2d3970',
  'brand-3': '#137a64',
  'brand-4': '#41b837',
  'brand-5': '#a8df23',
}

RGB Array

[54, 31, 60], [45, 57, 112], [19, 122, 100], [65, 184, 55], [168, 223, 35]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #361F3C, #2D3970, #137A64, #41B837, #A8DF23 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: #361f3c; --color-2: #2d3970; --color-3: #137a64; --color-4: #41b837; --color-5: #a8df23. 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 cool-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