Couleur nommée la plus proche · #F255FE
#F255FE
Couleur nommée la plus proche: Violet Pink
#F255FE (rgb(242 85 254), hsl(296 99% 66%), oklch(0.722 0.265 324.9)) est la plus proche de la couleur nommée Violet Pink. Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
#F255FE
oklch(0.722 0.265 324.9)
Conversions de couleur
- HEX
- #f255fe
- RGB
- rgb(242 85 254)
- HSL
- hsl(296 99% 66%)
- HWB
- hwb(296 33% 0%)
- OKLCH
- oklch(0.722 0.265 324.9)
- OKLab
- oklab(0.722 0.217 -0.153)
- CIE Lab
- lab(63.57 75.17 -54.72)
- LCH
- lch(63.57 92.97 323.9)
- CMYK
- cmyk(5% 67% 0% 0%)
Teintes · Ombres · Tons
Teintes
- F56CFF
- F87FFF
- FA91FF
- FCA2FF
- FDB3FF
- FEC2FF
- FFD2FF
- FFE1FF
- FFF0FF
Ombres
- D249DD
- B43DBD
- 96319E
- 792680
- 5E1C63
- 431147
- 2B082D
- 140216
- 030003
Tons
- E75EF1
- DC65E5
- D16BD8
- C670CC
- BB74BF
- AF78B3
- A47BA6
- 987D99
- 8C7F8D
Harmonies de couleurs
Complémentaire +180°
- F255FE
Violet Pink
- 00C736
≈ Felwood Leaves
Analogue -30° +30°
- F255FE
Violet Pink
- AD8EFF
≈ Lilac Geode
- FF66AC
≈ Yíng Guāng Sè Pink
Triadique +120° +240°
- F255FE
Violet Pink
- D09C00
≈ Leopard
- 00BBCA
≈ Panorama Blue
Complémentaire divisée +150° +210°
- F255FE
Violet Pink
- A3B000
≈ Marker Green
- 00C0A0
≈ First Post
Tétradique +90° +180° +270°
Contraste et accessibilité
Ag
FailSur blanc
WCAG 2.79:1 · APCA Lc 53
Ag
AAASur noir
WCAG 7.50:1 · APCA Lc 49
Meilleure couleur de texte: #000000
WCAG 7.50:1 (AAA) · APCA Lc 49
Contrast pairs
Extraits de code
CSS
:root {
--violet-pink: #f255fe;
--violet-pink-rgb: 242 85 254;
--violet-pink-oklch: oklch(0.722 0.265 324.9);
}
.element {
color: var(--violet-pink);
background-color: hsl(296 99% 66%);
border-color: oklch(0.722 0.265 324.9);
}Tailwind CSS v4
@theme {
--color-violet-pink: #f255fe;
--color-violet-pink-50: #ffdbff;
--color-violet-pink-100: #ffc8ff;
--color-violet-pink-200: #ffa9ff;
--color-violet-pink-300: #fb7ffd;
--color-violet-pink-400: #e754f2;
--color-violet-pink-500: #d500e3;
--color-violet-pink-600: #b40dbf;
--color-violet-pink-700: #900e9a;
--color-violet-pink-800: #6a0975;
--color-violet-pink-900: #4b0753;
--color-violet-pink-950: #310038;
}SCSS
$violet-pink: #f255fe;
$violet-pink-rgb: 242, 85, 254;
$violet-pink-light: mix(#fff, $violet-pink, 20%);
$violet-pink-dark: mix(#000, $violet-pink, 20%);
.element {
color: $violet-pink;
box-shadow: 0 0 0 2px rgba($violet-pink, 0.35);
}