← Back to Editor

#F8F5EF · #F1E9E6 · #E6D8DC · #D9CBD8 · #C4BCCD

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

#F8F5EF

Goose Yellow · SeaShell · Lemon Cream

HEX
#F8F5EF
RGB
rgb(248, 245, 239)
HSL
hsl(40, 39%, 95%)
HSB
hsb(40, 4%, 97%)
CMYK
cmyk(0%, 1%, 4%, 3%)
Oklch
oklch(97.1% 0.009 84.6)

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

#F1E9E6

Apricot · Linen · Peach Orange

HEX
#F1E9E6
RGB
rgb(241, 233, 230)
HSL
hsl(16, 28%, 92%)
HSB
hsb(16, 5%, 95%)
CMYK
cmyk(0%, 3%, 5%, 5%)
Oklch
oklch(93.9% 0.010 41.9)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#E6D8DC

Rouge · LightGray · Cherry Blossom

HEX
#E6D8DC
RGB
rgb(230, 216, 220)
HSL
hsl(343, 22%, 87%)
HSB
hsb(343, 6%, 90%)
CMYK
cmyk(0%, 6%, 4%, 10%)
Oklch
oklch(89.5% 0.016 358.1)

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

#D9CBD8

Mauve · LightGray · Lavender

HEX
#D9CBD8
RGB
rgb(217, 203, 216)
HSL
hsl(304, 16%, 82%)
HSB
hsb(304, 6%, 85%)
CMYK
cmyk(0%, 6%, 0%, 15%)
Oklch
oklch(85.7% 0.023 328.0)

Traditional「Mauve」· Paint「Lavender」· Creative Rose Petal

#C4BCCD

Wisteria · Silver · Lilac Purple

HEX
#C4BCCD
RGB
rgb(196, 188, 205)
HSL
hsl(268, 15%, 77%)
HSB
hsb(268, 8%, 80%)
CMYK
cmyk(4%, 8%, 0%, 20%)
Oklch
oklch(80.7% 0.025 306.9)

Traditional「Wisteria」· Paint「Lilac Purple」· Creative Lavender Dream

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F8F5EF
EDF1F7

Analogous

F7EFED
F8F5EF
F6F7ED

Triadic

F8F5EF
EDF7F4
F4EDF7

Split-Comp.

F8F5EF
EDF6F7
EFEDF7

Tetradic

F8F5EF
EDF7EF
EDF1F7
F7EDF6

Contrast Matrix WCAG 2.1 Contrast

F8F5EF
F1E9E6
E6D8DC
D9CBD8
C4BCCD
—
1.1
Fail
1.3
Fail
1.4
Fail
1.7
Fail
1.1
Fail
—
1.2
Fail
1.3
Fail
1.5
Fail
1.3
Fail
1.2
Fail
—
1.1
Fail
1.3
Fail
1.4
Fail
1.3
Fail
1.1
Fail
—
1.2
Fail
1.7
Fail
1.5
Fail
1.3
Fail
1.2
Fail
—
White BG
1.1Fail
1.2Fail
1.4Fail
1.6Fail
1.8Fail
Black BG
19.3AAA
17.5AAA
15.2AAA
13.5AAA
11.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F7F7F0
EEEDE7
E0E0DB
D3D3D5
C1C0C9

Deuteranopia

F7F7F1
EEEFE7
E1E2DB
D4D5D4
C1C2C8

Tritanopia

F8F2F2
F1E7E7
E5DADA
D8D2D2
C4C6C5

Achromatopsia

F5F5F5
EBEBEB
DDDDDD
D1D1D1
C0C0C0

Shades & Tints Shades & Tints

#F8F5EF

Dark
Light

#F1E9E6

Dark
Light

#E6D8DC

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f8f5ef;
  --color-2: #f1e9e6;
  --color-3: #e6d8dc;
  --color-4: #d9cbd8;
  --color-5: #c4bccd;
}

SCSS

$color-1: #f8f5ef;
$color-2: #f1e9e6;
$color-3: #e6d8dc;
$color-4: #d9cbd8;
$color-5: #c4bccd;

TAILWIND

colors: {
  'brand-1': '#f8f5ef',
  'brand-2': '#f1e9e6',
  'brand-3': '#e6d8dc',
  'brand-4': '#d9cbd8',
  'brand-5': '#c4bccd',
}

RGB Array

[248, 245, 239], [241, 233, 230], [230, 216, 220], [217, 203, 216], [196, 188, 205]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F8F5EF, #F1E9E6, #E6D8DC, #D9CBD8, #C4BCCD is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #f8f5ef; --color-2: #f1e9e6; --color-3: #e6d8dc; --color-4: #d9cbd8; --color-5: #c4bccd. 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 beauty, lifestyle, arts industries. Restrained colors convey professionalism and trust. 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