#A3E8E1 + #CAD0BE + #A8B6B4 + #EDC5C1 + #FCB5B2 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#A3E8E1

Jade · LightBlue · Glacier Blue

HEX

#A3E8E1

RGB

rgb(163, 232, 225)

HSL

hsl(174, 60%, 77%)

HSB

hsb(174, 30%, 91%)

CMYK

cmyk(30%, 0%, 3%, 9%)

Oklch

oklch(88.3% 0.070 188.1)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

#CAD0BE

Willow Green · Silver · Apple Green

HEX

#CAD0BE

RGB

rgb(202, 208, 190)

HSL

hsl(80, 16%, 78%)

HSB

hsb(80, 9%, 82%)

CMYK

cmyk(3%, 0%, 9%, 18%)

Oklch

oklch(84.8% 0.025 122.0)

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

#A8B6B4

Jade · DarkGray · Silver Sand

HEX

#A8B6B4

RGB

rgb(168, 182, 180)

HSL

hsl(171, 9%, 69%)

HSB

hsb(171, 8%, 71%)

CMYK

cmyk(8%, 0%, 1%, 29%)

Oklch

oklch(76.5% 0.016 186.6)

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

#EDC5C1

Peach Pink · Pink · Cherry Blossom

HEX

#EDC5C1

RGB

rgb(237, 197, 193)

HSL

hsl(5, 55%, 84%)

HSB

hsb(5, 19%, 93%)

CMYK

cmyk(0%, 17%, 19%, 7%)

Oklch

oklch(85.7% 0.046 24.8)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Blush Sunrise

#FCB5B2

Peach Pink · LightPink · Cherry Blossom

HEX

#FCB5B2

RGB

rgb(252, 181, 178)

HSL

hsl(2, 93%, 84%)

HSB

hsb(2, 29%, 99%)

CMYK

cmyk(0%, 28%, 29%, 1%)

Oklch

oklch(83.9% 0.083 21.7)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A3E8E1

E8A1A8

Analogous

A1E8BD

A3E8E1

A1CBE8

Triadic

A3E8E1

E1A1E8

E8E1A1

Split-Comp.

A3E8E1

E8A1CB

E8BDA1

Tetradic

A3E8E1

BDA1E8

E8A1A8

CBE8A1

Contrast Matrix WCAG 2.1 Contrast

A3E8E1	CAD0BE	A8B6B4	EDC5C1	FCB5B2
—	1.1 Fail	1.5 Fail	1.1 Fail	1.2 Fail
1.1 Fail	—	1.3 Fail	1.0 Fail	1.1 Fail
1.5 Fail	1.3 Fail	—	1.3 Fail	1.2 Fail
1.1 Fail	1.0 Fail	1.3 Fail	—	1.1 Fail
1.2 Fail	1.1 Fail	1.2 Fail	1.1 Fail	—

White BG

1.4Fail

1.6Fail

2.1Fail

1.6Fail

1.7Fail

Black BG

15.2AAA

13.3AAA

10.0AAA

13.4AAA

12.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C1C1E3

CDCDC2

AEAEB4

DCDBC2

DDDDB3

Deuteranopia

BDB8E3

CCCCC3

ADACB5

DEE1C2

E1E7B3

Tritanopia

A6E4E4

CAC6C7

A9B5B5

EBC3C3

F8B3B3

Achromatopsia

D3D3D3

CCCCCC

B2B2B2

D1D1D1

CACACA

Shades & Tints Shades & Tints

#A3E8E1

Dark

Light

#CAD0BE

Dark

Light

#A8B6B4

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a3e8e1;
  --color-2: #cad0be;
  --color-3: #a8b6b4;
  --color-4: #edc5c1;
  --color-5: #fcb5b2;
}

SCSS

$color-1: #a3e8e1;
$color-2: #cad0be;
$color-3: #a8b6b4;
$color-4: #edc5c1;
$color-5: #fcb5b2;

TAILWIND

colors: {
  'brand-1': '#a3e8e1',
  'brand-2': '#cad0be',
  'brand-3': '#a8b6b4',
  'brand-4': '#edc5c1',
  'brand-5': '#fcb5b2',
}

RGB Array

[163, 232, 225], [202, 208, 190], [168, 182, 180], [237, 197, 193], [252, 181, 178]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A3E8E1, #CAD0BE, #A8B6B4, #EDC5C1, #FCB5B2 is ideal for: health products, baby brands, fresh-style blogs. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #a3e8e1; --color-2: #cad0be; --color-3: #a8b6b4; --color-4: #edc5c1; --color-5: #fcb5b2. 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 tech, SaaS, healthcare, eco industries. 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