← Back to Editor

#487860 · #484848 · #483030 · #301830 · #486048

space

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

ProfoundPremiumWarm

Industry INDUSTRY

FinanceLuxury

UI Context UI CONTEXT

Dark ThemeCorporate

Color Details Color Details

#487860

Mineral Blue · SeaGreen · Forest Green

HEX
#487860
RGB
rgb(72, 120, 96)
HSL
hsl(150, 25%, 38%)
HSB
hsb(150, 40%, 47%)
CMYK
cmyk(40%, 0%, 20%, 53%)
Oklch
oklch(53.1% 0.065 161.3)

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

#484848

Dark Cyan · DarkSlateGray · Charcoal

HEX
#484848
RGB
rgb(72, 72, 72)
HSL
hsl(0, 0%, 28%)
HSB
hsb(0, 0%, 28%)
CMYK
cmyk(0%, 0%, 0%, 72%)
Oklch
oklch(40.2% 0.000 89.9)

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

#483030

Crimson · DarkSlateGray · Wine Red

HEX
#483030
RGB
rgb(72, 48, 48)
HSL
hsl(0, 20%, 24%)
HSB
hsb(0, 33%, 28%)
CMYK
cmyk(0%, 33%, 33%, 72%)
Oklch
oklch(33.8% 0.035 19.1)

Traditional「Crimson」· Paint「Wine Red」· Creative Blush Sunrise

#301830

Rose Purple · DarkSlateGray · Dark Purple

HEX
#301830
RGB
rgb(48, 24, 48)
HSL
hsl(300, 33%, 14%)
HSB
hsb(300, 50%, 19%)
CMYK
cmyk(0%, 50%, 0%, 81%)
Oklch
oklch(25.3% 0.055 327.0)

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

#486048

Celadon · DarkOliveGreen · Forest Green

HEX
#486048
RGB
rgb(72, 96, 72)
HSL
hsl(120, 14%, 33%)
HSB
hsb(120, 25%, 38%)
CMYK
cmyk(25%, 0%, 25%, 62%)
Oklch
oklch(46.2% 0.048 144.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

487860
794961

Analogous

497949
487860
497979

Triadic

487860
614979
796149

Split-Comp.

487860
794979
794949

Tetradic

487860
494979
794961
797949

Contrast Matrix WCAG 2.1 Contrast

487860
484848
483030
301830
486048
—
1.8
Fail
2.4
Fail
3.2
AA Large
1.4
Fail
1.8
Fail
—
1.3
Fail
1.8
Fail
1.3
Fail
2.4
Fail
1.3
Fail
—
1.3
Fail
1.7
Fail
3.2
AA Large
1.8
Fail
1.3
Fail
—
2.3
Fail
1.4
Fail
1.3
Fail
1.7
Fail
2.3
Fail
—
White BG
5.1AA
9.1AAA
12.1AAA
16.2AAA
6.9AA
Black BG
4.1AA Large
2.3Fail
1.7Fail
1.3Fail
3.0AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

5D5D66
484848
3E3D30
26252A
52534E

Deuteranopia

5A5667
484848
3F4130
272929
514F4F

Tritanopia

4A6A6B
484848
473030
2F2625
495253

Achromatopsia

676767
484848
373737
222222
565656

Shades & Tints Shades & Tints

#487860

Dark
Light

#484848

Dark
Light

#483030

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #487860;
  --color-2: #484848;
  --color-3: #483030;
  --color-4: #301830;
  --color-5: #486048;
}

SCSS

$color-1: #487860;
$color-2: #484848;
$color-3: #483030;
$color-4: #301830;
$color-5: #486048;

TAILWIND

colors: {
  'brand-1': '#487860',
  'brand-2': '#484848',
  'brand-3': '#483030',
  'brand-4': '#301830',
  'brand-5': '#486048',
}

RGB Array

[72, 120, 96], [72, 72, 72], [72, 48, 48], [48, 24, 48], [72, 96, 72]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This space-style palette of #487860, #484848, #483030, #301830, #486048 is ideal for: brand design, premium product pages, magazine layouts, tech websites, dark mode UIs, game UIs. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #487860; --color-2: #484848; --color-3: #483030; --color-4: #301830; --color-5: #486048. 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 space-style 5-color scheme is especially suited for finance, legal, luxury industries. Restrained colors convey professionalism and trust. 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