← Back to Editor

#483743 · #358891 · #52C6BD · #97DFBA · #C0EDB8

dark

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#483743

Rose Purple · DarkSlateGray · Eggplant

HEX
#483743
RGB
rgb(72, 55, 67)
HSL
hsl(318, 13%, 25%)
HSB
hsb(318, 24%, 28%)
CMYK
cmyk(0%, 24%, 7%, 72%)
Oklch
oklch(36.0% 0.031 337.1)

Traditional「Rose Purple」· Paint「Eggplant」· Creative Blush Sunrise

#358891

Slate Blue · SteelBlue · Mint Ice

HEX
#358891
RGB
rgb(53, 136, 145)
HSL
hsl(186, 46%, 39%)
HSB
hsb(186, 63%, 57%)
CMYK
cmyk(63%, 6%, 0%, 43%)
Oklch
oklch(58.0% 0.080 205.1)

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

#52C6BD

Mineral Blue · MediumTurquoise · Lake Green

HEX
#52C6BD
RGB
rgb(82, 198, 189)
HSL
hsl(175, 50%, 55%)
HSB
hsb(175, 59%, 78%)
CMYK
cmyk(59%, 0%, 5%, 22%)
Oklch
oklch(75.8% 0.105 188.2)

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

#97DFBA

Emerald · LightGreen · Apple Green

HEX
#97DFBA
RGB
rgb(151, 223, 186)
HSL
hsl(149, 53%, 73%)
HSB
hsb(149, 32%, 87%)
CMYK
cmyk(32%, 0%, 17%, 13%)
Oklch
oklch(84.6% 0.089 161.3)

Traditional「Emerald」· Paint「Apple Green」· Creative Mint Breeze

#C0EDB8

Emerald · LightGray · Mint Green

HEX
#C0EDB8
RGB
rgb(192, 237, 184)
HSL
hsl(111, 60%, 83%)
HSB
hsb(111, 22%, 93%)
CMYK
cmyk(19%, 0%, 22%, 7%)
Oklch
oklch(90.1% 0.085 140.8)

Traditional「Emerald」· Paint「Mint Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

483743
37483C

Analogous

453748
483743
48373B

Triadic

483743
434837
374348

Split-Comp.

483743
3B4837
374845

Tetradic

483743
484537
37483C
373B48

Contrast Matrix WCAG 2.1 Contrast

483743
358891
52C6BD
97DFBA
C0EDB8
—
2.7
Fail
5.3
AA
7.1
AAA
8.4
AAA
2.7
Fail
—
2.0
Fail
2.7
Fail
3.2
AA Large
5.3
AA
2.0
Fail
—
1.3
Fail
1.6
Fail
7.1
AAA
2.7
Fail
1.3
Fail
—
1.2
Fail
8.4
AAA
3.2
AA Large
1.6
Fail
1.2
Fail
—
White BG
11.0AAA
4.1AA Large
2.1Fail
1.5Fail
1.3Fail
Black BG
1.9Fail
5.1AA
10.2AAA
13.6AAA
16.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

414040
595A8F
8485BF
B6B7C3
D3D4C5

Deuteranopia

42433F
544E8E
7E75C0
B2ADC5
D1CDC8

Tritanopia

473E3D
398D8D
58C1C1
9BCACC
C2CFD1

Achromatopsia

3D3D3D
707070
A2A2A2
C5C5C5
DADADA

Shades & Tints Shades & Tints

#483743

Dark
Light

#358891

Dark
Light

#52C6BD

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #483743;
  --color-2: #358891;
  --color-3: #52c6bd;
  --color-4: #97dfba;
  --color-5: #c0edb8;
}

SCSS

$color-1: #483743;
$color-2: #358891;
$color-3: #52c6bd;
$color-4: #97dfba;
$color-5: #c0edb8;

TAILWIND

colors: {
  'brand-1': '#483743',
  'brand-2': '#358891',
  'brand-3': '#52c6bd',
  'brand-4': '#97dfba',
  'brand-5': '#c0edb8',
}

RGB Array

[72, 55, 67], [53, 136, 145], [82, 198, 189], [151, 223, 186], [192, 237, 184]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This dark-style palette of #483743, #358891, #52C6BD, #97DFBA, #C0EDB8 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: #483743; --color-2: #358891; --color-3: #52c6bd; --color-4: #97dfba; --color-5: #c0edb8. 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 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