#F82BC4 + #F0D1BC + #EDE3C8 + #E5EDD8 + #ADE5CC - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F82BC4

Rose Purple · DeepPink · Violet

HEX

#F82BC4

RGB

rgb(248, 43, 196)

HSL

hsl(315, 94%, 57%)

HSB

hsb(315, 83%, 97%)

CMYK

cmyk(0%, 83%, 21%, 3%)

Oklch

oklch(67.1% 0.268 341.4)

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

#F0D1BC

Apricot · Wheat · Peach Orange

HEX

#F0D1BC

RGB

rgb(240, 209, 188)

HSL

hsl(24, 63%, 84%)

HSB

hsb(24, 22%, 94%)

CMYK

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

Oklch

oklch(88.1% 0.045 56.2)

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

#EDE3C8

Goose Yellow · Bisque · Lemon Cream

HEX

#EDE3C8

RGB

rgb(237, 227, 200)

HSL

hsl(44, 51%, 86%)

HSB

hsb(44, 16%, 93%)

CMYK

cmyk(0%, 4%, 16%, 7%)

Oklch

oklch(91.7% 0.037 90.1)

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

#E5EDD8

Willow Green · Beige · Mint Green

HEX

#E5EDD8

RGB

rgb(229, 237, 216)

HSL

hsl(83, 37%, 89%)

HSB

hsb(83, 9%, 93%)

CMYK

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

Oklch

oklch(93.4% 0.029 124.0)

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

#ADE5CC

Jade · LightBlue · Apple Green

HEX

#ADE5CC

RGB

rgb(173, 229, 204)

HSL

hsl(153, 52%, 79%)

HSB

hsb(153, 24%, 90%)

CMYK

cmyk(24%, 0%, 11%, 10%)

Oklch

oklch(87.6% 0.067 165.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F82BC4

2AF85E

Analogous

C52AF8

F82BC4

F82A5E

Triadic

F82BC4

C5F82A

2AC5F8

Split-Comp.

F82BC4

5EF82A

2AF8C5

Tetradic

F82BC4

F8C52A

2AF85E

2A5EF8

Contrast Matrix WCAG 2.1 Contrast

F82BC4	F0D1BC	EDE3C8	E5EDD8	ADE5CC
—	2.4 Fail	2.7 Fail	2.8 Fail	2.4 Fail
2.4 Fail	—	1.1 Fail	1.2 Fail	1.0 Fail
2.7 Fail	1.1 Fail	—	1.1 Fail	1.1 Fail
2.8 Fail	1.2 Fail	1.1 Fail	—	1.2 Fail
2.4 Fail	1.0 Fail	1.1 Fail	1.2 Fail	—

White BG

3.4AA Large

1.4Fail

1.3Fail

1.2Fail

1.4Fail

Black BG

6.1AA

14.6AAA

16.4AAA

17.4AAA

14.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9F9D9F

E3E2C1

E9E9CF

E8E9DD

C5C6D2

Deuteranopia

ABBB96

E4E7C2

E9EAD0

E8E7DE

C2BED4

Tritanopia

EE827B

EEC5C6

ECD4D5

E5E1E2

B0D7D8

Achromatopsia

7A7A7A

D8D8D8

E3E3E3

E8E8E8

D1D1D1

Shades & Tints Shades & Tints

#F82BC4

Dark

Light

#F0D1BC

Dark

Light

#EDE3C8

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f82bc4;
  --color-2: #f0d1bc;
  --color-3: #ede3c8;
  --color-4: #e5edd8;
  --color-5: #ade5cc;
}

SCSS

$color-1: #f82bc4;
$color-2: #f0d1bc;
$color-3: #ede3c8;
$color-4: #e5edd8;
$color-5: #ade5cc;

TAILWIND

colors: {
  'brand-1': '#f82bc4',
  'brand-2': '#f0d1bc',
  'brand-3': '#ede3c8',
  'brand-4': '#e5edd8',
  'brand-5': '#ade5cc',
}

RGB Array

[248, 43, 196], [240, 209, 188], [237, 227, 200], [229, 237, 216], [173, 229, 204]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F82BC4, #F0D1BC, #EDE3C8, #E5EDD8, #ADE5CC 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: #f82bc4; --color-2: #f0d1bc; --color-3: #ede3c8; --color-4: #e5edd8; --color-5: #ade5cc. 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