Shocking Pink

Meet Shocking Pink, #FC0FC0. This isn't your average pink; it's an intensely saturated magenta that commands attention. Its pure, unadulterated hue sits at the brighter end of the spectrum, offering a digital vibrancy that feels both modern and audacious for any designer's palette.

What color is Shocking Pink?

What is the meaning of Shocking Pink?

How do I use Shocking Pink (#FC0FC0) in UI design?

Using Shocking Pink color codes

Shocking Pink

#FC0FC0

Access our full UI & UX library today.

What color is Shocking Pink?

What is the meaning of Shocking Pink?

How do I use Shocking Pink (#FC0FC0) in UI design?

Using Shocking Pink color codes

Shocking Pink Code Conversions

HEX

#FC0FC0

LAB

57, 89, -31

RGB

252, 15, 192

XYZ

49.8, 24.8, 52.0

HSL

315°, 98%, 52%

LCH

57, 94, 341°

HSB

315°, 94%, 99%

LUV

57, 109, -61

CMYK

0, 94, 24, 1

CMYK

0, 94, 24, 1

HWB

315°, 6%, 1%

Shocking Pink Color Harmonies

Analogous

Sitting next to each other on the color wheel, analogous colors create a serene and cohesive look when used alongside Shocking Pink.

#C10FFC

#FC0FC0

#FC0F4A

#C10FFC

#FC0FC0

#FC0F4A

Complementary

Complementary colors sit directly opposite each other on the color wheel. Pairing them with Shocking Pink creates a high-contrast, visually striking combination.

#FC0FC0

#0FFC4B

#FC0FC0

#0FFC4B

Split Complementary

A split complementary palette provides high contrast with less tension. It uses the two colors neighboring the direct complement of Shocking Pink.

#FC0FC0

#4AFC0F

#0FFCC1

#FC0FC0

#4AFC0F

#0FFCC1

Triadic

A triadic color scheme uses three colors evenly spaced on the color wheel. For Shocking Pink, this creates a vibrant and balanced palette.

#FC0FC0

#C0FC0F

#0FC0FC

#FC0FC0

#C0FC0F

#0FC0FC

Tetradic

A tetradic color scheme uses two pairs of complementary colors. With Shocking Pink, this creates a vibrant, four-color palette offering substantial variation.

#FC0FC0

#FCC10F

#0FFC4B

#0F4AFC

#FC0FC0

#FCC10F

#0FFC4B

#0F4AFC

Square

A square color scheme uses four colors evenly spaced on the color wheel. With Shocking Pink, this combination offers rich colors and high contrast.

#FC0FC0

#FCC10F

#0FFC4B

#0F4AFC

#FC0FC0

#FCC10F

#0FFC4B

#0F4AFC

Shocking Pink Contrast Simulation

Text Color

#

Background Color

#

5.97

Good

Small Text
Pass
Large Text
Pass
Graphic Components
Pass

Your Catchy Large Text Goes Here

A high contrast makes anything easier to read, especially small text.

Text Color

#

Background Color

#

Your Catchy Large Text Goes Here

A high contrast makes anything easier to read, especially small text.

5.97

Good

Small Text
Pass
Large Text
Pass
Graphic Components
Pass

Shocking Pink Color Variations

Shades

Adding black to Shocking Pink creates darker shades, which introduce a sense of weight.

#FC0FC0

#D80DA5

#B40B89

#90096E

#6C0652

#480437

#24021B

#000000

#FC0FC0

#D80DA5

#B40B89

#90096E

#6C0652

#480437

#24021B

#000000

Tints

Tints are lighter versions of Shocking Pink, created by adding white for a softer effect.

#FC0FC0

#FC31C9

#FD54D2

#FD76DB

#FE98E4

#FEBAED

#FFDDF6

#FFFFFF

#FC0FC0

#FC31C9

#FD54D2

#FD76DB

#FE98E4

#FEBAED

#FFDDF6

#FFFFFF

Tones

Tones are softer, desaturated versions of Shocking Pink, made by mixing in gray.

#FC0FC0

#EA1FB7

#D92FAE

#C73FA5

#B5509B

#A36092

#927089

#808080

#FC0FC0

#EA1FB7

#D92FAE

#C73FA5

#B5509B

#A36092

#927089

#808080

Hues

Hues are variations of Shocking Pink, differing in intensity or temperature to create distinct moods.

#FC0FC0

#FC100F

#FCC10F

#85FC0F

#0FFC4B

#0FFBFC

#0F4AFC

#860FFC

#FC0FC0

#FC100F

#FCC10F

#85FC0F

#0FFC4B

#0FFBFC

#0F4AFC

#860FFC

What Interfaces Use Colors Like Shocking Pink?

Never run out of
inspiration again.

Use Mobbin for free as long as you like or get full access
with any of our paid plans.

  • Coinbase

  • Wise

  • Headspace

  • Airbnb

  • Uber

  • Nike

  • Pinterest

  • ChatGPT

  • Shopify

  • Loom

  • Creme

  • Mailchimp

  • Twitch

  • Spotify

  • Apple TV

  • Shop

  • Cosmos

  • Retro

  • Notion

  • Dropbox

Never run out of
inspiration again.

Use Mobbin for free as long as you like or get full access
with any of our paid plans.

  • Coinbase

  • Wise

  • Headspace

  • Airbnb

  • Uber

  • Nike

  • Pinterest

  • ChatGPT

  • Shopify

  • Loom

  • Creme

  • Mailchimp

  • Twitch

  • Spotify

  • Apple TV

  • Shop

  • Cosmos

  • Retro

  • Notion

  • Dropbox

Never run out of
inspiration again.

Use Mobbin for free as long as you like or get full access with any of our paid plans.

  • Coinbase

  • Wise

  • Headspace

  • Airbnb

  • Uber

  • Nike

  • Pinterest

  • ChatGPT

  • Shopify

  • Loom

  • Creme

  • Mailchimp

  • Twitch

  • Spotify

  • Apple TV

  • Shop

  • Cosmos

  • Retro

  • Notion

  • Dropbox