← Back to Editor

#6B8E98 · #A5B3B3 · #C2C7C2 · #B9989D · #AB767D

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

#6B8E98

Slate Blue · LightSlateGray · Lake Green

HEX
#6B8E98
RGB
rgb(107, 142, 152)
HSL
hsl(193, 18%, 51%)
HSB
hsb(193, 30%, 60%)
CMYK
cmyk(30%, 7%, 0%, 40%)
Oklch
oklch(62.4% 0.042 217.2)

TraditionalSlate Blue」· PaintLake Green」· Creative Blush Sunrise

#A5B3B3

Sky Blue · DarkGray · Silver Sand

HEX
#A5B3B3
RGB
rgb(165, 179, 179)
HSL
hsl(180, 8%, 67%)
HSB
hsb(180, 8%, 70%)
CMYK
cmyk(8%, 0%, 0%, 30%)
Oklch
oklch(75.6% 0.016 196.8)

TraditionalSky Blue」· PaintSilver Sand」· Creative Urban Concrete

#C2C7C2

Silver Gray · Silver · Pearl Gray

HEX
#C2C7C2
RGB
rgb(194, 199, 194)
HSL
hsl(120, 4%, 77%)
HSB
hsb(120, 3%, 78%)
CMYK
cmyk(3%, 0%, 3%, 22%)
Oklch
oklch(82.4% 0.009 145.5)

TraditionalSilver Gray」· PaintPearl Gray」· Creative Silver Lining

#B9989D

Peach Pink · DarkGray · Coral Red

HEX
#B9989D
RGB
rgb(185, 152, 157)
HSL
hsl(351, 19%, 66%)
HSB
hsb(351, 18%, 73%)
CMYK
cmyk(0%, 18%, 15%, 27%)
Oklch
oklch(71.1% 0.040 7.9)

TraditionalPeach Pink」· PaintCoral Red」· Creative Rose Petal

#AB767D

Crimson · Gray · Passion Red

HEX
#AB767D
RGB
rgb(171, 118, 125)
HSL
hsl(352, 24%, 57%)
HSB
hsb(352, 31%, 67%)
CMYK
cmyk(0%, 31%, 27%, 33%)
Oklch
oklch(62.2% 0.067 10.5)

TraditionalCrimson」· PaintPassion Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

6B8E98
99756C

Analogous

6C998C
6B8E98
6C7899

Triadic

6B8E98
996C8F
8F996C

Split-Comp.

6B8E98
996C78
998C6C

Tetradic

6B8E98
8C6C99
99756C
78996C

Contrast Matrix WCAG 2.1 Contrast

6B8E98
A5B3B3
C2C7C2
B9989D
AB767D
1.6
Fail
2.1
Fail
1.4
Fail
1.1
Fail
1.6
Fail
1.3
Fail
1.2
Fail
1.7
Fail
2.1
Fail
1.3
Fail
1.5
Fail
2.2
Fail
1.4
Fail
1.2
Fail
1.5
Fail
1.4
Fail
1.1
Fail
1.7
Fail
2.2
Fail
1.4
Fail
White BG
3.5AA Large
2.2Fail
1.7Fail
2.6Fail
3.7AA Large
Black BG
5.9AA
9.7AAA
12.2AAA
8.0AAA
5.6AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

7A7A96
ABABB3
C4C4C3
ABAA9C
94947B

Deuteranopia

787695
AAA9B3
C4C3C3
ADAF9C
979B7B

Tritanopia

6D9493
A6B3B3
C2C4C4
B79B9B
A87A7A

Achromatopsia

858585
AFAFAF
C5C5C5
A2A2A2
878787

Shades & Tints Shades & Tints

#6B8E98

Dark
Light

#A5B3B3

Dark
Light

#C2C7C2

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #6b8e98;
  --color-2: #a5b3b3;
  --color-3: #c2c7c2;
  --color-4: #b9989d;
  --color-5: #ab767d;
}

SCSS

$color-1: #6b8e98;
$color-2: #a5b3b3;
$color-3: #c2c7c2;
$color-4: #b9989d;
$color-5: #ab767d;

TAILWIND

colors: {
  'brand-1': '#6b8e98',
  'brand-2': '#a5b3b3',
  'brand-3': '#c2c7c2',
  'brand-4': '#b9989d',
  'brand-5': '#ab767d',
}

RGB Array

[107, 142, 152], [165, 179, 179], [194, 199, 194], [185, 152, 157], [171, 118, 125]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #6B8E98, #A5B3B3, #C2C7C2, #B9989D, #AB767D 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: #6b8e98; --color-2: #a5b3b3; --color-3: #c2c7c2; --color-4: #b9989d; --color-5: #ab767d. 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