← Back to Editor

#CC007A · #FF039A · #FF8CD1 · #851B5A · #FFD000

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

#CC007A

Rose Purple · MediumVioletRed · Camellia

HEX
#CC007A
RGB
rgb(204, 0, 122)
HSL
hsl(324, 100%, 40%)
HSB
hsb(324, 100%, 80%)
CMYK
cmyk(0%, 100%, 40%, 20%)
Oklch
oklch(55.2% 0.227 354.5)

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

#FF039A

Rose Purple · DeepPink · Rose Pink

HEX
#FF039A
RGB
rgb(255, 3, 154)
HSL
hsl(324, 100%, 51%)
HSB
hsb(324, 99%, 100%)
CMYK
cmyk(0%, 99%, 40%, 0%)
Oklch
oklch(65.4% 0.268 354.5)

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

#FF8CD1

Mauve · Violet · Cherry Blossom

HEX
#FF8CD1
RGB
rgb(255, 140, 209)
HSL
hsl(324, 100%, 77%)
HSB
hsb(324, 45%, 100%)
CMYK
cmyk(0%, 45%, 18%, 0%)
Oklch
oklch(78.5% 0.160 344.5)

Traditional「Mauve」· Paint「Cherry Blossom」· Creative Rose Petal

#851B5A

Rose Purple · Purple · Camellia

HEX
#851B5A
RGB
rgb(133, 27, 90)
HSL
hsl(324, 66%, 31%)
HSB
hsb(324, 80%, 52%)
CMYK
cmyk(0%, 80%, 32%, 48%)
Oklch
oklch(42.3% 0.153 349.5)

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

#FFD000

Ochre · Gold · Honey Gold

HEX
#FFD000
RGB
rgb(255, 208, 0)
HSL
hsl(49, 100%, 50%)
HSB
hsb(49, 100%, 100%)
CMYK
cmyk(0%, 18%, 100%, 0%)
Oklch
oklch(87.3% 0.179 92.2)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CC007A
00CC52

Analogous

B800CC
CC007A
CC0014

Triadic

CC007A
7ACC00
007ACC

Split-Comp.

CC007A
14CC00
00CCB8

Tetradic

CC007A
CCB800
00CC52
0014CC

Contrast Matrix WCAG 2.1 Contrast

CC007A
FF039A
FF8CD1
851B5A
FFD000
—
1.5
Fail
2.6
Fail
1.7
Fail
3.7
AA Large
1.5
Fail
—
1.7
Fail
2.5
Fail
2.5
Fail
2.6
Fail
1.7
Fail
—
4.3
AA Large
1.4
Fail
1.7
Fail
2.5
Fail
4.3
AA Large
—
6.2
AA
3.7
AA Large
2.5
Fail
1.4
Fail
6.2
AA
—
White BG
5.5AA
3.7AA Large
2.1Fail
9.1AAA
1.5Fail
Black BG
3.8AA Large
5.7AA
9.9AAA
2.3Fail
14.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

74725C
929075
CDCCC0
57564B
EBEA32

Deuteranopia

808F55
A1B36D
D4DDBC
5D6547
EDF13E

Tritanopia

C24540
F25952
F9B3B0
803F3C
FD5A63

Achromatopsia

4B4B4B
606060
B6B6B6
424242
C6C6C6

Shades & Tints Shades & Tints

#CC007A

Dark
Light

#FF039A

Dark
Light

#FF8CD1

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cc007a;
  --color-2: #ff039a;
  --color-3: #ff8cd1;
  --color-4: #851b5a;
  --color-5: #ffd000;
}

SCSS

$color-1: #cc007a;
$color-2: #ff039a;
$color-3: #ff8cd1;
$color-4: #851b5a;
$color-5: #ffd000;

TAILWIND

colors: {
  'brand-1': '#cc007a',
  'brand-2': '#ff039a',
  'brand-3': '#ff8cd1',
  'brand-4': '#851b5a',
  'brand-5': '#ffd000',
}

RGB Array

[204, 0, 122], [255, 3, 154], [255, 140, 209], [133, 27, 90], [255, 208, 0]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CC007A, #FF039A, #FF8CD1, #851B5A, #FFD000 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: #cc007a; --color-2: #ff039a; --color-3: #ff8cd1; --color-4: #851b5a; --color-5: #ffd000. 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