Laboratorio de componente
Header
Página de laboratorio para construir headers reutilizables. Primero se define la estructura base; luego se agregan estilos visuales, animaciones, efectos, estados y código generado.
Preview
Preview base del header
Estilos visuales
Opciones de estilo
Base lista para aplicar estilos: minimal, glass, espacial, liquid glass y contraste alto.
Animaciones
Opciones de movimiento
Opciones previstas: entrada suave, sticky al hacer scroll y menú móvil desplegable.
Efectos
Opciones de FX
Opciones previstas: blur, glow, borde luminoso, sombra y reflejo sutil.
Estados
Estados de interacción
Estados previstos: normal, hover, focus, activo, scrolled y menú móvil abierto.
Código generado
Combinación actual
HEAD-001 + STYLE-001 + ANIM-001 + FX-001 + STATE-001El código generado se conectará cuando existan variantes seleccionables.