Color con nombre · #F06FFF
Ultra Pink
Ultra Pink es #F06FFF: rgb(240 111 255), hsl(294 100% 72%), oklch(0.748 0.231 323.4). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Purple mean? → · Ultra Pink color name →
#F06FFF
oklch(0.748 0.231 323.4)
Conversiones de color
- HEX
- #f06fff
- RGB
- rgb(240 111 255)
- HSL
- hsl(294 100% 72%)
- HWB
- hwb(294 44% 0%)
- OKLCH
- oklch(0.748 0.231 323.4)
- OKLab
- oklab(0.748 0.186 -0.138)
- CIE Lab
- lab(67.16 64.65 -49.64)
- LCH
- lch(67.16 81.5 322.5)
- CMYK
- cmyk(6% 56% 0% 0%)
Tintes · Sombras · Tonos
Tintes
- F380FF
- F590FF
- F79FFF
- F9AEFF
- FBBCFF
- FCC9FF
- FDD7FF
- FEE5FF
- FFF2FF
Sombras
- D160DE
- B251BE
- 95429E
- 783480
- 5D2763
- 431A48
- 2A0E2E
- 140416
- 030103
Tonos
- E573F2
- DA76E5
- CF79D9
- C47BCC
- B97DBF
- AE7EB3
- A27FA6
- 978099
- 8C808D
Armonías de color
Complementario +180°
- F06FFF
Ultra Pink
- 2CD035
≈ Bitter Lime and Defeat
Análogo -30° +30°
- F06FFF
Ultra Pink
- B29AFF
≈ Cobalite
- FF78B6
≈ Dream Setting
Triádico +120° +240°
- F06FFF
Ultra Pink
- DBA300
≈ Golden Beryl Yellow
- 00C4D1
≈ Turquoise Surf
Complementario dividido +150° +210°
- F06FFF
Ultra Pink
- AEB700
≈ Snot
- 00CAA5
≈ Jadeite
Tetrádico +90° +180° +270°
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 2.49:1 · APCA Lc 48
Ag
AAASobre negro
WCAG 8.42:1 · APCA Lc 54
Mejor color de texto: #000000
WCAG 8.42:1 (AAA) · APCA Lc 54
Contrast pairs
Fragmentos de código
CSS
:root {
--ultra-pink: #f06fff;
--ultra-pink-rgb: 240 111 255;
--ultra-pink-oklch: oklch(0.748 0.231 323.4);
}
.element {
color: var(--ultra-pink);
background-color: hsl(294 100% 72%);
border-color: oklch(0.748 0.231 323.4);
}Tailwind CSS v4
@theme {
--color-ultra-pink: #f06fff;
--color-ultra-pink-50: #ffdfff;
--color-ultra-pink-100: #ffcdff;
--color-ultra-pink-200: #ffb0ff;
--color-ultra-pink-300: #f289f7;
--color-ultra-pink-400: #dd64eb;
--color-ultra-pink-500: #ca35db;
--color-ultra-pink-600: #aa2fb9;
--color-ultra-pink-700: #892694;
--color-ultra-pink-800: #641b71;
--color-ultra-pink-900: #461250;
--color-ultra-pink-950: #2e0335;
}SCSS
$ultra-pink: #f06fff;
$ultra-pink-rgb: 240, 111, 255;
$ultra-pink-light: mix(#fff, $ultra-pink, 20%);
$ultra-pink-dark: mix(#000, $ultra-pink, 20%);
.element {
color: $ultra-pink;
box-shadow: 0 0 0 2px rgba($ultra-pink, 0.35);
}