#FFFBE6 + #F0F7E6 + #E6F2EE + #DDE0F0 + #D6C5DF - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FFFBE6

Fresh Green · LightYellow · Lemon Cream

HEX

#FFFBE6

RGB

rgb(255, 251, 230)

HSL

hsl(50, 100%, 95%)

HSB

hsb(50, 10%, 100%)

CMYK

cmyk(0%, 2%, 10%, 0%)

Oklch

oklch(98.6% 0.028 98.1)

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

#F0F7E6

Willow Green · Beige · Mint Green

HEX

#F0F7E6

RGB

rgb(240, 247, 230)

HSL

hsl(85, 52%, 94%)

HSB

hsb(85, 7%, 97%)

CMYK

cmyk(3%, 0%, 7%, 3%)

Oklch

oklch(96.6% 0.024 125.2)

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

#E6F2EE

Jade · Lavender · Glacier Blue

HEX

#E6F2EE

RGB

rgb(230, 242, 238)

HSL

hsl(160, 32%, 93%)

HSB

hsb(160, 5%, 95%)

CMYK

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

Oklch

oklch(95.1% 0.014 174.2)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

#DDE0F0

Azure · Lavender · Sky Blue

HEX

#DDE0F0

RGB

rgb(221, 224, 240)

HSL

hsl(231, 39%, 90%)

HSB

hsb(231, 8%, 94%)

CMYK

cmyk(8%, 7%, 0%, 6%)

Oklch

oklch(90.9% 0.022 277.5)

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

#D6C5DF

Lilac · LightGray · Lavender

HEX

#D6C5DF

RGB

rgb(214, 197, 223)

HSL

hsl(279, 29%, 82%)

HSB

hsb(279, 12%, 87%)

CMYK

cmyk(4%, 12%, 0%, 13%)

Oklch

oklch(84.5% 0.040 314.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFFBE6

E5EAFF

Analogous

FFEEE5

FFFBE6

F7FFE5

Triadic

FFFBE6

E5FFFB

FBE5FF

Split-Comp.

FFFBE6

E5F6FF

EEE5FF

Tetradic

FFFBE6

E5FFEE

E5EAFF

FFE5F7

Contrast Matrix WCAG 2.1 Contrast

FFFBE6	F0F7E6	E6F2EE	DDE0F0	D6C5DF
—	1.1 Fail	1.1 Fail	1.3 Fail	1.6 Fail
1.1 Fail	—	1.0 Fail	1.2 Fail	1.5 Fail
1.1 Fail	1.0 Fail	—	1.1 Fail	1.4 Fail
1.3 Fail	1.2 Fail	1.1 Fail	—	1.2 Fail
1.6 Fail	1.5 Fail	1.4 Fail	1.2 Fail	—

White BG

1.0Fail

1.1Fail

1.3Fail

1.6Fail

Black BG

20.2AAA

19.2AAA

18.3AAA

16.0AAA

12.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

FDFDEB

F3F3EA

EBEBEF

DEDEEC

CFCED9

Deuteranopia

FEFEEC

F3F2EB

EBEAEF

DEDEEB

D0D1D7

Tritanopia

FFEFF0

F0EDEE

E7F0F0

DDE9E8

D5D4D3

Achromatopsia

FAFAFA

F3F3F3

EEEEEE

E1E1E1

CDCDCD

Shades & Tints Shades & Tints

#FFFBE6

Dark

Light

#F0F7E6

Dark

Light

#E6F2EE

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fffbe6;
  --color-2: #f0f7e6;
  --color-3: #e6f2ee;
  --color-4: #dde0f0;
  --color-5: #d6c5df;
}

SCSS

$color-1: #fffbe6;
$color-2: #f0f7e6;
$color-3: #e6f2ee;
$color-4: #dde0f0;
$color-5: #d6c5df;

TAILWIND

colors: {
  'brand-1': '#fffbe6',
  'brand-2': '#f0f7e6',
  'brand-3': '#e6f2ee',
  'brand-4': '#dde0f0',
  'brand-5': '#d6c5df',
}

RGB Array

[255, 251, 230], [240, 247, 230], [230, 242, 238], [221, 224, 240], [214, 197, 223]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FFFBE6, #F0F7E6, #E6F2EE, #DDE0F0, #D6C5DF 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: #fffbe6; --color-2: #f0f7e6; --color-3: #e6f2ee; --color-4: #dde0f0; --color-5: #d6c5df. 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