← Back to Editor

#7C998C · #78BD9A · #8ED4B7 · #5FFFFF · #0B0111

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

#7C998C

Mineral Blue · LightSlateGray · Olive Green

HEX
#7C998C
RGB
rgb(124, 153, 140)
HSL
hsl(153, 12%, 54%)
HSB
hsb(153, 19%, 60%)
CMYK
cmyk(19%, 0%, 8%, 40%)
Oklch
oklch(65.7% 0.038 166.2)

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

#78BD9A

Jade · DarkSeaGreen · Apple Green

HEX
#78BD9A
RGB
rgb(120, 189, 154)
HSL
hsl(150, 34%, 61%)
HSB
hsb(150, 37%, 74%)
CMYK
cmyk(37%, 0%, 19%, 26%)
Oklch
oklch(74.3% 0.087 161.2)

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

#8ED4B7

Jade · MediumAquaMarine · Apple Green

HEX
#8ED4B7
RGB
rgb(142, 212, 183)
HSL
hsl(155, 45%, 69%)
HSB
hsb(155, 33%, 83%)
CMYK
cmyk(33%, 0%, 14%, 17%)
Oklch
oklch(81.5% 0.082 166.5)

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

#5FFFFF

Sky Blue · LightSkyBlue · Lake Green

HEX
#5FFFFF
RGB
rgb(95, 255, 255)
HSL
hsl(180, 100%, 69%)
HSB
hsb(180, 63%, 100%)
CMYK
cmyk(63%, 0%, 0%, 0%)
Oklch
oklch(91.7% 0.132 195.1)

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

#0B0111

Royal Purple · Black · Dark Purple

HEX
#0B0111
RGB
rgb(11, 1, 17)
HSL
hsl(278, 89%, 4%)
HSB
hsb(278, 94%, 7%)
CMYK
cmyk(35%, 94%, 0%, 93%)
Oklch
oklch(11.6% 0.048 314.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7C998C
987C88

Analogous

7C987D
7C998C
7C9698

Triadic

7C998C
8B7C98
988B7C

Split-Comp.

7C998C
987C96
987D7C

Tetradic

7C998C
7D7C98
987C88
96987C

Contrast Matrix WCAG 2.1 Contrast

7C998C
78BD9A
8ED4B7
5FFFFF
0B0111
—
1.4
Fail
1.8
Fail
2.5
Fail
6.6
AA
1.4
Fail
—
1.3
Fail
1.8
Fail
9.3
AAA
1.8
Fail
1.3
Fail
—
1.4
Fail
11.9
AAA
2.5
Fail
1.8
Fail
1.4
Fail
—
16.8
AAA
6.6
AA
9.3
AAA
11.9
AAA
16.8
AAA
—
White BG
3.1AA Large
2.2Fail
1.7Fail
1.2Fail
20.5AAA
Black BG
6.8AA
9.5AAA
12.3AAA
17.2AAA
1.0Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

89898F
9696A2
ACADBE
A4A6FF
07070D

Deuteranopia

878590
928DA5
A8A3C0
9B8FFF
07080C

Tritanopia

7D9292
7BA9AB
92C4C5
67FFFF
0B0A09

Achromatopsia

8F8F8F
A4A4A4
BCBCBC
CFCFCF
060606

Shades & Tints Shades & Tints

#7C998C

Dark
Light

#78BD9A

Dark
Light

#8ED4B7

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7c998c;
  --color-2: #78bd9a;
  --color-3: #8ed4b7;
  --color-4: #5fffff;
  --color-5: #0b0111;
}

SCSS

$color-1: #7c998c;
$color-2: #78bd9a;
$color-3: #8ed4b7;
$color-4: #5fffff;
$color-5: #0b0111;

TAILWIND

colors: {
  'brand-1': '#7c998c',
  'brand-2': '#78bd9a',
  'brand-3': '#8ed4b7',
  'brand-4': '#5fffff',
  'brand-5': '#0b0111',
}

RGB Array

[124, 153, 140], [120, 189, 154], [142, 212, 183], [95, 255, 255], [11, 1, 17]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7C998C, #78BD9A, #8ED4B7, #5FFFFF, #0B0111 is ideal for: 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: #7c998c; --color-2: #78bd9a; --color-3: #8ed4b7; --color-4: #5fffff; --color-5: #0b0111. 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 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