Componentes

Secciones expandibles con navegación por teclado y paneles de contenido.

Avisos con título, descripción e intención semántica.

Confirmación explícita para acciones importantes.

Contenedor multimedia que conserva su proporción.

Identidad circular en tres tamaños, con variantes rellena o de contorno transparente, imagen, alternativa, estado y grupos superpuestos.

Ruta de enlaces semánticos que muestra la ubicación actual.

Acciones relacionadas con un contorno y nombre accesible compartidos.

Selección de días mediante teclado y navegación por meses.

Diapositivas desplazables con controles anterior y siguiente.

Gráficos adaptables con series del tema y alternativa textual.

Selección independiente con estados marcado, mixto y deshabilitado.

Región de contenido que se muestra u oculta con un botón.

Selección con búsqueda y lista operable mediante teclado.

Lista de comandos con búsqueda, selección por teclado y estado vacío.

Menú de acciones que se abre desde un botón.

Menú contextual que se abre con el puntero o el teclado.

Tabla local con búsqueda, ordenación, paginación y estado vacío.

Selector de fecha compuesto con Popover y Calendar.

Ventana modal para una tarea concreta con gestión del foco.

Panel lateral para detalles y tareas breves.

Panel táctil con gesto de arrastre y cierre explícito.

Contexto de dirección para componentes de derecha a izquierda.

Estado vacío con contexto y una acción útil.

Composición de formularios con etiquetas, ayuda y errores.

Vista previa complementaria asociada a un enlace.

Campo de entrada con prefijos, sufijos y acciones alineadas.

Entrada accesible presentada como grupos de casillas de verificación.

Fila estructurada con contenido multimedia, texto y acciones.

Notación de atajos mediante elementos kbd semánticos.

Etiqueta visible y semántica asociada a un control.

Comandos agrupados con navegación mediante flechas.

Selector nativo con comportamiento de teclado y táctil de la plataforma.

Navegación web con destinos enlazados y secciones expandibles.

Navegación por páginas con identificación de la página actual.

Panel anclado para una tarea interactiva breve.

Cuestionario de selección única con validación de respuestas obligatorias.

Selección mutuamente excluyente controlada mediante flechas.

Paneles redimensionables con límites y separador operable mediante teclado.

Región de desplazamiento delimitada con barras personalizadas.

Selector personalizado con búsqueda al teclear, gestión del foco y estado seleccionado.

Límite visual o semántico entre grupos de contenido.

Marcadores de carga con contorno, compuestos en una tarjeta de perfil completa; pulso opcional y respeto al movimiento reducido.

Control de rango numérico con incrementos por teclado y valor visible.

Indicador de carga indeterminada acompañado de texto.

Ajuste binario inmediato con estado activado o desactivado.

Tabla semántica con título, encabezados, filas y resumen.

Paneles de contenido relacionados con navegación mediante teclado.

Campo de texto multilínea con foco visible y comportamiento nativo.

Notificaciones temporales con estado semántico y controles de cierre.

Botón con estado presionado para una opción de formato reversible.

Conjunto de botones de alternancia con selección compartida.

Ayuda breve y complementaria al pasar el cursor o enfocar.

Fila de archivo con metadatos y acciones explícitas.

Burbujas de mensajes con alineación y variantes semánticas.

Marcador compacto que combina un icono y texto breve.

Estructura de conversación con autor, contenido y metadatos.

Contenedor de conversación con control para volver al último mensaje.

Reproducción controlada, velocidad y disponibilidad del audio. Conecta cualquier motor de audio.

Campos por palabra con navegación de teclado, pegado distribuido y feedback individual.

Una palabra con pronunciación, significado contextual y categoría opcionales.

Tarjetas de vocabulario agrupadas según su función en una frase.

Controles compactos de velocidad y lecturas con preferencia de reproducción automática.

Etiquetas reutilizables y accesibles para combinaciones de teclas.

Las seis variantes de Phosphor con etiquetas accesibles e importación de los iconos utilizados.

Temas claro, oscuro y del sistema con persistencia, inicio sin destello y sincronización entre pestañas.

Botón directo para alternar claro y oscuro, con sol o luna según el tema actual.

Campo de contraseña oculto con un control independiente para mostrarla u ocultarla. Reutiliza los bordes, foco y validación de Input y los iconos Eye/EyeSlash de Phosphor.

Onda decorativa de reproducción que solo se anima mientras suena la voz.

Sticker de juego inclinado para una recompensa confirmada: título, combo, puntos y nota.

Emblema decorativo para una lección o curso completado, con una celebración única.

Progreso tipo niveles para un intento de práctica: un segmento por ejercicio, los hechos en menta y el actual elevado en lila.

Chip de combo con rayo, multiplicador y pips; su tono sigue los mismos niveles que Reward Sticker.

Chip de marcador para puntos o tiempo: icono, etiqueta y una cifra de juego que puede saltar al cambiar.

Controles del juego en una fila, directamente sobre la página: primero las herramientas y al final la acción principal. En barras estrechas las herramientas van en una fila y la acción debajo.

Familia de acciones con siete variantes, ocho tamaños y composiciones para iconos, carga, enlaces y grupos.

Superficie componible para agrupar contenido, contexto y acciones relacionadas.

Etiqueta compacta para estados, categorías y pequeñas cantidades de información.

Campo de texto con foco evidente, estados deshabilitados y señal de error accesible.

Indicador accesible para avance en cursos, tareas y flujos por etapas.

Navegación lateral componible con marca, secciones, estado activo y pie persistente.

Estructura de aplicación que combina navegación, encabezado, acciones y superficie principal.