Listo
Un solo tema compartido
Cada componente usa los mismos roles semánticos.
Leer la guíaProbador de paletas
Asigna roles semánticos, previsualiza el mismo tema en contexto y encuentra riesgos de contraste.
Editor del tema
Checks de contraste enfocados
Escena de vista previa
Las simulaciones de visión son aproximaciones aplicadas solo a la vista previa.
Editor del tema
Escena de vista previa
Escena de vista previa
Sitio de producto
Navegación, contenido principal, tarjetas, enlaces y llamadas a la acción.
Escritorio
Northstar
Construye un flujo de producto más claro.
Un ejemplo compacto de jerarquía, acciones, enlaces y superficies trabajando juntos.
Auditoría de accesibilidad
Los 7 checks pasan.
Pasa
| Par de roles | Ratio | Umbral | Estado |
|---|---|---|---|
| Texto del cuerpo sobre el fondo de página Texto del cuerpo / Fondo de página El texto normal debe alcanzar al menos 4.5:1 contra la página. | Ratio 14.63:1 | Umbral 4.5:1 | Estado Pasa |
| Encabezado sobre el fondo de página Texto de encabezado / Fondo de página El texto grande debe alcanzar al menos 3:1 contra la página. | Ratio 17.85:1 | Umbral 3:1 | Estado Pasa |
| Texto del cuerpo sobre la superficie Texto del cuerpo / Superficie El texto normal debe seguir legible en tarjetas y paneles. | Ratio 13.98:1 | Umbral 4.5:1 | Estado Pasa |
| Etiqueta primaria sobre relleno primario Etiqueta primaria / Relleno primario Las acciones primarias necesitan etiquetas legibles en cada estado. | Ratio 6.70:1 | Umbral 4.5:1 | Estado Pasa |
| Etiqueta secundaria sobre relleno secundario Etiqueta secundaria / Relleno secundario Las acciones secundarias también necesitan etiquetas legibles. | Ratio 14.48:1 | Umbral 4.5:1 | Estado Pasa |
| Indicadores de estado sobre la superficie Retroalimentación / Superficie El color más débil de éxito, aviso o error debe alcanzar 3:1. Rol más débil: Éxito | Ratio 4.79:1 | Umbral 3:1 | Estado Pasa |
| Indicador de foco sobre el fondo de página Indicador de foco / Fondo de página El foco de teclado debe seguir visible contra la página. | Ratio 7.09:1 | Umbral 3:1 | Estado Pasa |
Mira una paleta en contexto antes de publicarla.
Las escenas son vistas ilustrativas y el audit es un conjunto enfocado, no una garantía completa de cumplimiento.