← Back to Editor

#A2F2DA · #9883C7 · #CCCDD1 · #C2CEFF · #FCEEDB

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#A2F2DA

Jade · LightBlue · Glacier Blue

HEX
#A2F2DA
RGB
rgb(162, 242, 218)
HSL
hsl(162, 75%, 79%)
HSB
hsb(162, 33%, 95%)
CMYK
cmyk(33%, 0%, 10%, 5%)
Oklch
oklch(90.3% 0.085 173.5)

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

#9883C7

Wisteria · DarkGray · Cobalt Blue

HEX
#9883C7
RGB
rgb(152, 131, 199)
HSL
hsl(259, 38%, 65%)
HSB
hsb(259, 34%, 78%)
CMYK
cmyk(24%, 34%, 0%, 22%)
Oklch
oklch(65.5% 0.102 297.7)

Traditional「Wisteria」· Paint「Cobalt Blue」· Creative Lavender Dream

#CCCDD1

Silver Gray · LightGray · Pearl Gray

HEX
#CCCDD1
RGB
rgb(204, 205, 209)
HSL
hsl(228, 5%, 81%)
HSB
hsb(228, 2%, 82%)
CMYK
cmyk(2%, 2%, 0%, 18%)
Oklch
oklch(84.9% 0.006 275.0)

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

#C2CEFF

Azure · LightBlue · Sky Blue

HEX
#C2CEFF
RGB
rgb(194, 206, 255)
HSL
hsl(228, 100%, 88%)
HSB
hsb(228, 24%, 100%)
CMYK
cmyk(24%, 19%, 0%, 0%)
Oklch
oklch(85.9% 0.070 274.1)

Traditional「Azure」· Paint「Sky Blue」· Creative Twilight Haze

#FCEEDB

Goose Yellow · Beige · Peach Orange

HEX
#FCEEDB
RGB
rgb(252, 238, 219)
HSL
hsl(35, 85%, 92%)
HSB
hsb(35, 13%, 99%)
CMYK
cmyk(0%, 6%, 13%, 1%)
Oklch
oklch(95.5% 0.029 75.7)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A2F2DA
F2A1B9

Analogous

A1F2B1
A2F2DA
A1E2F2

Triadic

A2F2DA
DAA1F2
F2DAA1

Split-Comp.

A2F2DA
F2A1E2
F2B1A1

Tetradic

A2F2DA
B1A1F2
F2A1B9
E2F2A1

Contrast Matrix WCAG 2.1 Contrast

A2F2DA
9883C7
CCCDD1
C2CEFF
FCEEDB
—
2.5
Fail
1.2
Fail
1.2
Fail
1.1
Fail
2.5
Fail
—
2.1
Fail
2.1
Fail
2.9
Fail
1.2
Fail
2.1
Fail
—
1.0
Fail
1.4
Fail
1.2
Fail
2.1
Fail
1.0
Fail
—
1.4
Fail
1.1
Fail
2.9
Fail
1.4
Fail
1.4
Fail
—
White BG
1.3Fail
3.3AA Large
1.6Fail
1.5Fail
1.1Fail
Black BG
16.2AAA
6.4AA
13.2AAA
13.6AAA
18.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C5C5E0
8F8FB7
CCCCD0
C7C7F3
F6F6E0

Deuteranopia

C0BAE1
9092B3
CCCCD0
C7C6F0
F7F8E1

Tritanopia

A6E4E5
97AAA7
CCCFCF
C3EAE8
FBE3E4

Achromatopsia

D7D7D7
919191
CDCDCD
D0D0D0
F0F0F0

Shades & Tints Shades & Tints

#A2F2DA

Dark
Light

#9883C7

Dark
Light

#CCCDD1

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a2f2da;
  --color-2: #9883c7;
  --color-3: #cccdd1;
  --color-4: #c2ceff;
  --color-5: #fceedb;
}

SCSS

$color-1: #a2f2da;
$color-2: #9883c7;
$color-3: #cccdd1;
$color-4: #c2ceff;
$color-5: #fceedb;

TAILWIND

colors: {
  'brand-1': '#a2f2da',
  'brand-2': '#9883c7',
  'brand-3': '#cccdd1',
  'brand-4': '#c2ceff',
  'brand-5': '#fceedb',
}

RGB Array

[162, 242, 218], [152, 131, 199], [204, 205, 209], [194, 206, 255], [252, 238, 219]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A2F2DA, #9883C7, #CCCDD1, #C2CEFF, #FCEEDB is ideal for: social media posters, mobile apps, e-commerce promos, health products, baby brands, fresh-style blogs. Vivid colors effectively attract user attention. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #a2f2da; --color-2: #9883c7; --color-3: #cccdd1; --color-4: #c2ceff; --color-5: #fceedb. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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