← Back to Editor

#97D1C3 · #7CB99F · #9191B5 · #94779E · #826B7C

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 Library

Color Details Color Details

#97D1C3

Jade · LightSteelBlue · Lake Green

HEX
#97D1C3
RGB
rgb(151, 209, 195)
HSL
hsl(166, 39%, 71%)
HSB
hsb(166, 28%, 82%)
CMYK
cmyk(28%, 0%, 7%, 18%)
Oklch
oklch(81.7% 0.063 178.0)

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

#7CB99F

Jade · DarkSeaGreen · Apple Green

HEX
#7CB99F
RGB
rgb(124, 185, 159)
HSL
hsl(154, 30%, 61%)
HSB
hsb(154, 33%, 73%)
CMYK
cmyk(33%, 0%, 14%, 27%)
Oklch
oklch(73.7% 0.074 165.9)

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

#9191B5

Wisteria · DarkGray · Cobalt Blue

HEX
#9191B5
RGB
rgb(145, 145, 181)
HSL
hsl(240, 20%, 64%)
HSB
hsb(240, 20%, 71%)
CMYK
cmyk(20%, 20%, 0%, 29%)
Oklch
oklch(66.9% 0.053 284.9)

Traditional「Wisteria」· Paint「Cobalt Blue」· Creative Lavender Dream

#94779E

Dark Plum · LightSlateGray · Violet

HEX
#94779E
RGB
rgb(148, 119, 158)
HSL
hsl(285, 17%, 54%)
HSB
hsb(285, 25%, 62%)
CMYK
cmyk(6%, 25%, 0%, 38%)
Oklch
oklch(61.1% 0.067 317.3)

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

#826B7C

Rose Purple · Gray · Violet

HEX
#826B7C
RGB
rgb(130, 107, 124)
HSL
hsl(316, 10%, 46%)
HSB
hsb(316, 18%, 51%)
CMYK
cmyk(0%, 18%, 5%, 49%)
Oklch
oklch(55.6% 0.038 335.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

97D1C3
D298A6

Analogous

98D2A8
97D1C3
98C3D2

Triadic

97D1C3
C498D2
D2C498

Split-Comp.

97D1C3
D298C3
D2A898

Tetradic

97D1C3
A898D2
D298A6
C3D298

Contrast Matrix WCAG 2.1 Contrast

97D1C3
7CB99F
9191B5
94779E
826B7C
—
1.3
Fail
1.8
Fail
2.3
Fail
2.8
Fail
1.3
Fail
—
1.3
Fail
1.7
Fail
2.1
Fail
1.8
Fail
1.3
Fail
—
1.3
Fail
1.6
Fail
2.3
Fail
1.7
Fail
1.3
Fail
—
1.2
Fail
2.8
Fail
2.1
Fail
1.6
Fail
1.2
Fail
—
White BG
1.7Fail
2.3Fail
3.0AA Large
3.9AA Large
4.8AA
Black BG
12.2AAA
9.3AAA
6.9AA
5.4AA
4.3AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

B0B1C6
9697A5
9191AC
878795
787878

Deuteranopia

ADA8C7
938EA7
9191AA
898B92
797B77

Tritanopia

9AC9CA
7FAAAB
91A5A4
938D8B
817574

Achromatopsia

BEBEBE
A4A4A4
959595
848484
747474

Shades & Tints Shades & Tints

#97D1C3

Dark
Light

#7CB99F

Dark
Light

#9191B5

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #97d1c3;
  --color-2: #7cb99f;
  --color-3: #9191b5;
  --color-4: #94779e;
  --color-5: #826b7c;
}

SCSS

$color-1: #97d1c3;
$color-2: #7cb99f;
$color-3: #9191b5;
$color-4: #94779e;
$color-5: #826b7c;

TAILWIND

colors: {
  'brand-1': '#97d1c3',
  'brand-2': '#7cb99f',
  'brand-3': '#9191b5',
  'brand-4': '#94779e',
  'brand-5': '#826b7c',
}

RGB Array

[151, 209, 195], [124, 185, 159], [145, 145, 181], [148, 119, 158], [130, 107, 124]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #97D1C3, #7CB99F, #9191B5, #94779E, #826B7C 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: #97d1c3; --color-2: #7cb99f; --color-3: #9191b5; --color-4: #94779e; --color-5: #826b7c. 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 general-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