← Back to Editor

#83D3AE · #558D66 · #473448 · #2F1810 · #973C03

space

A 5-color space 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

#83D3AE

Jade · MediumAquaMarine · Apple Green

HEX
#83D3AE
RGB
rgb(131, 211, 174)
HSL
hsl(152, 48%, 67%)
HSB
hsb(152, 38%, 83%)
CMYK
cmyk(38%, 0%, 18%, 17%)
Oklch
oklch(80.5% 0.096 163.3)

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

#558D66

Celadon · DimGray · Olive Green

HEX
#558D66
RGB
rgb(85, 141, 102)
HSL
hsl(138, 25%, 44%)
HSB
hsb(138, 40%, 55%)
CMYK
cmyk(40%, 0%, 28%, 45%)
Oklch
oklch(59.3% 0.084 152.9)

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

#473448

Dark Plum · DarkSlateGray · Eggplant

HEX
#473448
RGB
rgb(71, 52, 72)
HSL
hsl(297, 16%, 24%)
HSB
hsb(297, 28%, 28%)
CMYK
cmyk(1%, 28%, 0%, 72%)
Oklch
oklch(35.4% 0.042 324.8)

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

#2F1810

Tangerine · Black · Cinnamon

HEX
#2F1810
RGB
rgb(47, 24, 16)
HSL
hsl(15, 49%, 12%)
HSB
hsb(15, 66%, 18%)
CMYK
cmyk(0%, 49%, 66%, 82%)
Oklch
oklch(23.9% 0.040 39.9)

Traditional「Tangerine」· Paint「Cinnamon」· Creative Blush Sunrise

#973C03

Tangerine · Brown · Amber Brown

HEX
#973C03
RGB
rgb(151, 60, 3)
HSL
hsl(23, 96%, 30%)
HSB
hsb(23, 98%, 59%)
CMYK
cmyk(0%, 60%, 98%, 41%)
Oklch
oklch(47.5% 0.135 44.5)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

83D3AE
D382A8

Analogous

82D385
83D3AE
82D1D3

Triadic

83D3AE
AE82D3
D3AE82

Split-Comp.

83D3AE
D382D1
D38582

Tetradic

83D3AE
8582D3
D382A8
D1D382

Contrast Matrix WCAG 2.1 Contrast

83D3AE
558D66
473448
2F1810
973C03
—
2.2
Fail
6.4
AA
9.4
AAA
4.0
AA Large
2.2
Fail
—
2.9
Fail
4.3
AA Large
1.8
Fail
6.4
AA
2.9
Fail
—
1.5
Fail
1.6
Fail
9.4
AAA
4.3
AA Large
1.5
Fail
—
2.4
Fail
4.0
AA Large
1.8
Fail
1.6
Fail
2.4
Fail
—
White BG
1.8Fail
3.9AA Large
11.3AAA
16.7AAA
7.1AAA
Black BG
11.9AAA
5.4AA
1.9Fail
1.3Fail
3.0Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

A6A6B7
6D6E6F
3F3F43
252512
706F11

Deuteranopia

A19BB9
6A6672
404142
262812
757C14

Tritanopia

87BEC0
587779
463F3F
2E1314
921C1E

Achromatopsia

B7B7B7
787878
3C3C3C
1E1E1E
515151

Shades & Tints Shades & Tints

#83D3AE

Dark
Light

#558D66

Dark
Light

#473448

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #83d3ae;
  --color-2: #558d66;
  --color-3: #473448;
  --color-4: #2f1810;
  --color-5: #973c03;
}

SCSS

$color-1: #83d3ae;
$color-2: #558d66;
$color-3: #473448;
$color-4: #2f1810;
$color-5: #973c03;

TAILWIND

colors: {
  'brand-1': '#83d3ae',
  'brand-2': '#558d66',
  'brand-3': '#473448',
  'brand-4': '#2f1810',
  'brand-5': '#973c03',
}

RGB Array

[131, 211, 174], [85, 141, 102], [71, 52, 72], [47, 24, 16], [151, 60, 3]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This space-style palette of #83D3AE, #558D66, #473448, #2F1810, #973C03 is ideal for: tech websites, dark mode UIs, game UIs, 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: #83d3ae; --color-2: #558d66; --color-3: #473448; --color-4: #2f1810; --color-5: #973c03. 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. 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 space-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