Botón con onda al pulsar
Una onda suave se expande desde el punto exacto donde haces clic o tocas el botón.
Ajustes
Código
<button class="uv-ripple">Haz clic</button>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 Botones
Dónde usarlo
El efecto ripple da respuesta inmediata al pulsar, algo que importa en apps web que se usan con el pulgar: el «Añadir al carrito» de una app de comida a domicilio, el «Guardar» de una herramienta de notas o los filtros de un panel de reservas. Si conoces Material Design, te sonará. Lleva unas pocas líneas de JavaScript.
A diferencia de los efectos hover, este funciona igual de bien en el móvil, porque reacciona al toque. Con colores muy claros la onda blanca apenas se ve, así que elige un tono medio u oscuro. A menos velocidad, el gesto se siente más cuidado.