#F1E2BB + #F0C4A9 + #EA9AA7 + #9B8A9A + #ACB3CF - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F1E2BB

Goose Yellow · Wheat · Lemon Cream

HEX

#F1E2BB

RGB

rgb(241, 226, 187)

HSL

hsl(43, 66%, 84%)

HSB

hsb(43, 22%, 95%)

CMYK

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

Oklch

oklch(91.5% 0.054 89.5)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#F0C4A9

Apricot · Wheat · Peach Orange

HEX

#F0C4A9

RGB

rgb(240, 196, 169)

HSL

hsl(23, 70%, 80%)

HSB

hsb(23, 30%, 94%)

CMYK

cmyk(0%, 18%, 30%, 6%)

Oklch

oklch(85.2% 0.062 53.2)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#EA9AA7

Peach Pink · LightPink · Coral Red

HEX

#EA9AA7

RGB

rgb(234, 154, 167)

HSL

hsl(350, 66%, 76%)

HSB

hsb(350, 34%, 92%)

CMYK

cmyk(0%, 34%, 29%, 8%)

Oklch

oklch(76.9% 0.097 9.0)

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

#9B8A9A

Rose Purple · LightSlateGray · Silver Sand

HEX

#9B8A9A

RGB

rgb(155, 138, 154)

HSL

hsl(304, 8%, 57%)

HSB

hsb(304, 11%, 61%)

CMYK

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

Oklch

oklch(65.4% 0.031 327.7)

Traditional「Rose Purple」· Paint「Silver Sand」· Creative Urban Concrete

#ACB3CF

Azure · LightSteelBlue · Cobalt Blue

HEX

#ACB3CF

RGB

rgb(172, 179, 207)

HSL

hsl(228, 27%, 74%)

HSB

hsb(228, 17%, 81%)

CMYK

cmyk(17%, 14%, 0%, 19%)

Oklch

oklch(77.0% 0.041 274.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F1E2BB

BBCBF1

Analogous

F1C7BB

F1E2BB

E5F1BB

Triadic

F1E2BB

BBF1E2

E2BBF1

Split-Comp.

F1E2BB

BBE5F1

C7BBF1

Tetradic

F1E2BB

BBF1C7

BBCBF1

F1BBE5

Contrast Matrix WCAG 2.1 Contrast

F1E2BB	F0C4A9	EA9AA7	9B8A9A	ACB3CF
—	1.2 Fail	1.7 Fail	2.5 Fail	1.6 Fail
1.2 Fail	—	1.4 Fail	2.0 Fail	1.3 Fail
1.7 Fail	1.4 Fail	—	1.5 Fail	1.0 Fail
2.5 Fail	2.0 Fail	1.5 Fail	—	1.6 Fail
1.6 Fail	1.3 Fail	1.0 Fail	1.6 Fail	—

White BG

1.3Fail

1.6Fail

2.2Fail

3.2AA Large

2.1Fail

Black BG

16.3AAA

13.2AAA

9.7AAA

6.5AA

10.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

EBEAC4

DDDDB0

C7C7A4

949396

AFAFC8

Deuteranopia

EBEDC7

E0E3B1

CCD2A3

959695

AFAEC7

Tritanopia

F0CCCE

EEB5B6

E6A1A1

9A9392

ACC3C2

Achromatopsia

E2E2E2

CECECE

B3B3B3

919191

B4B4B4

Shades & Tints Shades & Tints

#F1E2BB

Dark

Light

#F0C4A9

Dark

Light

#EA9AA7

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f1e2bb;
  --color-2: #f0c4a9;
  --color-3: #ea9aa7;
  --color-4: #9b8a9a;
  --color-5: #acb3cf;
}

SCSS

$color-1: #f1e2bb;
$color-2: #f0c4a9;
$color-3: #ea9aa7;
$color-4: #9b8a9a;
$color-5: #acb3cf;

TAILWIND

colors: {
  'brand-1': '#f1e2bb',
  'brand-2': '#f0c4a9',
  'brand-3': '#ea9aa7',
  'brand-4': '#9b8a9a',
  'brand-5': '#acb3cf',
}

RGB Array

[241, 226, 187], [240, 196, 169], [234, 154, 167], [155, 138, 154], [172, 179, 207]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F1E2BB, #F0C4A9, #EA9AA7, #9B8A9A, #ACB3CF 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: #f1e2bb; --color-2: #f0c4a9; --color-3: #ea9aa7; --color-4: #9b8a9a; --color-5: #acb3cf. 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