← Back to Editor

#CBE1F9 · #C3C6F3 · #D4B2C3 · #F1C1B5 · #F4DFC2

earth

A 5-color earth 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

#CBE1F9

Azure · Lavender · Sky Blue

HEX
#CBE1F9
RGB
rgb(203, 225, 249)
HSL
hsl(211, 79%, 89%)
HSB
hsb(211, 18%, 98%)
CMYK
cmyk(18%, 10%, 0%, 2%)
Oklch
oklch(90.1% 0.041 250.6)

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

#C3C6F3

Azure · LightSteelBlue · Sky Blue

HEX
#C3C6F3
RGB
rgb(195, 198, 243)
HSL
hsl(236, 67%, 86%)
HSB
hsb(236, 20%, 95%)
CMYK
cmyk(20%, 19%, 0%, 5%)
Oklch
oklch(83.9% 0.063 282.0)

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

#D4B2C3

Rouge · Silver · Cherry Blossom

HEX
#D4B2C3
RGB
rgb(212, 178, 195)
HSL
hsl(330, 28%, 76%)
HSB
hsb(330, 16%, 83%)
CMYK
cmyk(0%, 16%, 8%, 17%)
Oklch
oklch(79.8% 0.045 346.6)

Traditional「Rouge」· Paint「Cherry Blossom」· Creative Rose Petal

#F1C1B5

Peach Pink · LightPink · Cherry Blossom

HEX
#F1C1B5
RGB
rgb(241, 193, 181)
HSL
hsl(12, 68%, 83%)
HSB
hsb(12, 25%, 95%)
CMYK
cmyk(0%, 20%, 25%, 5%)
Oklch
oklch(85.0% 0.058 34.4)

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

#F4DFC2

Goose Yellow · Bisque · Peach Orange

HEX
#F4DFC2
RGB
rgb(244, 223, 194)
HSL
hsl(35, 69%, 86%)
HSB
hsb(35, 20%, 96%)
CMYK
cmyk(0%, 9%, 20%, 4%)
Oklch
oklch(91.3% 0.045 76.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CBE1F9
F9E4CD

Analogous

CDF8F9
CBE1F9
CECDF9

Triadic

CBE1F9
F9CDE2
E2F9CD

Split-Comp.

CBE1F9
F9CECD
F8F9CD

Tetradic

CBE1F9
F9CDF8
F9E4CD
CDF9CE

Contrast Matrix WCAG 2.1 Contrast

CBE1F9
C3C6F3
D4B2C3
F1C1B5
F4DFC2
—
1.2
Fail
1.4
Fail
1.2
Fail
1.0
Fail
1.2
Fail
—
1.2
Fail
1.0
Fail
1.3
Fail
1.4
Fail
1.2
Fail
—
1.2
Fail
1.5
Fail
1.2
Fail
1.0
Fail
1.2
Fail
—
1.2
Fail
1.0
Fail
1.3
Fail
1.5
Fail
1.2
Fail
—
White BG
1.3Fail
1.7Fail
1.9Fail
1.6Fail
1.3Fail
Black BG
15.7AAA
12.7AAA
11.0AAA
13.0AAA
16.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D5D5F3
C4C4E8
C5C5BF
DCDCB8
EBEBC9

Deuteranopia

D3D2F2
C4C4E6
C7CABE
DFE3B9
ECEECB

Tritanopia

CCEFEE
C3E0DE
D2BCBB
EFBABB
F3CFD0

Achromatopsia

DDDDDD
CACACA
BEBEBE
CECECE
E2E2E2

Shades & Tints Shades & Tints

#CBE1F9

Dark
Light

#C3C6F3

Dark
Light

#D4B2C3

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cbe1f9;
  --color-2: #c3c6f3;
  --color-3: #d4b2c3;
  --color-4: #f1c1b5;
  --color-5: #f4dfc2;
}

SCSS

$color-1: #cbe1f9;
$color-2: #c3c6f3;
$color-3: #d4b2c3;
$color-4: #f1c1b5;
$color-5: #f4dfc2;

TAILWIND

colors: {
  'brand-1': '#cbe1f9',
  'brand-2': '#c3c6f3',
  'brand-3': '#d4b2c3',
  'brand-4': '#f1c1b5',
  'brand-5': '#f4dfc2',
}

RGB Array

[203, 225, 249], [195, 198, 243], [212, 178, 195], [241, 193, 181], [244, 223, 194]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This earth-style palette of #CBE1F9, #C3C6F3, #D4B2C3, #F1C1B5, #F4DFC2 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: #cbe1f9; --color-2: #c3c6f3; --color-3: #d4b2c3; --color-4: #f1c1b5; --color-5: #f4dfc2. 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 earth-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