← Back to Editor

#F9EBF2 · #F3E2E8 · #FCD7DA · #F58F9A · #3C363B

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#F9EBF2

Rouge · SeaShell · Cherry Blossom

HEX
#F9EBF2
RGB
rgb(249, 235, 242)
HSL
hsl(330, 54%, 95%)
HSB
hsb(330, 6%, 98%)
CMYK
cmyk(0%, 6%, 3%, 2%)
Oklch
oklch(95.3% 0.018 345.6)

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

#F3E2E8

Rouge · Linen · Cherry Blossom

HEX
#F3E2E8
RGB
rgb(243, 226, 232)
HSL
hsl(339, 41%, 92%)
HSB
hsb(339, 7%, 95%)
CMYK
cmyk(0%, 7%, 5%, 5%)
Oklch
oklch(92.8% 0.020 354.0)

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

#FCD7DA

Peach Pink · Bisque · Cherry Blossom

HEX
#FCD7DA
RGB
rgb(252, 215, 218)
HSL
hsl(355, 86%, 92%)
HSB
hsb(355, 15%, 99%)
CMYK
cmyk(0%, 15%, 13%, 1%)
Oklch
oklch(91.1% 0.041 12.4)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Rose Petal

#F58F9A

Peach Pink · LightCoral · Coral Red

HEX
#F58F9A
RGB
rgb(245, 143, 154)
HSL
hsl(354, 84%, 76%)
HSB
hsb(354, 42%, 96%)
CMYK
cmyk(0%, 42%, 37%, 4%)
Oklch
oklch(76.1% 0.124 13.5)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#3C363B

Dark Cyan · DarkSlateGray · Dark Stone

HEX
#3C363B
RGB
rgb(60, 54, 59)
HSL
hsl(310, 5%, 22%)
HSB
hsb(310, 10%, 24%)
CMYK
cmyk(0%, 10%, 2%, 76%)
Oklch
oklch(34.1% 0.012 331.3)

Traditional「Dark Cyan」· Paint「Dark Stone」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F9EBF2
EBF9F2

Analogous

F9EBF9
F9EBF2
F9EBEB

Triadic

F9EBF2
F2F9EB
EBF2F9

Split-Comp.

F9EBF2
EBF9EB
EBF9F9

Tetradic

F9EBF2
F9F9EB
EBF9F2
EBEBF9

Contrast Matrix WCAG 2.1 Contrast

F9EBF2
F3E2E8
FCD7DA
F58F9A
3C363B
—
1.1
Fail
1.1
Fail
2.0
Fail
10.2
AAA
1.1
Fail
—
1.1
Fail
1.8
Fail
9.5
AAA
1.1
Fail
1.1
Fail
—
1.7
Fail
8.9
AAA
2.0
Fail
1.8
Fail
1.7
Fail
—
5.2
AA
10.2
AAA
9.5
AAA
8.9
AAA
5.2
AA
—
White BG
1.2Fail
1.2Fail
1.3Fail
2.3Fail
11.8AAA
Black BG
18.2AAA
16.9AAA
15.9AAA
9.3AAA
1.8Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

F3F3F0
ECEBE7
ECECD9
C9C897
39393A

Deuteranopia

F4F5F0
EDEEE6
EEF1D9
CFD697
3A3A3A

Tritanopia

F8EFEF
F2E5E5
FAD9D9
F09595
3C3939

Achromatopsia

F0F0F0
E8E8E8
E2E2E2
AFAFAF
383838

Shades & Tints Shades & Tints

#F9EBF2

Dark
Light

#F3E2E8

Dark
Light

#FCD7DA

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f9ebf2;
  --color-2: #f3e2e8;
  --color-3: #fcd7da;
  --color-4: #f58f9a;
  --color-5: #3c363b;
}

SCSS

$color-1: #f9ebf2;
$color-2: #f3e2e8;
$color-3: #fcd7da;
$color-4: #f58f9a;
$color-5: #3c363b;

TAILWIND

colors: {
  'brand-1': '#f9ebf2',
  'brand-2': '#f3e2e8',
  'brand-3': '#fcd7da',
  'brand-4': '#f58f9a',
  'brand-5': '#3c363b',
}

RGB Array

[249, 235, 242], [243, 226, 232], [252, 215, 218], [245, 143, 154], [60, 54, 59]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F9EBF2, #F3E2E8, #FCD7DA, #F58F9A, #3C363B is ideal for: health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #f9ebf2; --color-2: #f3e2e8; --color-3: #fcd7da; --color-4: #f58f9a; --color-5: #3c363b. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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