← Back to Editor

#F74D77 · #DB7FCC · #BDABFF · #AAD6F2 · #D5DEDB

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#F74D77

Peach Pink · Salmon · Coral Red

HEX
#F74D77
RGB
rgb(247, 77, 119)
HSL
hsl(345, 91%, 64%)
HSB
hsb(345, 69%, 97%)
CMYK
cmyk(0%, 69%, 52%, 3%)
Oklch
oklch(66.8% 0.206 10.1)

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

#DB7FCC

Mauve · Orchid · Lilac Purple

HEX
#DB7FCC
RGB
rgb(219, 127, 204)
HSL
hsl(310, 56%, 68%)
HSB
hsb(310, 42%, 86%)
CMYK
cmyk(0%, 42%, 7%, 14%)
Oklch
oklch(72.1% 0.148 333.2)

Traditional「Mauve」· Paint「Lilac Purple」· Creative Rose Petal

#BDABFF

Wisteria · LightSteelBlue · Sky Blue

HEX
#BDABFF
RGB
rgb(189, 171, 255)
HSL
hsl(253, 100%, 84%)
HSB
hsb(253, 33%, 100%)
CMYK
cmyk(26%, 33%, 0%, 0%)
Oklch
oklch(78.8% 0.119 293.3)

Traditional「Wisteria」· Paint「Sky Blue」· Creative Lavender Dream

#AAD6F2

Sky Blue · LightBlue · Sky Blue

HEX
#AAD6F2
RGB
rgb(170, 214, 242)
HSL
hsl(203, 73%, 81%)
HSB
hsb(203, 30%, 95%)
CMYK
cmyk(30%, 12%, 0%, 5%)
Oklch
oklch(85.4% 0.060 236.3)

Traditional「Sky Blue」· Paint「Sky Blue」· Creative Twilight Haze

#D5DEDB

Jade · LightGray · Glacier Blue

HEX
#D5DEDB
RGB
rgb(213, 222, 219)
HSL
hsl(160, 12%, 85%)
HSB
hsb(160, 4%, 87%)
CMYK
cmyk(4%, 0%, 1%, 13%)
Oklch
oklch(89.3% 0.011 174.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F74D77
50F7CD

Analogous

F750CD
F74D77
F77950

Triadic

F74D77
79F750
5079F7

Split-Comp.

F74D77
50F779
50CDF7

Tetradic

F74D77
CDF750
50F7CD
7950F7

Contrast Matrix WCAG 2.1 Contrast

F74D77
DB7FCC
BDABFF
AAD6F2
D5DEDB
—
1.3
Fail
1.7
Fail
2.2
Fail
2.4
Fail
1.3
Fail
—
1.3
Fail
1.7
Fail
1.9
Fail
1.7
Fail
1.3
Fail
—
1.3
Fail
1.5
Fail
2.2
Fail
1.7
Fail
1.3
Fail
—
1.1
Fail
2.4
Fail
1.9
Fail
1.5
Fail
1.1
Fail
—
White BG
3.3AA Large
2.7Fail
2.0Fail
1.5Fail
1.4Fail
Black BG
6.3AA
7.9AAA
10.4AAA
13.6AAA
15.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

ADAC6D
B3B2B9
B5B5EB
BDBDEB
D9D9DC

Deuteranopia

B7C46A
B9BFB5
B6B8E6
BBB7EA
D8D8DC

Tritanopia

EE6563
D6ABA7
BCDBD7
ACE6E5
D5DCDC

Achromatopsia

858585
A3A3A3
BABABA
CCCCCC
DBDBDB

Shades & Tints Shades & Tints

#F74D77

Dark
Light

#DB7FCC

Dark
Light

#BDABFF

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f74d77;
  --color-2: #db7fcc;
  --color-3: #bdabff;
  --color-4: #aad6f2;
  --color-5: #d5dedb;
}

SCSS

$color-1: #f74d77;
$color-2: #db7fcc;
$color-3: #bdabff;
$color-4: #aad6f2;
$color-5: #d5dedb;

TAILWIND

colors: {
  'brand-1': '#f74d77',
  'brand-2': '#db7fcc',
  'brand-3': '#bdabff',
  'brand-4': '#aad6f2',
  'brand-5': '#d5dedb',
}

RGB Array

[247, 77, 119], [219, 127, 204], [189, 171, 255], [170, 214, 242], [213, 222, 219]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F74D77, #DB7FCC, #BDABFF, #AAD6F2, #D5DEDB is ideal for: social media posters, mobile apps, e-commerce promos, health products, baby brands, fresh-style blogs. Vivid colors effectively attract user attention. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #f74d77; --color-2: #db7fcc; --color-3: #bdabff; --color-4: #aad6f2; --color-5: #d5dedb. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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