← Back to Editor

#7F7A85 · #9376B8 · #7F8EB2 · #6AA7AB · #56BFA5

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 Library

Color Details Color Details

#7F7A85

Ink Gray · Gray · Warm Gray

HEX
#7F7A85
RGB
rgb(127, 122, 133)
HSL
hsl(267, 4%, 50%)
HSB
hsb(267, 8%, 52%)
CMYK
cmyk(5%, 8%, 0%, 48%)
Oklch
oklch(58.8% 0.018 306.2)

TraditionalInk Gray」· PaintWarm Gray」· Creative Urban Concrete

#9376B8

Deep Indigo · LightSlateGray · Violet

HEX
#9376B8
RGB
rgb(147, 118, 184)
HSL
hsl(266, 32%, 59%)
HSB
hsb(266, 36%, 72%)
CMYK
cmyk(20%, 36%, 0%, 28%)
Oklch
oklch(61.9% 0.102 303.8)

TraditionalDeep Indigo」· PaintViolet」· Creative Blush Sunrise

#7F8EB2

Azure · LightSlateGray · Navy Blue

HEX
#7F8EB2
RGB
rgb(127, 142, 178)
HSL
hsl(222, 25%, 60%)
HSB
hsb(222, 29%, 70%)
CMYK
cmyk(29%, 20%, 0%, 30%)
Oklch
oklch(64.8% 0.057 267.1)

TraditionalAzure」· PaintNavy Blue」· Creative Blush Sunrise

#6AA7AB

Slate Blue · CadetBlue · Lake Green

HEX
#6AA7AB
RGB
rgb(106, 167, 171)
HSL
hsl(184, 28%, 54%)
HSB
hsb(184, 38%, 67%)
CMYK
cmyk(38%, 2%, 0%, 33%)
Oklch
oklch(68.8% 0.063 201.1)

TraditionalSlate Blue」· PaintLake Green」· Creative Blush Sunrise

#56BFA5

Mineral Blue · MediumAquaMarine · Lake Green

HEX
#56BFA5
RGB
rgb(86, 191, 165)
HSL
hsl(165, 45%, 54%)
HSB
hsb(165, 55%, 75%)
CMYK
cmyk(55%, 0%, 14%, 25%)
Oklch
oklch(73.5% 0.105 174.6)

TraditionalMineral Blue」· PaintLake Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7F7A85
80857A

Analogous

7A7B85
7F7A85
847A85

Triadic

7F7A85
857F7A
7A857F

Split-Comp.

7F7A85
85847A
7B857A

Tetradic

7F7A85
857A7B
80857A
7A8584

Contrast Matrix WCAG 2.1 Contrast

7F7A85
9376B8
7F8EB2
6AA7AB
56BFA5
1.1
Fail
1.3
Fail
1.5
Fail
1.9
Fail
1.1
Fail
1.2
Fail
1.4
Fail
1.7
Fail
1.3
Fail
1.2
Fail
1.2
Fail
1.5
Fail
1.5
Fail
1.4
Fail
1.2
Fail
1.2
Fail
1.9
Fail
1.7
Fail
1.5
Fail
1.2
Fail
White BG
4.2AA Large
3.8AA Large
3.3AA Large
2.7Fail
2.2Fail
Black BG
5.0AA
5.5AA
6.4AA
7.7AAA
9.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

7D7D82
8686A8
8586A9
8485AA
8384AB

Deuteranopia

7D7E82
888AA4
8584A7
817CAA
7D76AD

Tritanopia

7F8080
929B99
80A2A1
6DA9A9
5BB0B1

Achromatopsia

7D7D7D
868686
8E8E8E
959595
9D9D9D

Shades & Tints Shades & Tints

#7F7A85

Dark
Light

#9376B8

Dark
Light

#7F8EB2

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7f7a85;
  --color-2: #9376b8;
  --color-3: #7f8eb2;
  --color-4: #6aa7ab;
  --color-5: #56bfa5;
}

SCSS

$color-1: #7f7a85;
$color-2: #9376b8;
$color-3: #7f8eb2;
$color-4: #6aa7ab;
$color-5: #56bfa5;

TAILWIND

colors: {
  'brand-1': '#7f7a85',
  'brand-2': '#9376b8',
  'brand-3': '#7f8eb2',
  'brand-4': '#6aa7ab',
  'brand-5': '#56bfa5',
}

RGB Array

[127, 122, 133], [147, 118, 184], [127, 142, 178], [106, 167, 171], [86, 191, 165]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This space-style palette of #7F7A85, #9376B8, #7F8EB2, #6AA7AB, #56BFA5 is ideal for: brand design, premium product pages, magazine layouts. 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: #7f7a85; --color-2: #9376b8; --color-3: #7f8eb2; --color-4: #6aa7ab; --color-5: #56bfa5. 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. 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