← Back to Editor

#32383A · #2C5648 · #0D755D · #51C197 · #A5F4D9

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#32383A

Dark Cyan · DarkSlateGray · Dark Stone

HEX
#32383A
RGB
rgb(50, 56, 58)
HSL
hsl(195, 7%, 21%)
HSB
hsb(195, 14%, 23%)
CMYK
cmyk(14%, 3%, 0%, 77%)
Oklch
oklch(33.6% 0.009 219.7)

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

#2C5648

Mineral Blue · DarkSlateGray · Peacock Green

HEX
#2C5648
RGB
rgb(44, 86, 72)
HSL
hsl(160, 32%, 25%)
HSB
hsb(160, 49%, 34%)
CMYK
cmyk(49%, 0%, 16%, 66%)
Oklch
oklch(41.8% 0.053 170.0)

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

#0D755D

Mineral Blue · Teal · Peacock Green

HEX
#0D755D
RGB
rgb(13, 117, 93)
HSL
hsl(166, 80%, 25%)
HSB
hsb(166, 89%, 46%)
CMYK
cmyk(89%, 0%, 21%, 54%)
Oklch
oklch(50.2% 0.095 171.4)

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

#51C197

Mineral Blue · MediumAquaMarine · Olive Green

HEX
#51C197
RGB
rgb(81, 193, 151)
HSL
hsl(158, 47%, 54%)
HSB
hsb(158, 58%, 76%)
CMYK
cmyk(58%, 0%, 22%, 24%)
Oklch
oklch(73.5% 0.120 165.5)

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

#A5F4D9

Jade · LightBlue · Apple Green

HEX
#A5F4D9
RGB
rgb(165, 244, 217)
HSL
hsl(159, 78%, 80%)
HSB
hsb(159, 32%, 96%)
CMYK
cmyk(32%, 0%, 11%, 4%)
Oklch
oklch(90.8% 0.086 170.9)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

32383A
393432

Analogous

323937
32383A
323439

Triadic

32383A
393237
373932

Split-Comp.

32383A
393234
393732

Tetradic

32383A
373239
393432
343932

Contrast Matrix WCAG 2.1 Contrast

32383A
2C5648
0D755D
51C197
A5F4D9
—
1.4
Fail
2.1
Fail
5.3
AA
9.4
AAA
1.4
Fail
—
1.5
Fail
3.7
AA Large
6.5
AA
2.1
Fail
1.5
Fail
—
2.5
Fail
4.4
AA Large
5.3
AA
3.7
AA Large
2.5
Fail
—
1.8
Fail
9.4
AAA
6.5
AA
4.4
AA Large
1.8
Fail
—
White BG
11.9AAA
8.3AAA
5.6AA
2.2Fail
1.3Fail
Black BG
1.8Fail
2.5Fail
3.7AA Large
9.4AAA
16.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

35353A
3E3F4B
3A3B63
8183A1
C7C8E0

Deuteranopia

343439
3C394C
342C64
7B73A4
C3BDE1

Tritanopia

323939
2E4E4F
126768
57A9AB
A9E5E6

Achromatopsia

363636
484848
535353
9B9B9B
D9D9D9

Shades & Tints Shades & Tints

#32383A

Dark
Light

#2C5648

Dark
Light

#0D755D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #32383a;
  --color-2: #2c5648;
  --color-3: #0d755d;
  --color-4: #51c197;
  --color-5: #a5f4d9;
}

SCSS

$color-1: #32383a;
$color-2: #2c5648;
$color-3: #0d755d;
$color-4: #51c197;
$color-5: #a5f4d9;

TAILWIND

colors: {
  'brand-1': '#32383a',
  'brand-2': '#2c5648',
  'brand-3': '#0d755d',
  'brand-4': '#51c197',
  'brand-5': '#a5f4d9',
}

RGB Array

[50, 56, 58], [44, 86, 72], [13, 117, 93], [81, 193, 151], [165, 244, 217]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #32383A, #2C5648, #0D755D, #51C197, #A5F4D9 is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #32383a; --color-2: #2c5648; --color-3: #0d755d; --color-4: #51c197; --color-5: #a5f4d9. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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