Un estado debe sentirse distinto antes de explicarse.
Recorra la escala para probar superficies tenues, bordes interactivos, acciones sólidas y texto, sin cambiar la composición.
Estado de interfaz seleccionado
← Volver al directorio de paletas
Prueba de estados de interfaz
Verifique cada estado rosa antes de publicarlo.
La escala Pink de doce pasos, verificada con la fuente, se convierte en una única prueba de estados. Seleccione un paso y observe cómo la misma muestra pasa de una superficie tenue a un borde, una acción y un texto legible.
- Pasos de la escala
- 12
- Grupos de roles
- 4
- Versión
- 3.0.0
Procedencia fijada
La exportación Pink clara y opaca exacta, fijada en 3.0.0.
Esta referencia contiene solo Pink 1–12 de la exportación sRGB clara y opaca de @radix-ui/colors 3.0.0. Las variantes oscuras, alpha y P3 quedan fuera.
Hexees es una referencia independiente, sin afiliación ni respaldo de WorkOS o Radix.
- Versión
- @radix-ui/colors 3.0.0
- Licencia
- MIT License
Registro compacto de tokens
Doce estados exactos, medidos en paralelo.
Se conserva el orden oficial. Cada tarjeta compacta reúne el rol documentado, el valor sRGB exacto, el contraste de texto calculado y formatos listos para copiar.
01
#FFFCFEFondo de aplicación
pink-1
- RGB
rgb(255 252 254)- Texto negro
- 20,61:1
- Texto blanco
- 1,02:1
Más formatos
02
#FEF7FBFondo tenue
pink-2
- RGB
rgb(254 247 251)- Texto negro
- 19,91:1
- Texto blanco
- 1,05:1
Más formatos
03
#FEE9F5Fondo de componente
pink-3
- RGB
rgb(254 233 245)- Texto negro
- 18,19:1
- Texto blanco
- 1,15:1
Más formatos
04
#FBDCEFComponente al pasar el puntero
pink-4
- RGB
rgb(251 220 239)- Texto negro
- 16,59:1
- Texto blanco
- 1,27:1
Más formatos
05
#F6CEE7Componente activo
pink-5
- RGB
rgb(246 206 231)- Texto negro
- 14,90:1
- Texto blanco
- 1,41:1
Más formatos
06
#EFBFDDBorde tenue
pink-6
- RGB
rgb(239 191 221)- Texto negro
- 13,17:1
- Texto blanco
- 1,59:1
Más formatos
07
#E7ACD0Borde interactivo
pink-7
- RGB
rgb(231 172 208)- Texto negro
- 11,21:1
- Texto blanco
- 1,87:1
Más formatos
08
#DD93C2Borde fuerte o contorno de teclado
pink-8
- RGB
rgb(221 147 194)- Texto negro
- 9,03:1
- Texto blanco
- 2,33:1
Más formatos
09
#D6409FFondo sólido de acción
pink-9
- RGB
rgb(214 64 159)- Texto negro
- 5,09:1
- Texto blanco
- 4,12:1
Más formatos
10
#CF3897Fondo sólido al pasar el puntero
pink-10
- RGB
rgb(207 56 151)- Texto negro
- 4,67:1
- Texto blanco
- 4,50:1
Más formatos
11
#C2298ATexto de contraste reducido
pink-11
- RGB
rgb(194 41 138)- Texto negro
- 3,98:1
- Texto blanco
- 5,28:1
Más formatos
12
#651249Texto de contraste elevado
pink-12
- RGB
rgb(101 18 73)- Texto negro
- 1,74:1
- Texto blanco
- 12,10:1
Más formatos
Alcance del catálogo
Una prueba de estados completa, no doce páginas de búsqueda.
La colección solo se indexa mientras los doce valores publicados coincidan con el manifiesto fijado. Las páginas de cada token siguen en noindex para que la referencia completa sea el destino útil.
Los roles documentados y las relaciones de contraste calculadas son evidencia inicial, no una certificación. Pruebe tipografía, controles, bordes, navegación por teclado y superficies adyacentes en la interfaz final.