#F6F4E7 + #F2EED0 + #DEDDBF + #C69DCC + #9B889E - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F6F4E7

Fresh Green · Linen · Lemon Cream

HEX

#F6F4E7

RGB

rgb(246, 244, 231)

HSL

hsl(52, 45%, 94%)

HSB

hsb(52, 6%, 96%)

CMYK

cmyk(0%, 1%, 6%, 4%)

Oklch

oklch(96.5% 0.017 99.6)

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

#F2EED0

Fresh Green · Beige · Lemon Cream

HEX

#F2EED0

RGB

rgb(242, 238, 208)

HSL

hsl(53, 57%, 88%)

HSB

hsb(53, 14%, 95%)

CMYK

cmyk(0%, 2%, 14%, 5%)

Oklch

oklch(94.4% 0.040 100.9)

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

#DEDDBF

Fresh Green · LightGray · Lemon Cream

HEX

#DEDDBF

RGB

rgb(222, 221, 191)

HSL

hsl(58, 32%, 81%)

HSB

hsb(58, 14%, 87%)

CMYK

cmyk(0%, 0%, 14%, 13%)

Oklch

oklch(89.0% 0.040 105.6)

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

#C69DCC

Lilac · Silver · Lilac Purple

HEX

#C69DCC

RGB

rgb(198, 157, 204)

HSL

hsl(292, 32%, 71%)

HSB

hsb(292, 23%, 80%)

CMYK

cmyk(3%, 23%, 0%, 20%)

Oklch

oklch(74.9% 0.080 322.1)

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

#9B889E

Dark Plum · LightSlateGray · Violet

HEX

#9B889E

RGB

rgb(155, 136, 158)

HSL

hsl(292, 10%, 58%)

HSB

hsb(292, 14%, 62%)

CMYK

cmyk(2%, 14%, 0%, 38%)

Oklch

oklch(65.1% 0.039 321.7)

Traditional「Dark Plum」· Paint「Violet」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F6F4E7

E9EBF7

Analogous

F7EEE9

F6F4E7

F2F7E9

Triadic

F6F4E7

E9F7F5

F5E9F7

Split-Comp.

F6F4E7

E9F2F7

EEE9F7

Tetradic

F6F4E7

E9F7EE

E9EBF7

F7E9F2

Contrast Matrix WCAG 2.1 Contrast

F6F4E7	F2EED0	DEDDBF	C69DCC	9B889E
—	1.1 Fail	1.3 Fail	2.1 Fail	3.0 Fail
1.1 Fail	—	1.2 Fail	2.0 Fail	2.8 Fail
1.3 Fail	1.2 Fail	—	1.7 Fail	2.4 Fail
2.1 Fail	2.0 Fail	1.7 Fail	—	1.4 Fail
3.0 Fail	2.8 Fail	2.4 Fail	1.4 Fail	—

White BG

1.1Fail

1.2Fail

1.4Fail

2.3Fail

3.3AA Large

Black BG

19.0AAA

17.9AAA

15.2AAA

9.1AAA

6.4AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F5F5EA

F0F0D7

DEDEC6

B4B4C1

939399

Deuteranopia

F5F5EB

F1F1D9

DEDEC8

B7BABE

949597

Tritanopia

F6EDED

F2DDDE

DECCCD

C4B8B6

9A9494

Achromatopsia

F3F3F3

ECECEC

DADADA

AFAFAF

909090

Shades & Tints Shades & Tints

#F6F4E7

Dark

Light

#F2EED0

Dark

Light

#DEDDBF

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f6f4e7;
  --color-2: #f2eed0;
  --color-3: #deddbf;
  --color-4: #c69dcc;
  --color-5: #9b889e;
}

SCSS

$color-1: #f6f4e7;
$color-2: #f2eed0;
$color-3: #deddbf;
$color-4: #c69dcc;
$color-5: #9b889e;

TAILWIND

colors: {
  'brand-1': '#f6f4e7',
  'brand-2': '#f2eed0',
  'brand-3': '#deddbf',
  'brand-4': '#c69dcc',
  'brand-5': '#9b889e',
}

RGB Array

[246, 244, 231], [242, 238, 208], [222, 221, 191], [198, 157, 204], [155, 136, 158]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F6F4E7, #F2EED0, #DEDDBF, #C69DCC, #9B889E 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: #f6f4e7; --color-2: #f2eed0; --color-3: #deddbf; --color-4: #c69dcc; --color-5: #9b889e. 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