#F4DCB6 + #E96A97 + #AD7DA7 + #82BBB2 + #EAD86A - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F4DCB6

Goose Yellow · Wheat · Peach Orange

HEX

#F4DCB6

RGB

rgb(244, 220, 182)

HSL

hsl(37, 74%, 84%)

HSB

hsb(37, 25%, 96%)

CMYK

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

Oklch

oklch(90.5% 0.056 79.2)

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

#E96A97

Rouge · LightCoral · Rose Pink

HEX

#E96A97

RGB

rgb(233, 106, 151)

HSL

hsl(339, 74%, 66%)

HSB

hsb(339, 55%, 91%)

CMYK

cmyk(0%, 55%, 35%, 9%)

Oklch

oklch(69.0% 0.163 0.0)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

#AD7DA7

Rose Purple · DarkGray · Violet

HEX

#AD7DA7

RGB

rgb(173, 125, 167)

HSL

hsl(308, 23%, 58%)

HSB

hsb(308, 28%, 68%)

CMYK

cmyk(0%, 28%, 3%, 32%)

Oklch

oklch(65.1% 0.083 330.8)

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

#82BBB2

Jade · MediumAquaMarine · Lake Green

HEX

#82BBB2

RGB

rgb(130, 187, 178)

HSL

hsl(171, 30%, 62%)

HSB

hsb(171, 30%, 73%)

CMYK

cmyk(30%, 0%, 5%, 27%)

Oklch

oklch(75.0% 0.061 183.8)

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

#EAD86A

Fresh Green · Khaki · Sunflower

HEX

#EAD86A

RGB

rgb(234, 216, 106)

HSL

hsl(52, 75%, 67%)

HSB

hsb(52, 55%, 92%)

CMYK

cmyk(0%, 8%, 55%, 8%)

Oklch

oklch(87.5% 0.132 100.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F4DCB6

B8CFF4

Analogous

F4BFB8

F4DCB6

EDF4B8

Triadic

F4DCB6

B8F4DD

DDB8F4

Split-Comp.

F4DCB6

B8EDF4

BFB8F4

Tetradic

F4DCB6

B8F4BF

B8CFF4

F4B8ED

Contrast Matrix WCAG 2.1 Contrast

F4DCB6	E96A97	AD7DA7	82BBB2	EAD86A
—	2.3 Fail	2.5 Fail	1.6 Fail	1.1 Fail
2.3 Fail	—	1.1 Fail	1.4 Fail	2.1 Fail
2.5 Fail	1.1 Fail	—	1.5 Fail	2.3 Fail
1.6 Fail	1.4 Fail	1.5 Fail	—	1.5 Fail
1.1 Fail	2.1 Fail	2.3 Fail	1.5 Fail	—

White BG

1.3Fail

3.0AA Large

3.4AA Large

2.2Fail

1.4Fail

Black BG

15.8AAA

7.0AA

6.3AA

9.7AAA

14.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

EAE9BF

B2B18C

98989D

9B9BB4

E2E285

Deuteranopia

EBEDC1

B9C38A

9B9F9A

9793B5

E3E58B

Tritanopia

F3C6C8

E38482

AB9593

85B6B6

E99A9E

Achromatopsia

DFDFDF

959595

909090

A9A9A9

D1D1D1

Shades & Tints Shades & Tints

#F4DCB6

Dark

Light

#E96A97

Dark

Light

#AD7DA7

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f4dcb6;
  --color-2: #e96a97;
  --color-3: #ad7da7;
  --color-4: #82bbb2;
  --color-5: #ead86a;
}

SCSS

$color-1: #f4dcb6;
$color-2: #e96a97;
$color-3: #ad7da7;
$color-4: #82bbb2;
$color-5: #ead86a;

TAILWIND

colors: {
  'brand-1': '#f4dcb6',
  'brand-2': '#e96a97',
  'brand-3': '#ad7da7',
  'brand-4': '#82bbb2',
  'brand-5': '#ead86a',
}

RGB Array

[244, 220, 182], [233, 106, 151], [173, 125, 167], [130, 187, 178], [234, 216, 106]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F4DCB6, #E96A97, #AD7DA7, #82BBB2, #EAD86A 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: #f4dcb6; --color-2: #e96a97; --color-3: #ad7da7; --color-4: #82bbb2; --color-5: #ead86a. 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