← Back to Editor

#F1F6E8 · #ECEFDD · #CECFA3 · #999767 · #525552

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

#F1F6E8

Willow Green · Linen · Mint Green

HEX
#F1F6E8
RGB
rgb(241, 246, 232)
HSL
hsl(81, 44%, 94%)
HSB
hsb(81, 6%, 96%)
CMYK
cmyk(2%, 0%, 6%, 4%)
Oklch
oklch(96.6% 0.019 122.8)

Traditional「Willow Green」· Paint「Mint Green」· Creative Mint Breeze

#ECEFDD

Willow Green · Beige · Mint Green

HEX
#ECEFDD
RGB
rgb(236, 239, 221)
HSL
hsl(70, 36%, 90%)
HSB
hsb(70, 8%, 94%)
CMYK
cmyk(1%, 0%, 8%, 6%)
Oklch
oklch(94.5% 0.024 114.5)

Traditional「Willow Green」· Paint「Mint Green」· Creative Mint Breeze

#CECFA3

Fresh Green · Silver · Sunflower

HEX
#CECFA3
RGB
rgb(206, 207, 163)
HSL
hsl(61, 31%, 73%)
HSB
hsb(61, 21%, 81%)
CMYK
cmyk(0%, 0%, 21%, 19%)
Oklch
oklch(84.3% 0.059 108.7)

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

#999767

Autumn Sage · Gray · Honey Gold

HEX
#999767
RGB
rgb(153, 151, 103)
HSL
hsl(58, 20%, 50%)
HSB
hsb(58, 33%, 60%)
CMYK
cmyk(0%, 1%, 33%, 40%)
Oklch
oklch(66.6% 0.066 106.0)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#525552

Ink Gray · DarkSlateGray · Charcoal

HEX
#525552
RGB
rgb(82, 85, 82)
HSL
hsl(120, 2%, 33%)
HSB
hsb(120, 4%, 33%)
CMYK
cmyk(4%, 0%, 4%, 67%)
Oklch
oklch(44.6% 0.006 145.5)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F1F6E8
EEE9F6

Analogous

F6F4E9
F1F6E8
EBF6E9

Triadic

F1F6E8
E9F2F6
F6E9F2

Split-Comp.

F1F6E8
E9EBF6
F4E9F6

Tetradic

F1F6E8
E9F6F4
EEE9F6
F6E9EB

Contrast Matrix WCAG 2.1 Contrast

F1F6E8
ECEFDD
CECFA3
999767
525552
—
1.1
Fail
1.5
Fail
2.7
Fail
6.9
AA
1.1
Fail
—
1.4
Fail
2.6
Fail
6.5
AA
1.5
Fail
1.4
Fail
—
1.9
Fail
4.7
AA
2.7
Fail
2.6
Fail
1.9
Fail
—
2.5
Fail
6.9
AA
6.5
AA
4.7
AA
2.5
Fail
—
White BG
1.1Fail
1.2Fail
1.6Fail
3.0AA Large
7.6AAA
Black BG
19.1AAA
18.0AAA
13.1AAA
7.0AA
2.8Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

F3F3EB
EDEDE1
CECEAE
989873
535353

Deuteranopia

F3F3EC
EDEDE2
CECEB0
989875
535353

Tritanopia

F1EEEF
ECE5E6
CEB6B8
997C7E
525353

Achromatopsia

F3F3F3
ECECEC
CACACA
929292
545454

Shades & Tints Shades & Tints

#F1F6E8

Dark
Light

#ECEFDD

Dark
Light

#CECFA3

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f1f6e8;
  --color-2: #ecefdd;
  --color-3: #cecfa3;
  --color-4: #999767;
  --color-5: #525552;
}

SCSS

$color-1: #f1f6e8;
$color-2: #ecefdd;
$color-3: #cecfa3;
$color-4: #999767;
$color-5: #525552;

TAILWIND

colors: {
  'brand-1': '#f1f6e8',
  'brand-2': '#ecefdd',
  'brand-3': '#cecfa3',
  'brand-4': '#999767',
  'brand-5': '#525552',
}

RGB Array

[241, 246, 232], [236, 239, 221], [206, 207, 163], [153, 151, 103], [82, 85, 82]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F1F6E8, #ECEFDD, #CECFA3, #999767, #525552 is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. 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: #f1f6e8; --color-2: #ecefdd; --color-3: #cecfa3; --color-4: #999767; --color-5: #525552. 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 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