← Back to Editor

#98A0A1 · #BCB4B6 · #C5BEBB · #CCD7B8 · #DBEBC0

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#98A0A1

Ash · DarkGray · Silver Sand

HEX
#98A0A1
RGB
rgb(152, 160, 161)
HSL
hsl(187, 5%, 61%)
HSB
hsb(187, 6%, 63%)
CMYK
cmyk(6%, 1%, 0%, 37%)
Oklch
oklch(70.0% 0.009 205.9)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

#BCB4B6

Silver Gray · Silver · Pearl Gray

HEX
#BCB4B6
RGB
rgb(188, 180, 182)
HSL
hsl(345, 6%, 72%)
HSB
hsb(345, 4%, 74%)
CMYK
cmyk(0%, 4%, 3%, 26%)
Oklch
oklch(77.7% 0.009 0.2)

Traditional「Silver Gray」· Paint「Pearl Gray」· Creative Silver Lining

#C5BEBB

Apricot · Silver · Pearl Gray

HEX
#C5BEBB
RGB
rgb(197, 190, 187)
HSL
hsl(18, 8%, 75%)
HSB
hsb(18, 5%, 77%)
CMYK
cmyk(0%, 4%, 5%, 23%)
Oklch
oklch(80.6% 0.009 44.9)

Traditional「Apricot」· Paint「Pearl Gray」· Creative Silver Lining

#CCD7B8

Willow Green · Silver · Apple Green

HEX
#CCD7B8
RGB
rgb(204, 215, 184)
HSL
hsl(81, 28%, 78%)
HSB
hsb(81, 14%, 84%)
CMYK
cmyk(5%, 0%, 14%, 16%)
Oklch
oklch(86.2% 0.043 123.2)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#DBEBC0

Willow Green · LightGray · Mint Green

HEX
#DBEBC0
RGB
rgb(219, 235, 192)
HSL
hsl(82, 52%, 84%)
HSB
hsb(82, 18%, 92%)
CMYK
cmyk(7%, 0%, 18%, 8%)
Oklch
oklch(91.7% 0.059 124.2)

Traditional「Willow Green」· Paint「Mint Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

98A0A1
A19897

Analogous

97A19D
98A0A1
979AA1

Triadic

98A0A1
A1979F
9FA197

Split-Comp.

98A0A1
A1979A
A19D97

Tetradic

98A0A1
9D97A1
A19897
9AA197

Contrast Matrix WCAG 2.1 Contrast

98A0A1
BCB4B6
C5BEBB
CCD7B8
DBEBC0
—
1.3
Fail
1.5
Fail
1.8
Fail
2.1
Fail
1.3
Fail
—
1.1
Fail
1.4
Fail
1.6
Fail
1.5
Fail
1.1
Fail
—
1.2
Fail
1.5
Fail
1.8
Fail
1.4
Fail
1.2
Fail
—
1.2
Fail
2.1
Fail
1.6
Fail
1.5
Fail
1.2
Fail
—
White BG
2.7Fail
2.0Fail
1.8Fail
1.5Fail
1.3Fail
Black BG
7.9AAA
10.3AAA
11.5AAA
14.0AAA
16.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9B9CA1
B9B8B6
C2C2BC
D1D1C0
E2E2CA

Deuteranopia

9B9AA1
B9BAB5
C2C3BC
D0CFC1
E1E0CD

Tritanopia

98A1A1
BCB5B5
C5BCBC
CDC5C7
DCD3D4

Achromatopsia

9E9E9E
B7B7B7
C0C0C0
D0D0D0
E1E1E1

Shades & Tints Shades & Tints

#98A0A1

Dark
Light

#BCB4B6

Dark
Light

#C5BEBB

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #98a0a1;
  --color-2: #bcb4b6;
  --color-3: #c5bebb;
  --color-4: #ccd7b8;
  --color-5: #dbebc0;
}

SCSS

$color-1: #98a0a1;
$color-2: #bcb4b6;
$color-3: #c5bebb;
$color-4: #ccd7b8;
$color-5: #dbebc0;

TAILWIND

colors: {
  'brand-1': '#98a0a1',
  'brand-2': '#bcb4b6',
  'brand-3': '#c5bebb',
  'brand-4': '#ccd7b8',
  'brand-5': '#dbebc0',
}

RGB Array

[152, 160, 161], [188, 180, 182], [197, 190, 187], [204, 215, 184], [219, 235, 192]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #98A0A1, #BCB4B6, #C5BEBB, #CCD7B8, #DBEBC0 is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs. 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: #98a0a1; --color-2: #bcb4b6; --color-3: #c5bebb; --color-4: #ccd7b8; --color-5: #dbebc0. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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 beauty, lifestyle, arts 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