Shocking Pink

HEX: #FC0FC0 | Modern Palette

On White
3.52:1
FAIL
On Black
5.97:1
PASS

Color Specifications

HEX
#FC0FC0
RGB
252, 15, 192
HSL
315°, 97% ,52%
CMYK
0, 94, 24, 1

About Shocking Pink

Shocking Pink (#FC0FC0) is a color with RGB(252, 15, 192) and HSL(315.2°, 97.5%, 52.4%). It is commonly associated with Energetic, Bold moods. In design, it fits Vivid, Warm styles and is suitable for Text, Button, Accent. Its complementary color is #0FFC4B, which creates strong contrast. Its triadic palette includes #C0FC0F and Spiro Disco Ball (#0FC0FC). The name comes from Shocking Pink (English).

  • HEX: #FC0FC0
  • RGB: 252, 15, 192
  • HSL: 315.2°, 97.5%, 52.4%
  • Mood: Energetic, Bold
  • Style: Vivid, Warm
  • Use case: Text, Button, Accent
  • Complementary color: #0FFC4B
  • Triadic colors: #C0FC0F, Spiro Disco Ball (#0FC0FC)
  • The name comes from Shocking Pink (English).

Live Components

LIGHT
DARK
System Notification Box

Color Palettes

Monochromatic Five tones of the same hue — a reliable scale for backgrounds, surfaces, and text.
Neutral + Accent Four near-neutral tones grounded by a saturated accent — clean and versatile for UI.
Analogous Five hues drifting across a 60° arc — naturally harmonious and pleasing to the eye.
3 + 1 + 1 Three analogous base colors, one complementary accent, one dark anchor — bold yet balanced.

Color Harmonies

Complementary

The color directly opposite on the color wheel — creates maximum contrast and vibrance.

Analogous

Colors adjacent on the wheel — naturally harmonious and pleasing to the eye.

Triadic

Three colors equally spaced 120° apart — bold, balanced, and visually rich.

Split-Complementary

Two colors flanking the complement — high contrast with less tension than full complementary.

Tetradic (Square)

Four colors at 90° intervals — rich variety, best when one color dominates.

Monochromatic

Shades and tints of the same hue — cohesive, elegant, and easy to work with.

Shades & Tints

A seamless scale of #FC0FC0 from deepest shade to lightest tint.

Color Characteristics

Mood
Energetic Bold
Style
Vivid Warm
Use case
Text Button Accent

Accessibility Simulation

Deuteranopia #9292BC
Protanopia #5D5DC1
Tritanopia #F44B4B
Achromatopsia #898989

Frequently Asked Questions

Shocking Pink (#FC0FC0) is a color with RGB(252, 15, 192) and HSL(315.2°, 97.5%, 52.4%).

#FC0FC0 pairs strongly with #0FFC4B as its complementary color. It can also be used with neutral tones for balanced UI and design layouts.

#FC0FC0 is suitable for Text, Button, Accent and works well with Vivid, Warm styles.

#FC0FC0 is commonly associated with Energetic, Bold.

The name Shocking Pink is linked to Shocking Pink from English, meaning A vivid, intense shade of pink intended to be striking or 'shocking'..

Name, History & Etymology

Origin Word Shocking Pink
Meaning A vivid, intense shade of pink intended to be striking or 'shocking'.
Language English
First Recorded Use Early 20th Century

History

The term 'Shocking Pink' was popularized by the Italian fashion designer Elsa Schiaparelli. She launched her perfume 'Shocking' in 1937, and its packaging, designed by Leonor Fini, was a distinctive hot pink, inspired by the color of a duke's pink diamond and the vibrant pinks of the circus. This specific shade became her signature color and was widely associated with her avant-garde designs. The color itself, a bright fuchsia-like pink, existed before the name, but Schiaparelli's branding cemented 'Shocking Pink' into the lexicon of fashion and color.

First Recorded Use

1937

Cultural Associations

Shocking Pink is often associated with boldness, femininity, glamour, and a certain rebellious spirit. It has been used extensively in fashion, art, and pop culture to make a statement. Its intensity can evoke feelings of playfulness, extravagance, and sometimes even kitsch, depending on its application. It stands in contrast to more subdued or 'pretty' pinks, aiming for impact rather than subtlety. It has seen resurgences in popularity, particularly in eras that embrace vibrant and expressive aesthetics.

Similar Named Colors
Hot Magenta #FF1DCE ΔE 2.25
Razzle Dazzle Rose #FF33CC ΔE 2.92
Fashion Fuchsia #F400A1 ΔE 5.12
Persian Rose #FE28A2 ΔE 5.85

Code Snippets

/* Background */
.element {
    background-color: #FC0FC0;
}

/* Text */
.element {
    color: #FC0FC0;
}

/* Border */
.element {
    border: 1px solid #FC0FC0;
}

/* Linear gradient to complementary */
.element {
    background: linear-gradient(
        to right,
        #FC0FC0,
        #0FFC4B
    );
}

/* Radial gradient */
.element {
    background: radial-gradient(
        circle,
        #FC0FC0,
        #0FFC4B
    );
}

// SCSS variable
$shocking-pink: #FC0FC0;

// With RGB channels (useful for rgba() usage)
$shocking-pink-r: 252;
$shocking-pink-g: 15;
$shocking-pink-b: 192;

// Usage
.element {
    background-color: $shocking-pink;
    color: rgba($shocking-pink-r, $shocking-pink-g, $shocking-pink-b, 0.8);
}