#F0DEBB + #E0B6AC + #D08D9C + #7F7C9F + #B13D7D - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F0DEBB

Goose Yellow · Wheat · Lemon Cream

HEX

#F0DEBB

RGB

rgb(240, 222, 187)

HSL

hsl(40, 64%, 84%)

HSB

hsb(40, 22%, 94%)

CMYK

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

Oklch

oklch(90.6% 0.050 84.0)

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

#E0B6AC

Peach Pink · Tan · Coral Red

HEX

#E0B6AC

RGB

rgb(224, 182, 172)

HSL

hsl(12, 46%, 78%)

HSB

hsb(12, 23%, 88%)

CMYK

cmyk(0%, 19%, 23%, 12%)

Oklch

oklch(81.1% 0.051 33.6)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#D08D9C

Peach Pink · Tan · Coral Red

HEX

#D08D9C

RGB

rgb(208, 141, 156)

HSL

hsl(347, 42%, 68%)

HSB

hsb(347, 32%, 82%)

CMYK

cmyk(0%, 32%, 25%, 18%)

Oklch

oklch(71.4% 0.083 4.7)

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

#7F7C9F

Deep Indigo · LightSlateGray · Navy Blue

HEX

#7F7C9F

RGB

rgb(127, 124, 159)

HSL

hsl(245, 15%, 55%)

HSB

hsb(245, 22%, 62%)

CMYK

cmyk(20%, 22%, 0%, 38%)

Oklch

oklch(60.2% 0.053 288.6)

Traditional「Deep Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

#B13D7D

Rose Purple · MediumVioletRed · Camellia

HEX

#B13D7D

RGB

rgb(177, 61, 125)

HSL

hsl(327, 49%, 47%)

HSB

hsb(327, 66%, 69%)

CMYK

cmyk(0%, 66%, 29%, 31%)

Oklch

oklch(54.3% 0.164 349.9)

Traditional「Rose Purple」· Paint「Camellia」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F0DEBB

BCCDF0

Analogous

F0C5BC

F0DEBB

E8F0BC

Triadic

F0DEBB

BCF0DF

DFBCF0

Split-Comp.

F0DEBB

BCE8F0

C5BCF0

Tetradic

F0DEBB

BCF0C5

BCCDF0

F0BCE8

Contrast Matrix WCAG 2.1 Contrast

F0DEBB	E0B6AC	D08D9C	7F7C9F	B13D7D
—	1.4 Fail	2.0 Fail	3.0 AA Large	4.1 AA Large
1.4 Fail	—	1.4 Fail	2.2 Fail	3.0 Fail
2.0 Fail	1.4 Fail	—	1.5 Fail	2.1 Fail
3.0 AA Large	2.2 Fail	1.5 Fail	—	1.4 Fail
4.1 AA Large	3.0 Fail	2.1 Fail	1.4 Fail	—

White BG

1.3Fail

1.8Fail

2.6Fail

4.0AA Large

5.5AA

Black BG

15.9AAA

11.5AAA

8.0AAA

5.3AA

3.8AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

E8E8C3

CECDAE

B3B298

7E7E97

7F7E6E

Deuteranopia

E9EBC6

D0D3AF

B7BC98

7E7E95

868E6A

Tritanopia

EFCACC

DEB0B1

CD9695

7F908E

AB615F

Achromatopsia

DFDFDF

C1C1C1

A3A3A3

818181

676767

Shades & Tints Shades & Tints

#F0DEBB

Dark

Light

#E0B6AC

Dark

Light

#D08D9C

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f0debb;
  --color-2: #e0b6ac;
  --color-3: #d08d9c;
  --color-4: #7f7c9f;
  --color-5: #b13d7d;
}

SCSS

$color-1: #f0debb;
$color-2: #e0b6ac;
$color-3: #d08d9c;
$color-4: #7f7c9f;
$color-5: #b13d7d;

TAILWIND

colors: {
  'brand-1': '#f0debb',
  'brand-2': '#e0b6ac',
  'brand-3': '#d08d9c',
  'brand-4': '#7f7c9f',
  'brand-5': '#b13d7d',
}

RGB Array

[240, 222, 187], [224, 182, 172], [208, 141, 156], [127, 124, 159], [177, 61, 125]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F0DEBB, #E0B6AC, #D08D9C, #7F7C9F, #B13D7D 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: #f0debb; --color-2: #e0b6ac; --color-3: #d08d9c; --color-4: #7f7c9f; --color-5: #b13d7d. 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