← Back to Editor

#A3BBBD · #CFCAC6 · #CCA2A3 · #8A7770 · #D1C1B2

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

#A3BBBD

Sky Blue · DarkGray · Lake Green

HEX
#A3BBBD
RGB
rgb(163, 187, 189)
HSL
hsl(185, 16%, 69%)
HSB
hsb(185, 14%, 74%)
CMYK
cmyk(14%, 1%, 0%, 26%)
Oklch
oklch(77.5% 0.026 202.8)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

#CFCAC6

Apricot · LightGray · Pearl Gray

HEX
#CFCAC6
RGB
rgb(207, 202, 198)
HSL
hsl(27, 9%, 79%)
HSB
hsb(27, 4%, 81%)
CMYK
cmyk(0%, 2%, 4%, 19%)
Oklch
oklch(84.2% 0.008 61.4)

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

#CCA2A3

Peach Pink · Tan · Coral Red

HEX
#CCA2A3
RGB
rgb(204, 162, 163)
HSL
hsl(359, 29%, 72%)
HSB
hsb(359, 21%, 80%)
CMYK
cmyk(0%, 21%, 20%, 20%)
Oklch
oklch(75.1% 0.050 16.7)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#8A7770

Tangerine · Gray · Amber Brown

HEX
#8A7770
RGB
rgb(138, 119, 112)
HSL
hsl(16, 10%, 49%)
HSB
hsb(16, 19%, 54%)
CMYK
cmyk(0%, 14%, 19%, 46%)
Oklch
oklch(58.5% 0.026 41.3)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#D1C1B2

Apricot · Silver · Peach Orange

HEX
#D1C1B2
RGB
rgb(209, 193, 178)
HSL
hsl(29, 25%, 76%)
HSB
hsb(29, 15%, 82%)
CMYK
cmyk(0%, 8%, 15%, 18%)
Oklch
oklch(82.0% 0.027 65.6)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A3BBBD
BDA5A3

Analogous

A3BDB2
A3BBBD
A3AEBD

Triadic

A3BBBD
BDA3BA
BABDA3

Split-Comp.

A3BBBD
BDA3AE
BDB2A3

Tetradic

A3BBBD
B2A3BD
BDA5A3
AEBDA3

Contrast Matrix WCAG 2.1 Contrast

A3BBBD
CFCAC6
CCA2A3
8A7770
D1C1B2
—
1.2
Fail
1.1
Fail
2.1
Fail
1.2
Fail
1.2
Fail
—
1.4
Fail
2.6
Fail
1.1
Fail
1.1
Fail
1.4
Fail
—
1.9
Fail
1.3
Fail
2.1
Fail
2.6
Fail
1.9
Fail
—
2.4
Fail
1.2
Fail
1.1
Fail
1.3
Fail
2.4
Fail
—
White BG
2.0Fail
1.6Fail
2.3Fail
4.2AA Large
1.8Fail
Black BG
10.4AAA
12.9AAA
9.3AAA
5.0AA
12.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

ADAEBD
CDCDC7
BAB9A3
828272
CACAB6

Deuteranopia

ACAABC
CDCDC7
BCBFA3
838472
CBCCB7

Tritanopia

A4BCBC
CFC8C8
CAA3A3
897373
D0B8B9

Achromatopsia

B4B4B4
CBCBCB
AFAFAF
7C7C7C
C4C4C4

Shades & Tints Shades & Tints

#A3BBBD

Dark
Light

#CFCAC6

Dark
Light

#CCA2A3

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a3bbbd;
  --color-2: #cfcac6;
  --color-3: #cca2a3;
  --color-4: #8a7770;
  --color-5: #d1c1b2;
}

SCSS

$color-1: #a3bbbd;
$color-2: #cfcac6;
$color-3: #cca2a3;
$color-4: #8a7770;
$color-5: #d1c1b2;

TAILWIND

colors: {
  'brand-1': '#a3bbbd',
  'brand-2': '#cfcac6',
  'brand-3': '#cca2a3',
  'brand-4': '#8a7770',
  'brand-5': '#d1c1b2',
}

RGB Array

[163, 187, 189], [207, 202, 198], [204, 162, 163], [138, 119, 112], [209, 193, 178]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A3BBBD, #CFCAC6, #CCA2A3, #8A7770, #D1C1B2 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: #a3bbbd; --color-2: #cfcac6; --color-3: #cca2a3; --color-4: #8a7770; --color-5: #d1c1b2. 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