#F1E1C2 + #CFCEA8 + #9BA1CE + #A1CAD8 + #A0E5EB - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F1E1C2

Goose Yellow · Bisque · Lemon Cream

HEX

#F1E1C2

RGB

rgb(241, 225, 194)

HSL

hsl(40, 63%, 85%)

HSB

hsb(40, 20%, 95%)

CMYK

cmyk(0%, 7%, 20%, 5%)

Oklch

oklch(91.5% 0.044 83.9)

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

#CFCEA8

Fresh Green · Silver · Sunflower

HEX

#CFCEA8

RGB

rgb(207, 206, 168)

HSL

hsl(58, 29%, 74%)

HSB

hsb(58, 19%, 81%)

CMYK

cmyk(0%, 0%, 19%, 19%)

Oklch

oklch(84.2% 0.051 106.2)

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

#9BA1CE

Azure · DarkGray · Cobalt Blue

HEX

#9BA1CE

RGB

rgb(155, 161, 206)

HSL

hsl(233, 34%, 71%)

HSB

hsb(233, 25%, 81%)

CMYK

cmyk(25%, 22%, 0%, 19%)

Oklch

oklch(72.0% 0.066 278.7)

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

#A1CAD8

Sky Blue · LightSteelBlue · Lake Green

HEX

#A1CAD8

RGB

rgb(161, 202, 216)

HSL

hsl(195, 41%, 74%)

HSB

hsb(195, 25%, 85%)

CMYK

cmyk(25%, 6%, 0%, 15%)

Oklch

oklch(81.4% 0.048 220.7)

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

#A0E5EB

Sky Blue · LightBlue · Glacier Blue

HEX

#A0E5EB

RGB

rgb(160, 229, 235)

HSL

hsl(185, 65%, 77%)

HSB

hsb(185, 32%, 92%)

CMYK

cmyk(32%, 3%, 0%, 8%)

Oklch

oklch(87.8% 0.069 202.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F1E1C2

C1D1F1

Analogous

F1C9C1

F1E1C2

E9F1C1

Triadic

F1E1C2

C1F1E1

E1C1F1

Split-Comp.

F1E1C2

C1E9F1

C9C1F1

Tetradic

F1E1C2

C1F1C9

C1D1F1

F1C1E9

Contrast Matrix WCAG 2.1 Contrast

F1E1C2	CFCEA8	9BA1CE	A1CAD8	A0E5EB
—	1.2 Fail	1.9 Fail	1.4 Fail	1.1 Fail
1.2 Fail	—	1.6 Fail	1.1 Fail	1.1 Fail
1.9 Fail	1.6 Fail	—	1.4 Fail	1.8 Fail
1.4 Fail	1.1 Fail	1.4 Fail	—	1.2 Fail
1.1 Fail	1.1 Fail	1.8 Fail	1.2 Fail	—

White BG

1.3Fail

1.6Fail

2.5Fail

1.8Fail

1.4Fail

Black BG

16.3AAA

13.0AAA

8.4AAA

12.0AAA

14.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

EAEACA

CFCFB1

9E9EC3

B3B3D5

BEBEEA

Deuteranopia

EBECCB

CFCFB3

9D9DC1

B0ADD4

BAB5E9

Tritanopia

F0CFD1

CFB8BA

9BBBB9

A3D2D1

A3E8E8

Achromatopsia

E2E2E2

CACACA

A4A4A4

BFBFBF

D1D1D1

Shades & Tints Shades & Tints

#F1E1C2

Dark

Light

#CFCEA8

Dark

Light

#9BA1CE

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f1e1c2;
  --color-2: #cfcea8;
  --color-3: #9ba1ce;
  --color-4: #a1cad8;
  --color-5: #a0e5eb;
}

SCSS

$color-1: #f1e1c2;
$color-2: #cfcea8;
$color-3: #9ba1ce;
$color-4: #a1cad8;
$color-5: #a0e5eb;

TAILWIND

colors: {
  'brand-1': '#f1e1c2',
  'brand-2': '#cfcea8',
  'brand-3': '#9ba1ce',
  'brand-4': '#a1cad8',
  'brand-5': '#a0e5eb',
}

RGB Array

[241, 225, 194], [207, 206, 168], [155, 161, 206], [161, 202, 216], [160, 229, 235]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F1E1C2, #CFCEA8, #9BA1CE, #A1CAD8, #A0E5EB 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: #f1e1c2; --color-2: #cfcea8; --color-3: #9ba1ce; --color-4: #a1cad8; --color-5: #a0e5eb. 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