← Back to Editor

#9EB0BC · #9B3E84 · #680557 · #310016 · #060805

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

#9EB0BC

Sky Blue · DarkGray · Cobalt Blue

HEX
#9EB0BC
RGB
rgb(158, 176, 188)
HSL
hsl(204, 18%, 68%)
HSB
hsb(204, 16%, 74%)
CMYK
cmyk(16%, 6%, 0%, 26%)
Oklch
oklch(74.7% 0.027 237.0)

Traditional「Sky Blue」· Paint「Cobalt Blue」· Creative Twilight Haze

#9B3E84

Rose Purple · MediumVioletRed · Violet

HEX
#9B3E84
RGB
rgb(155, 62, 132)
HSL
hsl(315, 43%, 43%)
HSB
hsb(315, 60%, 61%)
CMYK
cmyk(0%, 60%, 15%, 39%)
Oklch
oklch(51.4% 0.150 338.3)

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

#680557

Rose Purple · Purple · Eggplant

HEX
#680557
RGB
rgb(104, 5, 87)
HSL
hsl(310, 91%, 21%)
HSB
hsb(310, 95%, 41%)
CMYK
cmyk(0%, 95%, 16%, 59%)
Oklch
oklch(35.5% 0.151 337.4)

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

#310016

Dark Violet · Black · Raspberry

HEX
#310016
RGB
rgb(49, 0, 22)
HSL
hsl(333, 100%, 10%)
HSB
hsb(333, 100%, 19%)
CMYK
cmyk(0%, 100%, 55%, 81%)
Oklch
oklch(20.3% 0.083 358.8)

Traditional「Dark Violet」· Paint「Raspberry」· Creative Blush Sunrise

#060805

Celadon · Black · Dark Green

HEX
#060805
RGB
rgb(6, 8, 5)
HSL
hsl(100, 23%, 3%)
HSB
hsb(100, 38%, 3%)
CMYK
cmyk(25%, 0%, 37%, 97%)
Oklch
oklch(13.0% 0.009 134.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

9EB0BC
BCAA9F

Analogous

9FBCB9
9EB0BC
9FA2BC

Triadic

9EB0BC
BC9FB0
B0BC9F

Split-Comp.

9EB0BC
BC9FA2
BCB99F

Tetradic

9EB0BC
B99FBC
BCAA9F
A2BC9F

Contrast Matrix WCAG 2.1 Contrast

9EB0BC
9B3E84
680557
310016
060805
—
2.7
Fail
5.4
AA
8.2
AAA
9.0
AAA
2.7
Fail
—
2.0
Fail
3.0
Fail
3.3
AA Large
5.4
AA
2.0
Fail
—
1.5
Fail
1.7
Fail
8.2
AAA
3.0
Fail
1.5
Fail
—
1.1
Fail
9.0
AAA
3.3
AA Large
1.7
Fail
1.1
Fail
—
White BG
2.2Fail
6.1AA
12.0AAA
18.4AAA
20.1AAA
Black BG
9.4AAA
3.4AA Large
1.7Fail
1.1Fail
1.0Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

A6A6B9
737273
3D3C43
1C1B11
070706

Deuteranopia

A5A3B8
787F6F
434A3E
1F220F
070706

Tritanopia

9FB7B6
966663
633330
2F0C0C
060606

Achromatopsia

ACACAC
626262
2C2C2C
111111
070707

Shades & Tints Shades & Tints

#9EB0BC

Dark
Light

#9B3E84

Dark
Light

#680557

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #9eb0bc;
  --color-2: #9b3e84;
  --color-3: #680557;
  --color-4: #310016;
  --color-5: #060805;
}

SCSS

$color-1: #9eb0bc;
$color-2: #9b3e84;
$color-3: #680557;
$color-4: #310016;
$color-5: #060805;

TAILWIND

colors: {
  'brand-1': '#9eb0bc',
  'brand-2': '#9b3e84',
  'brand-3': '#680557',
  'brand-4': '#310016',
  'brand-5': '#060805',
}

RGB Array

[158, 176, 188], [155, 62, 132], [104, 5, 87], [49, 0, 22], [6, 8, 5]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #9EB0BC, #9B3E84, #680557, #310016, #060805 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: #9eb0bc; --color-2: #9b3e84; --color-3: #680557; --color-4: #310016; --color-5: #060805. 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 general-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