Ráfaga al clic

Rayos finos que estallan donde haces clic: viajan hacia afuera, se despegan de su origen y dejan un anillo y chispitas.

Vista previa en vivo

Haz clic en cualquier parte

Instalación

1. Instala el paquete

npm i furin

2. Impórtalo

import { ClickBurst } from "furin";

También con pnpm add furin, yarn add furin o bun add furin. Cada componente trae su CSS y lo importa por ti.

Prop	Tipo	Por defecto	Descripción
color	string	"#8EA2FF"	Color de los rayos.
rays	number	12	Cuántos rayos salen en cada ráfaga.
radius	number	64	Alcance de los rayos, en px.
duration	number	720	Duración de cada ráfaga, en milisegundos.
thickness	number	2.4	Grosor de los rayos, en px.
ring	boolean	true	Dibuja el anillo y el destello central.
global	boolean	false	Estalla en toda la ventana en vez de solo en el contenedor.
autoplay	boolean	false	Estalla solo, en puntos al azar, cuando nadie hace clic.

Linterna
Pro
Una capa oscura que solo deja ver el contenido oculto donde apunta el haz de una linterna, con luz cálida, resorte al abrirse y caída suave.
Cursores
Anillo elástico
Gratis
Un anillo que sigue al cursor con retraso elástico, se estira con la velocidad y, sobre lo clicable, se transforma en su silueta como un imán suave.
Cursores
Cursor gelatina
Gratis
Un cursor de gelatina translúcida con brillo especular: arrastra gotas que lo siguen, se estiran en la estela y se funden con él cuando te detienes.
Cursores