Named color · #FF11FF
Fresh Neon Pink
Fresh Neon Pink is #FF11FF: rgb(255 17 255), hsl(300 100% 53%), oklch(0.704 0.319 328.3). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Purple mean? → · Fresh Neon Pink color name →
#FF11FF
oklch(0.704 0.319 328.3)
Color conversions
- HEX
- #ff11ff
- RGB
- rgb(255 17 255)
- HSL
- hsl(300 100% 53%)
- HWB
- hwb(300 7% 0%)
- OKLCH
- oklch(0.704 0.319 328.3)
- OKLab
- oklab(0.704 0.272 -0.168)
- CIE Lab
- lab(60.53 92.52 -59.93)
- LCH
- lch(60.53 110.23 327.1)
- CMYK
- cmyk(0% 93% 0% 0%)
Tints · Shades · Tones
Tints
- FF48FF
- FF66FF
- FF7EFF
- FF93FF
- FFA7FF
- FFB9FF
- FFCBFF
- FFDDFF
- FFEEFF
Shades
- DE0DDE
- BE09BE
- 9E069E
- 800480
- 630263
- 480148
- 2E002E
- 160016
- 030003
Tones
- F336F2
- E749E6
- DB56D9
- CF60CC
- C368C0
- B66FB3
- A974A7
- 9C799A
- 8E7D8D
Color harmonies
Complementary +180°
- FF11FF
Fresh Neon Pink
- 00C04F
≈ Lǜ Sè Green
Analogous -30° +30°
- FF11FF
Fresh Neon Pink
- AF82FF
≈ Lilac Geode
- FF5A9E
≈ Fuchsia Fever
Triadic +120° +240°
- FF11FF
Fresh Neon Pink
- C49900
≈ Rapeseed
- 00B4C7
≈ Lago Blue
Split-complementary +150° +210°
- FF11FF
Fresh Neon Pink
- 97AC00
≈ Barf Green
- 00B9A0
≈ Aare River
Tetradic +90° +180° +270°
- FF11FF
Fresh Neon Pink
- EA8000
≈ Bright Marigold
- 00C04F
≈ Lǜ Sè Green
- 00ABF5
≈ Democrat
Contrast & accessibility
Ag
FailOn white
WCAG 3.09:1 · APCA Lc 55
Ag
AAOn black
WCAG 6.77:1 · APCA Lc 46
Best text color: #000000
WCAG 6.77:1 (AA) · APCA Lc 46
Contrast pairs
Code snippets
CSS
:root {
--fresh-neon-pink: #ff11ff;
--fresh-neon-pink-rgb: 255 17 255;
--fresh-neon-pink-oklch: oklch(0.704 0.319 328.3);
}
.element {
color: var(--fresh-neon-pink);
background-color: hsl(300 100% 53%);
border-color: oklch(0.704 0.319 328.3);
}Tailwind CSS v4
@theme {
--color-fresh-neon-pink: #ff11ff;
--color-fresh-neon-pink-50: #ffd3ff;
--color-fresh-neon-pink-100: #ffbfff;
--color-fresh-neon-pink-200: #ff9cff;
--color-fresh-neon-pink-300: #ff6aff;
--color-fresh-neon-pink-400: #f929f9;
--color-fresh-neon-pink-500: #e800eb;
--color-fresh-neon-pink-600: #c400c6;
--color-fresh-neon-pink-700: #9e009f;
--color-fresh-neon-pink-800: #74007a;
--color-fresh-neon-pink-900: #520056;
--color-fresh-neon-pink-950: #36003a;
}SCSS
$fresh-neon-pink: #ff11ff;
$fresh-neon-pink-rgb: 255, 17, 255;
$fresh-neon-pink-light: mix(#fff, $fresh-neon-pink, 20%);
$fresh-neon-pink-dark: mix(#000, $fresh-neon-pink, 20%);
.element {
color: $fresh-neon-pink;
box-shadow: 0 0 0 2px rgba($fresh-neon-pink, 0.35);
}