Deep Pink Color (#FF1493)

#FF1493rgb(255, 20, 147)

Deep Pink is a CSS named color defined as hex code #FF1493. It is darker and more vivid than Hot Pink, a magenta-leaning shade with almost no green in it, so it reads as intense rather than soft.

Color Overview & Formats

CSS: deeppinkLuminance: 0.2387
HEX
#FF1493
RGB
rgb(255, 20, 147)
HSL
hsl(328, 100%, 54%)
Deep Pink (#FF1493) Color Format Conversions
FormatSyntax / ValuesNotesAction
HEX#FF14936-digit hex web code
RGBrgb(255, 20, 147)Red, Green, Blue channels (0-255)
HSLhsl(328, 100%, 54%)Hue (328°), Saturation (100%), Lightness (54%)
HSV / HSBhsv(328, 92%, 100%)Hue, Saturation (92%), Value/Brightness (100%)
CMYKcmyk(0%, 92%, 42%, 0%)Digital mathematical approximation (non-print)
OKLCHoklch(0.655 0.261 356.9)Perceptually uniform color space (CSS Color 4 approximation)
CSS Implementation & Quick Steps
background-color: #FF1493; /* or deeppink */
  1. Select color format: Choose the desired format (HEX #FF1493, RGB, or HSL).
  2. Copy the code: Click the copy button or press Tab+Enter to store in clipboard.
  3. Pair with black text: Black text on Deep Pink reaches 5.77:1 (WCAG AA).

What Colors Go With Deep Pink?

These 6 colors all go well with Deep Pink (#FF1493), and each one is a standard CSS named color. The ratio is the WCAG 2.2 contrast of that color on Deep Pink: at 4.5:1 or above it works for text; below that, use it for backgrounds and accents.

Black

#000000
5.77:1Text-safe

Keeps deep pink sharp and readable; the safest text color on it.

4.08:1Background / accent

A dark navy for large headings and outlines next to deep pink.

Gold

#FFD700
2.59:1Background / accent

A warm, celebratory accent for events and packaging.

Aqua

#00FFFF
2.9:1Background / accent

A neon counterpart for Y2K and electronic-music styles.

Silver

#C0C0C0
2:1Background / accent

A cool metallic neutral that calms the intensity.

White

#FFFFFF
3.64:1Background / accent

Works for large white headings on deep pink, not for small text.

Harmonious Palettes & Tints

The palettes below are algorithmically generated across standard intervals based on Deep Pink (HSL 328°). Each group offers full palette copy and live preview:

Complementary Harmony

Hue rotated 180 degrees on the HSL wheel (328° to 148°), keeping the original saturation and lightness.

Deep Pink
#FF1493
Complement (148°)
#14FF80
Live UI Component Mockup
Component Header SampleBlack text on Deep Pink: 5.77:1 (WCAG AA).
Button style preview

Analogous Harmony

Hues 30 degrees either side (298° and 358°), keeping the original saturation and lightness.

Analogous (298°)
#F614FF
Deep Pink
#FF1493
Analogous (358°)
#FF141D
Live UI Component Mockup
Component Header SampleBlack text on Deep Pink: 5.77:1 (WCAG AA).
Button style preview

Triadic Harmony

Hues spaced evenly by 120 degrees (88° and 208°), keeping the original saturation and lightness.

Deep Pink
#FF1493
Triadic (88°)
#93FF14
Triadic (208°)
#1493FF
Live UI Component Mockup
Component Header SampleBlack text on Deep Pink: 5.77:1 (WCAG AA).
Button style preview

Tints & Shades

Mixed with white (tints) and black (shades) in sRGB at 60% and 30%.

Tint 60%
#FFA1D4
Tint 30%
#FF5BB3
Deep Pink
#FF1493
Shade 30%
#B30E67
Shade 60%
#66083B
Live UI Component Mockup
Component Header SampleBlack text on Deep Pink: 5.77:1 (WCAG AA).
Button style preview

WCAG 2.2 Text Readability & Contrast Check

Under WCAG 2.2 criteria, regular body text requires at least 4.5:1 (AA) and large text requires at least 3.0:1. The table below displays calculated contrast ratios:

Text Contrast Ratios on Deep Pink (#FF1493)
Foreground ColorContrast RatioNormal Text (AA)Large Text (AA)Normal Text AAA (>= 7.0:1)
Pure Black (#000000)
5.77:1PassPassFail
Pure White (#FFFFFF)
3.64:1FailPassFail
Dark Charcoal (#212529)
4.24:1FailPassFail
Mid Gray (#666666)
1.58:1FailFailFail

Interactive Contrast Tester

Enter text foreground and background colors to verify WCAG legibility:

Calculated Ratio:
5.77:1
Normal: Pass AALarge: Pass AAA
Large Heading Sample (18pt Bold)

This is sample body text rendered directly to verify contrast and readability.

Deep Pink Background Download

Download standard 1920x1080 solid desktop wallpaper or generate mobile wallpaper:

Deep Pink 1920x1080 solid color background wallpaper previewStandard Wallpaper: 1920x1080 PNG (#FF1493)

Download Options

All wallpaper files precisely match the W3C standard color value:

Download 1920x1080 PNG

CSS Standard & Usage Notes

deeppink = #ff1493 (rgb(255, 20, 147))
W3C CSS Color 4

UI Design & Accessibility Guidelines

Use Deep Pink in small doses for calls to action, sale tags and data highlights. Black text passes WCAG AA at every size; white text only passes for large text (3:1), not for body text.

Published: · Modified: · Editorial: SwatchAtlas Editorial Team

Frequently Asked Questions (FAQ)

Can I use black text on Deep Pink?

Yes. Black text on Deep Pink has a WCAG 2.2 contrast ratio of 5.77:1, which passes AA (4.5:1) for all text sizes but not the stricter AAA level (7:1) for body text.

Can I use white text on Deep Pink?

Only for large text. White text on Deep Pink has a WCAG 2.2 contrast ratio of 3.64:1: enough for large text (3:1) but below the 4.5:1 needed for body text.

What colors go with Deep Pink?

Black, Midnight Blue, Gold, Aqua, Silver and White all go well with Deep Pink. Black (5.77:1) has enough contrast for text on Deep Pink; Midnight Blue, Gold, Aqua, Silver and White work better as a background or accent.

Is Deep Pink the same as magenta?

No. CSS magenta (#FF00FF, also called fuchsia) has no green at all and sits at a hue of 300°, while Deep Pink (#FF1493) sits at 328° and reads as pink rather than purple.