← Back to Editor

#98B8BE · #ABB5B5 · #C0B5AF · #CEB9AF · #CEBEB7

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

#98B8BE

Sky Blue · DarkGray · Lake Green

HEX
#98B8BE
RGB
rgb(152, 184, 190)
HSL
hsl(189, 23%, 67%)
HSB
hsb(189, 20%, 75%)
CMYK
cmyk(20%, 3%, 0%, 25%)
Oklch
oklch(76.1% 0.036 210.2)

TraditionalSky Blue」· PaintLake Green」· Creative Arctic Pool

#ABB5B5

Ash · DarkGray · Silver Sand

HEX
#ABB5B5
RGB
rgb(171, 181, 181)
HSL
hsl(180, 6%, 69%)
HSB
hsb(180, 6%, 71%)
CMYK
cmyk(6%, 0%, 0%, 29%)
Oklch
oklch(76.5% 0.011 196.9)

TraditionalAsh」· PaintSilver Sand」· Creative Urban Concrete

#C0B5AF

Apricot · Silver · Warm Sun

HEX
#C0B5AF
RGB
rgb(192, 181, 175)
HSL
hsl(21, 12%, 72%)
HSB
hsb(21, 9%, 75%)
CMYK
cmyk(0%, 6%, 9%, 25%)
Oklch
oklch(78.1% 0.015 50.7)

TraditionalApricot」· PaintWarm Sun」· Creative Honey Glow

#CEB9AF

Apricot · Silver · Warm Sun

HEX
#CEB9AF
RGB
rgb(206, 185, 175)
HSL
hsl(19, 24%, 75%)
HSB
hsb(19, 15%, 81%)
CMYK
cmyk(0%, 10%, 15%, 19%)
Oklch
oklch(80.1% 0.028 47.2)

TraditionalApricot」· PaintWarm Sun」· Creative Honey Glow

#CEBEB7

Apricot · Silver · Peach Orange

HEX
#CEBEB7
RGB
rgb(206, 190, 183)
HSL
hsl(18, 19%, 76%)
HSB
hsb(18, 11%, 81%)
CMYK
cmyk(0%, 8%, 11%, 19%)
Oklch
oklch(81.3% 0.021 45.2)

TraditionalApricot」· PaintPeach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

98B8BE
BE9D97

Analogous

97BEB1
98B8BE
97A5BE

Triadic

98B8BE
BE97B8
B8BE97

Split-Comp.

98B8BE
BE97A5
BEB197

Tetradic

98B8BE
B197BE
BE9D97
A5BE97

Contrast Matrix WCAG 2.1 Contrast

98B8BE
ABB5B5
C0B5AF
CEB9AF
CEBEB7
1.0
Fail
1.1
Fail
1.1
Fail
1.2
Fail
1.0
Fail
1.0
Fail
1.1
Fail
1.2
Fail
1.1
Fail
1.0
Fail
1.1
Fail
1.1
Fail
1.1
Fail
1.1
Fail
1.1
Fail
1.0
Fail
1.2
Fail
1.2
Fail
1.1
Fail
1.0
Fail
White BG
2.1Fail
2.1Fail
2.0Fail
1.9Fail
1.8Fail
Black BG
9.9AAA
10.0AAA
10.5AAA
11.2AAA
11.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A6A6BD
AFAFB5
BBBBB0
C5C5B1
C7C7B9

Deuteranopia

A4A2BC
AFAEB5
BCBDB1
C6C8B2
C8C9B9

Tritanopia

9ABBBB
ACB5B5
BFB2B2
CDB3B4
CDBABA

Achromatopsia

AFAFAF
B2B2B2
B8B8B8
BEBEBE
C2C2C2

Shades & Tints Shades & Tints

#98B8BE

Dark
Light

#ABB5B5

Dark
Light

#C0B5AF

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #98b8be;
  --color-2: #abb5b5;
  --color-3: #c0b5af;
  --color-4: #ceb9af;
  --color-5: #cebeb7;
}

SCSS

$color-1: #98b8be;
$color-2: #abb5b5;
$color-3: #c0b5af;
$color-4: #ceb9af;
$color-5: #cebeb7;

TAILWIND

colors: {
  'brand-1': '#98b8be',
  'brand-2': '#abb5b5',
  'brand-3': '#c0b5af',
  'brand-4': '#ceb9af',
  'brand-5': '#cebeb7',
}

RGB Array

[152, 184, 190], [171, 181, 181], [192, 181, 175], [206, 185, 175], [206, 190, 183]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #98B8BE, #ABB5B5, #C0B5AF, #CEB9AF, #CEBEB7 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: #98b8be; --color-2: #abb5b5; --color-3: #c0b5af; --color-4: #ceb9af; --color-5: #cebeb7. 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