← Back to Editor

#7D2758 · #D12D52 · #FE4844 · #FF8787 · #FFB3B3

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#7D2758

Rose Purple · Purple · Camellia

HEX
#7D2758
RGB
rgb(125, 39, 88)
HSL
hsl(326, 52%, 32%)
HSB
hsb(326, 69%, 49%)
CMYK
cmyk(0%, 69%, 30%, 51%)
Oklch
oklch(42.0% 0.130 349.0)

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

#D12D52

Vermilion · Crimson · Passion Red

HEX
#D12D52
RGB
rgb(209, 45, 82)
HSL
hsl(346, 65%, 50%)
HSB
hsb(346, 78%, 82%)
CMYK
cmyk(0%, 78%, 61%, 18%)
Oklch
oklch(56.9% 0.198 14.1)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

#FE4844

Peach Pink · Tomato · Coral Red

HEX
#FE4844
RGB
rgb(254, 72, 68)
HSL
hsl(1, 99%, 63%)
HSB
hsb(1, 73%, 100%)
CMYK
cmyk(0%, 72%, 73%, 0%)
Oklch
oklch(66.5% 0.219 26.5)

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

#FF8787

Peach Pink · LightCoral · Coral Red

HEX
#FF8787
RGB
rgb(255, 135, 135)
HSL
hsl(0, 100%, 76%)
HSB
hsb(0, 47%, 100%)
CMYK
cmyk(0%, 47%, 47%, 0%)
Oklch
oklch(75.6% 0.146 21.1)

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

#FFB3B3

Peach Pink · LightPink · Cherry Blossom

HEX
#FFB3B3
RGB
rgb(255, 179, 179)
HSL
hsl(0, 100%, 85%)
HSB
hsb(0, 30%, 100%)
CMYK
cmyk(0%, 30%, 30%, 0%)
Oklch
oklch(83.9% 0.089 19.1)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7D2758
277C4C

Analogous

76277C
7D2758
7C272D

Triadic

7D2758
577C27
27577C

Split-Comp.

7D2758
2D7C27
277C76

Tetradic

7D2758
7C7627
277C4C
272D7C

Contrast Matrix WCAG 2.1 Contrast

7D2758
D12D52
FE4844
FF8787
FFB3B3
—
1.8
Fail
2.7
Fail
3.9
AA Large
5.4
AA
1.8
Fail
—
1.5
Fail
2.2
Fail
2.9
Fail
2.7
Fail
1.5
Fail
—
1.5
Fail
2.0
Fail
3.9
AA Large
2.2
Fail
1.5
Fail
—
1.4
Fail
5.4
AA
2.9
Fail
2.0
Fail
1.4
Fail
—
White BG
9.1AAA
5.0AA
3.4AA Large
2.3Fail
1.7Fail
Black BG
2.3Fail
4.2AA Large
6.2AA
9.1AAA
12.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

58574C
8A8949
AFAE45
CBCA87
DEDDB3

Deuteranopia

5D6349
94A047
BAC745
D2DB87
E3E8B3

Tritanopia

794341
C94240
F54646
F98787
FBB3B3

Achromatopsia

464646
626262
7E7E7E
ABABAB
CACACA

Shades & Tints Shades & Tints

#7D2758

Dark
Light

#D12D52

Dark
Light

#FE4844

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7d2758;
  --color-2: #d12d52;
  --color-3: #fe4844;
  --color-4: #ff8787;
  --color-5: #ffb3b3;
}

SCSS

$color-1: #7d2758;
$color-2: #d12d52;
$color-3: #fe4844;
$color-4: #ff8787;
$color-5: #ffb3b3;

TAILWIND

colors: {
  'brand-1': '#7d2758',
  'brand-2': '#d12d52',
  'brand-3': '#fe4844',
  'brand-4': '#ff8787',
  'brand-5': '#ffb3b3',
}

RGB Array

[125, 39, 88], [209, 45, 82], [254, 72, 68], [255, 135, 135], [255, 179, 179]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7D2758, #D12D52, #FE4844, #FF8787, #FFB3B3 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: #7d2758; --color-2: #d12d52; --color-3: #fe4844; --color-4: #ff8787; --color-5: #ffb3b3. 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