Gira la idea
Hélice de letras que gira con el scroll
La frase se enrolla en una espiral 3D que gira al bajar; las letras de detrás se apagan para leer bien la cara frontal.
Ajustes
Código
<div class="uvq14-hlx"><div class="sc" tabindex="0" aria-label="Gira la idea"><div class="tr"><div class="st"><p class="sr">Gira la idea</p><div class="hx" aria-hidden="true" translate="no"><b class="pre">Gira la idea</b></div><i class="ax" aria-hidden="true"></i></div></div></div><span class="hn" aria-hidden="true"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 5v14M6 13l6 6 6-6"/></svg>Desplázate</span></div>Prompt para IA
Pégalo en ChatGPT, Claude o Cursor y adaptará el bloque a tu proyecto con estos ajustes, aunque no uses React.
Más en Texto y scroll
Ver todos: Texto y scrollDónde usarlo
Este bloque enrolla una frase corta en una hélice hecha con transformaciones 3D de CSS. Al hacer scroll dentro de la caja la espiral gira y sube, una deriva lenta la mantiene viva cuando nadie la toca y cada letra se apaga según su profundidad para que la cara frontal se lea bien. Sirve como apertura de sección, cartel de festival o lema de marca con juego.
Cambia la frase en el campo de texto; se repite hasta llenar la espiral. El color principal tiñe las letras y el brillo del fondo. Los lectores de pantalla reciben la frase una sola vez como texto normal y, con movimiento reducido, la deriva se detiene y solo la mueve el scroll.