#FFF4E6 + #E7F1E6 + #C9EFE4 + #ACE9E1 + #96E2E0 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FFF4E6

Goose Yellow · Linen · Peach Orange

HEX

#FFF4E6

RGB

rgb(255, 244, 230)

HSL

hsl(34, 100%, 95%)

HSB

hsb(34, 10%, 100%)

CMYK

cmyk(0%, 4%, 10%, 0%)

Oklch

oklch(97.2% 0.022 74.1)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#E7F1E6

Celadon · Beige · Mint Green

HEX

#E7F1E6

RGB

rgb(231, 241, 230)

HSL

hsl(115, 28%, 92%)

HSB

hsb(115, 5%, 95%)

CMYK

cmyk(4%, 0%, 5%, 5%)

Oklch

oklch(94.8% 0.018 142.8)

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

#C9EFE4

Jade · LightGray · Glacier Blue

HEX

#C9EFE4

RGB

rgb(201, 239, 228)

HSL

hsl(163, 54%, 86%)

HSB

hsb(163, 16%, 94%)

CMYK

cmyk(16%, 0%, 5%, 6%)

Oklch

oklch(92.2% 0.042 175.9)

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

#ACE9E1

Jade · LightBlue · Glacier Blue

HEX

#ACE9E1

RGB

rgb(172, 233, 225)

HSL

hsl(172, 58%, 79%)

HSB

hsb(172, 26%, 91%)

CMYK

cmyk(26%, 0%, 3%, 9%)

Oklch

oklch(89.1% 0.063 186.1)

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

#96E2E0

Jade · LightBlue · Lake Green

HEX

#96E2E0

RGB

rgb(150, 226, 224)

HSL

hsl(178, 57%, 74%)

HSB

hsb(178, 34%, 89%)

CMYK

cmyk(34%, 0%, 1%, 11%)

Oklch

oklch(86.3% 0.075 193.7)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFF4E6

E5F1FF

Analogous

FFE7E5

FFF4E6

FDFFE5

Triadic

FFF4E6

E5FFF4

F4E5FF

Split-Comp.

FFF4E6

E5FDFF

E7E5FF

Tetradic

FFF4E6

E5FFE7

E5F1FF

FFE5FD

Contrast Matrix WCAG 2.1 Contrast

FFF4E6	E7F1E6	C9EFE4	ACE9E1	96E2E0
—	1.1 Fail	1.1 Fail	1.2 Fail	1.4 Fail
1.1 Fail	—	1.1 Fail	1.2 Fail	1.3 Fail
1.1 Fail	1.1 Fail	—	1.1 Fail	1.2 Fail
1.2 Fail	1.2 Fail	1.1 Fail	—	1.1 Fail
1.4 Fail	1.3 Fail	1.2 Fail	1.1 Fail	—

White BG

1.1Fail

1.2Fail

1.4Fail

1.5Fail

Black BG

19.3AAA

18.1AAA

17.0AAA

15.5AAA

14.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

FAFAE9

EBEBE9

D9DAE7

C6C7E3

B7B8E0

Deuteranopia

FBFCEA

EBEAE9

D7D4E7

C3BEE3

B3ADE1

Tritanopia

FEECED

E8EBEB

CBE9E9

AFE4E5

9AE1E1

Achromatopsia

F6F6F6

EDEDED

E2E2E2

D6D6D6

CBCBCB

Shades & Tints Shades & Tints

#FFF4E6

Dark

Light

#E7F1E6

Dark

Light

#C9EFE4

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fff4e6;
  --color-2: #e7f1e6;
  --color-3: #c9efe4;
  --color-4: #ace9e1;
  --color-5: #96e2e0;
}

SCSS

$color-1: #fff4e6;
$color-2: #e7f1e6;
$color-3: #c9efe4;
$color-4: #ace9e1;
$color-5: #96e2e0;

TAILWIND

colors: {
  'brand-1': '#fff4e6',
  'brand-2': '#e7f1e6',
  'brand-3': '#c9efe4',
  'brand-4': '#ace9e1',
  'brand-5': '#96e2e0',
}

RGB Array

[255, 244, 230], [231, 241, 230], [201, 239, 228], [172, 233, 225], [150, 226, 224]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FFF4E6, #E7F1E6, #C9EFE4, #ACE9E1, #96E2E0 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: #fff4e6; --color-2: #e7f1e6; --color-3: #c9efe4; --color-4: #ace9e1; --color-5: #96e2e0. 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