Introducción
Una guía de diseño para crear interfaces coherentes con Lustro. Este catálogo toma la estructura de cobertura de PulseFit Design System y la adapta al lenguaje visual oscuro de Lustro. No importa el tema visual ni los datos privados de PulseFit.
LUSTRO · DESIGN SYSTEM
Del fundamento a la pantalla
Parte con los tokens, revisa un componente en acción y luego combina patrones en una vista real.
Cómo usar la guía
- Fundamentos: define color, tipografía e iconografía antes de componer una pantalla.
- Componentes: prueba los estados, los controles y las rutas de teclado en el catálogo.
- Charts, correos y ejemplos: usa los patrones de la guía para datos y flujos de producto cuando estén documentados.
Las demostraciones usan datos ficticios. Si llevas un patrón a producción, añade validación, estados de carga, textos reales, foco visible y etiquetas accesibles. Lustro conserva los tokens fuente y Motion explica las transiciones.