← Back to Editor

#FAFAEE · #C5CEDC · #CAB8D4 · #CC9CC3 · #F5F1EE

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

#FAFAEE

Fresh Green · SeaShell · Lemon Cream

HEX
#FAFAEE
RGB
rgb(250, 250, 238)
HSL
hsl(60, 55%, 96%)
HSB
hsb(60, 5%, 98%)
CMYK
cmyk(0%, 0%, 5%, 2%)
Oklch
oklch(98.2% 0.016 106.7)

TraditionalFresh Green」· PaintLemon Cream」· Creative Lemon Fizz

#C5CEDC

Azure · LightGray · Sky Blue

HEX
#C5CEDC
RGB
rgb(197, 206, 220)
HSL
hsl(217, 25%, 82%)
HSB
hsb(217, 10%, 86%)
CMYK
cmyk(10%, 6%, 0%, 14%)
Oklch
oklch(84.9% 0.022 259.2)

TraditionalAzure」· PaintSky Blue」· Creative Twilight Haze

#CAB8D4

Lilac · Silver · Lilac Purple

HEX
#CAB8D4
RGB
rgb(202, 184, 212)
HSL
hsl(279, 25%, 78%)
HSB
hsb(279, 13%, 83%)
CMYK
cmyk(5%, 13%, 0%, 17%)
Oklch
oklch(80.6% 0.043 313.6)

TraditionalLilac」· PaintLilac Purple」· Creative Lavender Dream

#CC9CC3

Mauve · Silver · Lilac Purple

HEX
#CC9CC3
RGB
rgb(204, 156, 195)
HSL
hsl(311, 32%, 71%)
HSB
hsb(311, 24%, 80%)
CMYK
cmyk(0%, 24%, 4%, 20%)
Oklch
oklch(75.0% 0.077 333.0)

TraditionalMauve」· PaintLilac Purple」· Creative Rose Petal

#F5F1EE

Apricot · Linen · Peach Orange

HEX
#F5F1EE
RGB
rgb(245, 241, 238)
HSL
hsl(26, 26%, 95%)
HSB
hsb(26, 3%, 96%)
CMYK
cmyk(0%, 2%, 3%, 4%)
Oklch
oklch(96.0% 0.006 59.7)

TraditionalApricot」· PaintPeach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FAFAEE
EFEFFA

Analogous

FAF5EF
FAFAEE
F5FAEF

Triadic

FAFAEE
EFFAFA
FAEFFA

Split-Comp.

FAFAEE
EFF5FA
F5EFFA

Tetradic

FAFAEE
EFFAF5
EFEFFA
FAEFF5

Contrast Matrix WCAG 2.1 Contrast

FAFAEE
C5CEDC
CAB8D4
CC9CC3
F5F1EE
1.5
Fail
1.8
Fail
2.2
Fail
1.1
Fail
1.5
Fail
1.2
Fail
1.5
Fail
1.4
Fail
1.8
Fail
1.2
Fail
1.2
Fail
1.7
Fail
2.2
Fail
1.5
Fail
1.2
Fail
2.1
Fail
1.1
Fail
1.4
Fail
1.7
Fail
2.1
Fail
White BG
1.1Fail
1.6Fail
1.9Fail
2.3Fail
1.1Fail
Black BG
20.0AAA
13.2AAA
11.3AAA
9.1AAA
18.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

FAFAF1
C9C9D9
C2C2CD
B7B7BA
F3F3EF

Deuteranopia

FAFAF2
C8C8D8
C3C5CC
BABEB7
F4F4EF

Tritanopia

FAF3F4
C5D6D5
C9C8C7
CAB2B0
F5EFEF

Achromatopsia

F9F9F9
CDCDCD
C1C1C1
AFAFAF
F2F2F2

Shades & Tints Shades & Tints

#FAFAEE

Dark
Light

#C5CEDC

Dark
Light

#CAB8D4

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fafaee;
  --color-2: #c5cedc;
  --color-3: #cab8d4;
  --color-4: #cc9cc3;
  --color-5: #f5f1ee;
}

SCSS

$color-1: #fafaee;
$color-2: #c5cedc;
$color-3: #cab8d4;
$color-4: #cc9cc3;
$color-5: #f5f1ee;

TAILWIND

colors: {
  'brand-1': '#fafaee',
  'brand-2': '#c5cedc',
  'brand-3': '#cab8d4',
  'brand-4': '#cc9cc3',
  'brand-5': '#f5f1ee',
}

RGB Array

[250, 250, 238], [197, 206, 220], [202, 184, 212], [204, 156, 195], [245, 241, 238]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FAFAEE, #C5CEDC, #CAB8D4, #CC9CC3, #F5F1EE 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: #fafaee; --color-2: #c5cedc; --color-3: #cab8d4; --color-4: #cc9cc3; --color-5: #f5f1ee. 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