Vibeset

Ondas de puntos

Un titular enorme hecho de puntos: todos los de la caja tiemblan con una ola que la cruza en diagonal, pero los que caen dentro de las letras son más grandes y más claros, y eso dibuja el texto. Al pasar el puntero salpica con ondas circulares, y al aparecer el texto se descubre de izquierda a derecha. La máscara del texto sale de dibujarlo en un lienzo auxiliar de una celda por píxel y leer su transparencia: cualquier tipografía y cualquier texto, sin listas de coordenadas, y se reescala para llenar el ancho. Es Canvas 2D y no WebGPU, así que funciona en cualquier navegador y no necesita plan B. El lienzo va oculto a los lectores y el contenedor es una imagen con el texto como nombre; con el dial a cero se dibuja un solo fotograma con el texto ya descubierto.

Y el original de React Bits: Shape Waves

Esta pieza está escrita desde cero en Vibeset: no se ha copiado ni portado nada de React Bits. Hace algo parecido a su Shape Waves, y esto es lo que vimos del suyo por si prefieres usar el original.

Cuándo sí

Para un titular enorme en una portada de marca o de evento, en navegadores modernos. Solo si tienes plan B para el resto.

Ojo con

WebGPU no está en todos los navegadores, y vgpu es una librería de mayo de 2026 que en octubre iba por la versión 0.6. El registro de React Bits fijaba entonces la ^0.3.1, una versión vieja: mira cuál instala hoy. Hace falta un texto normal que se vea cuando falle (hay una prop onError).

Accesibilidad

Respeta el movimiento reducido del sistema. El texto vive dentro del canvas: ponlo también en el HTML.