← Back to Editor

#182333 · #7F8199 · #7597A3 · #6CACAD · #91AAAB

space

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

#182333

Indigo · DarkSlateGray · Deep Sea Blue

HEX
#182333
RGB
rgb(24, 35, 51)
HSL
hsl(216, 36%, 15%)
HSB
hsb(216, 53%, 20%)
CMYK
cmyk(53%, 31%, 0%, 80%)
Oklch
oklch(25.4% 0.034 257.7)

Traditional「Indigo」· Paint「Deep Sea Blue」· Creative Blush Sunrise

#7F8199

Azure · LightSlateGray · Navy Blue

HEX
#7F8199
RGB
rgb(127, 129, 153)
HSL
hsl(235, 11%, 55%)
HSB
hsb(235, 17%, 60%)
CMYK
cmyk(17%, 16%, 0%, 40%)
Oklch
oklch(61.0% 0.036 281.5)

Traditional「Azure」· Paint「Navy Blue」· Creative Blush Sunrise

#7597A3

Slate Blue · LightSlateGray · Lake Green

HEX
#7597A3
RGB
rgb(117, 151, 163)
HSL
hsl(196, 20%, 55%)
HSB
hsb(196, 28%, 64%)
CMYK
cmyk(28%, 7%, 0%, 36%)
Oklch
oklch(65.5% 0.042 221.5)

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

#6CACAD

Slate Blue · CadetBlue · Lake Green

HEX
#6CACAD
RGB
rgb(108, 172, 173)
HSL
hsl(181, 28%, 55%)
HSB
hsb(181, 38%, 68%)
CMYK
cmyk(38%, 1%, 0%, 32%)
Oklch
oklch(70.2% 0.066 197.0)

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

#91AAAB

Sky Blue · DarkGray · Lake Green

HEX
#91AAAB
RGB
rgb(145, 170, 171)
HSL
hsl(182, 13%, 62%)
HSB
hsb(182, 15%, 67%)
CMYK
cmyk(15%, 1%, 0%, 33%)
Oklch
oklch(71.9% 0.028 199.5)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

182333
342918

Analogous

183134
182333
1B1834

Triadic

182333
341823
233418

Split-Comp.

182333
341B18
313418

Tetradic

182333
341831
342918
18341B

Contrast Matrix WCAG 2.1 Contrast

182333
7F8199
7597A3
6CACAD
91AAAB
—
4.1
AA Large
5.1
AA
6.1
AA
6.4
AA
4.1
AA Large
—
1.2
Fail
1.5
Fail
1.6
Fail
5.1
AA
1.2
Fail
—
1.2
Fail
1.3
Fail
6.1
AA
1.5
Fail
1.2
Fail
—
1.0
Fail
6.4
AA
1.6
Fail
1.3
Fail
1.0
Fail
—
White BG
15.8AAA
3.8AA Large
3.1AA Large
2.6Fail
2.5Fail
Black BG
1.3Fail
5.5AA
6.7AA
8.1AAA
8.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

1D1D2F
808093
8484A0
8888AD
9C9CAB

Deuteranopia

1C1B2E
808092
827F9F
847FAD
9A99AB

Tritanopia

192C2B
7F8F8E
779E9D
6FADAD
92ABAB

Achromatopsia

222222
838383
8E8E8E
999999
A3A3A3

Shades & Tints Shades & Tints

#182333

Dark
Light

#7F8199

Dark
Light

#7597A3

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #182333;
  --color-2: #7f8199;
  --color-3: #7597a3;
  --color-4: #6cacad;
  --color-5: #91aaab;
}

SCSS

$color-1: #182333;
$color-2: #7f8199;
$color-3: #7597a3;
$color-4: #6cacad;
$color-5: #91aaab;

TAILWIND

colors: {
  'brand-1': '#182333',
  'brand-2': '#7f8199',
  'brand-3': '#7597a3',
  'brand-4': '#6cacad',
  'brand-5': '#91aaab',
}

RGB Array

[24, 35, 51], [127, 129, 153], [117, 151, 163], [108, 172, 173], [145, 170, 171]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This space-style palette of #182333, #7F8199, #7597A3, #6CACAD, #91AAAB is ideal for: brand design, premium product pages, magazine layouts, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. 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: #182333; --color-2: #7f8199; --color-3: #7597a3; --color-4: #6cacad; --color-5: #91aaab. 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 space-style 5-color scheme is especially suited for tech, SaaS, healthcare, eco 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