Características
Historia con scroll
Pasos que se apilan al hacer scroll, con CSS puro: una lista normal en pantallas pequeñas y con movimiento reducido.
How it works
From idea to shipped section in four moves.
Step 1: Describe the outcome
Start from what the visitor should be able to do, not from the screens. One sentence is enough.
Step 2: Compose from real parts
Assemble the section from components that already handle focus, state and theming.
Step 3: Check it in every theme
Semantic tokens mean the same markup holds up across presets, dark mode and your own palette.
Step 4: Ship the source
Copy the file, change the words, keep the behaviour. Nothing to install but what you already use.
Qué se mueve
Cada tarjeta se fija y la siguiente se desliza encima. El scroll nativo no se toca, así que nada atrapa la página; por debajo del punto md o con movimiento reducido las tarjetas fluyen normalmente.
Código del bloque
pnpm add @voltui/componentsUn componente standalone. Pégalo en tu proyecto, apunta los imports a tu ruta de Volt y conecta los botones a tus propias rutas.
Cada animación aquí está protegida por prefers-reduced-motion, y los colores salen de los tokens del tema — prueba otro preset con el selector de la cabecera y el bloque lo sigue.