← Back to Editor

#FF106A · #981050 · #EB6565 · #F0C5B1 · #E2E2E4

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 AppData Visualization

Color Details Color Details

#FF106A

Dark Violet · DeepPink · Rose Pink

HEX
#FF106A
RGB
rgb(255, 16, 106)
HSL
hsl(337, 100%, 53%)
HSB
hsb(337, 94%, 100%)
CMYK
cmyk(0%, 94%, 58%, 0%)
Oklch
oklch(64.2% 0.252 9.7)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#981050

Dark Violet · Brown · Camellia

HEX
#981050
RGB
rgb(152, 16, 80)
HSL
hsl(332, 81%, 33%)
HSB
hsb(332, 89%, 60%)
CMYK
cmyk(0%, 89%, 47%, 40%)
Oklch
oklch(44.7% 0.171 0.2)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#EB6565

Peach Pink · Salmon · Coral Red

HEX
#EB6565
RGB
rgb(235, 101, 101)
HSL
hsl(0, 77%, 66%)
HSB
hsb(0, 57%, 92%)
CMYK
cmyk(0%, 57%, 57%, 8%)
Oklch
oklch(67.3% 0.167 22.6)

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

#F0C5B1

Apricot · Wheat · Peach Orange

HEX
#F0C5B1
RGB
rgb(240, 197, 177)
HSL
hsl(19, 68%, 82%)
HSB
hsb(19, 26%, 94%)
CMYK
cmyk(0%, 18%, 26%, 6%)
Oklch
oklch(85.6% 0.056 46.3)

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

#E2E2E4

Plain White · Lavender · Cloud White

HEX
#E2E2E4
RGB
rgb(226, 226, 228)
HSL
hsl(240, 4%, 89%)
HSB
hsb(240, 1%, 89%)
CMYK
cmyk(1%, 1%, 0%, 11%)
Oklch
oklch(91.3% 0.003 286.3)

Traditional「Plain White」· Paint「Cloud White」· Creative Silver Lining

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FF106A
0FFFA3

Analogous

FF0FE3
FF106A
FF2B0F

Triadic

FF106A
6BFF0F
0F6BFF

Split-Comp.

FF106A
0FFF2B
0FE3FF

Tetradic

FF106A
E3FF0F
0FFFA3
2B0FFF

Contrast Matrix WCAG 2.1 Contrast

FF106A
981050
EB6565
F0C5B1
E2E2E4
—
2.2
Fail
1.2
Fail
2.4
Fail
2.9
Fail
2.2
Fail
—
2.6
Fail
5.3
AA
6.4
AA
1.2
Fail
2.6
Fail
—
2.0
Fail
2.5
Fail
2.4
Fail
5.3
AA
2.0
Fail
—
1.2
Fail
2.9
Fail
6.4
AA
2.5
Fail
1.2
Fail
—
White BG
3.8AA Large
8.3AAA
3.2AA Large
1.6Fail
1.3Fail
Black BG
5.5AA
2.5Fail
6.6AA
13.3AAA
16.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

989554
5D5C41
B1B065
DDDDB6
E2E2E4

Deuteranopia

A5B74F
656F3D
B9C365
E0E3B7
E2E2E3

Tritanopia

F3433F
913432
E46565
EEBABB
E2E3E3

Achromatopsia

626262
404040
8D8D8D
D0D0D0
E2E2E2

Shades & Tints Shades & Tints

#FF106A

Dark
Light

#981050

Dark
Light

#EB6565

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ff106a;
  --color-2: #981050;
  --color-3: #eb6565;
  --color-4: #f0c5b1;
  --color-5: #e2e2e4;
}

SCSS

$color-1: #ff106a;
$color-2: #981050;
$color-3: #eb6565;
$color-4: #f0c5b1;
$color-5: #e2e2e4;

TAILWIND

colors: {
  'brand-1': '#ff106a',
  'brand-2': '#981050',
  'brand-3': '#eb6565',
  'brand-4': '#f0c5b1',
  'brand-5': '#e2e2e4',
}

RGB Array

[255, 16, 106], [152, 16, 80], [235, 101, 101], [240, 197, 177], [226, 226, 228]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FF106A, #981050, #EB6565, #F0C5B1, #E2E2E4 is ideal for: social media posters, mobile apps, e-commerce promos, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. 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: #ff106a; --color-2: #981050; --color-3: #eb6565; --color-4: #f0c5b1; --color-5: #e2e2e4. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. High-contrast palettes naturally meet WCAG accessibility standards. 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