← Back to Editor

#C7C3C4 · #85BDB7 · #7DA3B1 · #9086A8 · #A8749D

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

#C7C3C4

Silver Gray · Silver · Pearl Gray

HEX
#C7C3C4
RGB
rgb(199, 195, 196)
HSL
hsl(345, 3%, 77%)
HSB
hsb(345, 2%, 78%)
CMYK
cmyk(0%, 2%, 2%, 22%)
Oklch
oklch(82.1% 0.005 0.0)

TraditionalSilver Gray」· PaintPearl Gray」· Creative Silver Lining

#85BDB7

Jade · MediumAquaMarine · Lake Green

HEX
#85BDB7
RGB
rgb(133, 189, 183)
HSL
hsl(174, 30%, 63%)
HSB
hsb(174, 30%, 74%)
CMYK
cmyk(30%, 0%, 3%, 26%)
Oklch
oklch(75.8% 0.059 187.7)

TraditionalJade」· PaintLake Green」· Creative Arctic Pool

#7DA3B1

Slate Blue · CadetBlue · Lake Green

HEX
#7DA3B1
RGB
rgb(125, 163, 177)
HSL
hsl(196, 25%, 59%)
HSB
hsb(196, 29%, 69%)
CMYK
cmyk(29%, 8%, 0%, 31%)
Oklch
oklch(69.2% 0.046 222.5)

TraditionalSlate Blue」· PaintLake Green」· Creative Blush Sunrise

#9086A8

Deep Indigo · LightSlateGray · Navy Blue

HEX
#9086A8
RGB
rgb(144, 134, 168)
HSL
hsl(258, 16%, 59%)
HSB
hsb(258, 20%, 66%)
CMYK
cmyk(14%, 20%, 0%, 34%)
Oklch
oklch(64.1% 0.051 298.4)

TraditionalDeep Indigo」· PaintNavy Blue」· Creative Blush Sunrise

#A8749D

Rose Purple · Gray · Violet

HEX
#A8749D
RGB
rgb(168, 116, 157)
HSL
hsl(313, 23%, 56%)
HSB
hsb(313, 31%, 66%)
CMYK
cmyk(0%, 31%, 7%, 34%)
Oklch
oklch(62.6% 0.086 334.4)

TraditionalRose Purple」· PaintViolet」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C7C3C4
C3C6C5

Analogous

C6C3C5
C7C3C4
C6C3C3

Triadic

C7C3C4
C3C6C3
C3C3C6

Split-Comp.

C7C3C4
C3C6C3
C3C5C6

Tetradic

C7C3C4
C5C6C3
C3C6C5
C3C3C6

Contrast Matrix WCAG 2.1 Contrast

C7C3C4
85BDB7
7DA3B1
9086A8
A8749D
1.2
Fail
1.6
Fail
2.0
Fail
2.1
Fail
1.2
Fail
1.3
Fail
1.6
Fail
1.8
Fail
1.6
Fail
1.3
Fail
1.3
Fail
1.4
Fail
2.0
Fail
1.6
Fail
1.3
Fail
1.1
Fail
2.1
Fail
1.8
Fail
1.4
Fail
1.1
Fail
White BG
1.7Fail
2.1Fail
2.7Fail
3.4AA Large
3.7AA Large
Black BG
12.0AAA
10.0AAA
7.7AAA
6.2AA
5.6AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C5C5C4
9D9EB8
8D8EAE
8C8CA0
919193

Deuteranopia

C6C6C4
9A96B9
8B88AD
8C8D9E
959891

Tritanopia

C7C4C4
88BABA
7FABAA
8F9998
A58B8A

Achromatopsia

C4C4C4
ACACAC
999999
8D8D8D
888888

Shades & Tints Shades & Tints

#C7C3C4

Dark
Light

#85BDB7

Dark
Light

#7DA3B1

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c7c3c4;
  --color-2: #85bdb7;
  --color-3: #7da3b1;
  --color-4: #9086a8;
  --color-5: #a8749d;
}

SCSS

$color-1: #c7c3c4;
$color-2: #85bdb7;
$color-3: #7da3b1;
$color-4: #9086a8;
$color-5: #a8749d;

TAILWIND

colors: {
  'brand-1': '#c7c3c4',
  'brand-2': '#85bdb7',
  'brand-3': '#7da3b1',
  'brand-4': '#9086a8',
  'brand-5': '#a8749d',
}

RGB Array

[199, 195, 196], [133, 189, 183], [125, 163, 177], [144, 134, 168], [168, 116, 157]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C7C3C4, #85BDB7, #7DA3B1, #9086A8, #A8749D 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: #c7c3c4; --color-2: #85bdb7; --color-3: #7da3b1; --color-4: #9086a8; --color-5: #a8749d. 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