← Back to Editor

#AFBABC · #BAC6B0 · #C4D2A4 · #D1D0A0 · #DECD9B

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

#AFBABC

Sky Blue · Silver · Pearl Gray

HEX
#AFBABC
RGB
rgb(175, 186, 188)
HSL
hsl(189, 9%, 71%)
HSB
hsb(189, 7%, 74%)
CMYK
cmyk(7%, 1%, 0%, 26%)
Oklch
oklch(78.1% 0.013 209.8)

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

#BAC6B0

Celadon · Silver · Apple Green

HEX
#BAC6B0
RGB
rgb(186, 198, 176)
HSL
hsl(93, 16%, 73%)
HSB
hsb(93, 11%, 78%)
CMYK
cmyk(6%, 0%, 11%, 22%)
Oklch
oklch(81.1% 0.033 130.7)

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

#C4D2A4

Willow Green · Silver · Apple Green

HEX
#C4D2A4
RGB
rgb(196, 210, 164)
HSL
hsl(78, 34%, 73%)
HSB
hsb(78, 22%, 82%)
CMYK
cmyk(7%, 0%, 22%, 18%)
Oklch
oklch(84.1% 0.064 121.5)

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

#D1D0A0

Fresh Green · Tan · Sunflower

HEX
#D1D0A0
RGB
rgb(209, 208, 160)
HSL
hsl(59, 35%, 72%)
HSB
hsb(59, 23%, 82%)
CMYK
cmyk(0%, 0%, 23%, 18%)
Oklch
oklch(84.6% 0.064 106.7)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#DECD9B

Goose Yellow · BurlyWood · Sunflower

HEX
#DECD9B
RGB
rgb(222, 205, 155)
HSL
hsl(45, 50%, 74%)
HSB
hsb(45, 30%, 87%)
CMYK
cmyk(0%, 8%, 30%, 13%)
Oklch
oklch(85.0% 0.068 91.5)

Traditional「Goose Yellow」· Paint「Sunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

AFBABC
BCB0AE

Analogous

AEBCB7
AFBABC
AEB3BC

Triadic

AFBABC
BCAEBA
BABCAE

Split-Comp.

AFBABC
BCAEB3
BCB7AE

Tetradic

AFBABC
B7AEBC
BCB0AE
B3BCAE

Contrast Matrix WCAG 2.1 Contrast

AFBABC
BAC6B0
C4D2A4
D1D0A0
DECD9B
—
1.1
Fail
1.2
Fail
1.3
Fail
1.3
Fail
1.1
Fail
—
1.1
Fail
1.1
Fail
1.1
Fail
1.2
Fail
1.1
Fail
—
1.0
Fail
1.0
Fail
1.3
Fail
1.1
Fail
1.0
Fail
—
1.0
Fail
1.3
Fail
1.1
Fail
1.0
Fail
1.0
Fail
—
White BG
2.0Fail
1.8Fail
1.6Fail
1.6Fail
1.6Fail
Black BG
10.6AAA
11.8AAA
13.1AAA
13.2AAA
13.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B4B4BC
BFBFB5
CACAAF
D1D1AC
D7D6A7

Deuteranopia

B3B2BB
BFBEB7
C9C8B2
D1D1AE
D8D9AA

Tritanopia

B0BBBB
BBBABA
C5B8BA
D1B5B7
DDB1B3

Achromatopsia

B7B7B7
C0C0C0
C9C9C9
CBCBCB
CCCCCC

Shades & Tints Shades & Tints

#AFBABC

Dark
Light

#BAC6B0

Dark
Light

#C4D2A4

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #afbabc;
  --color-2: #bac6b0;
  --color-3: #c4d2a4;
  --color-4: #d1d0a0;
  --color-5: #decd9b;
}

SCSS

$color-1: #afbabc;
$color-2: #bac6b0;
$color-3: #c4d2a4;
$color-4: #d1d0a0;
$color-5: #decd9b;

TAILWIND

colors: {
  'brand-1': '#afbabc',
  'brand-2': '#bac6b0',
  'brand-3': '#c4d2a4',
  'brand-4': '#d1d0a0',
  'brand-5': '#decd9b',
}

RGB Array

[175, 186, 188], [186, 198, 176], [196, 210, 164], [209, 208, 160], [222, 205, 155]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #AFBABC, #BAC6B0, #C4D2A4, #D1D0A0, #DECD9B 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: #afbabc; --color-2: #bac6b0; --color-3: #c4d2a4; --color-4: #d1d0a0; --color-5: #decd9b. 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