Gota de vidrio

Una gota de vidrio líquido sigue al cursor y se funde con los bordes de los botones, estirándose como un líquido.

Vista previa en vivo

Instalación

1. Configura el registro Pro una sola vez

Los componentes Pro no están en npm ni en el registro público de shadcn: se instalan con tu licencia desde el registro privado de Furin.

2. Instala Gota de vidrio

npx shadcn@latest add @furin-pro/liquid-glass-drop

Prop	Tipo	Por defecto	Descripción
items	string[]	"[Inicio, Explorar, Guardar]"	Etiquetas de los botones de vidrio (si no pasas children).
children	ReactNode	""	Tus propios botones o enlaces; la gota se funde con cada uno.
size	number	74	Diámetro de la gota, en px.
goo	number	30	Qué tan lejos se estira el vidrio para fundirse con un botón, en px.
refraction	number	1	Fuerza de la refracción de la gota.
stiffness	number	170	Rigidez del resorte con el que la gota persigue al cursor.
scene	boolean	false	Pinta una escena de color detrás del vidrio.
auto	boolean	false	La gota visita los botones sola cuando no hay cursor.

Nivel de burbuja
Pro
Deslizador con forma de nivel de burbuja: la burbuja sigue el valor con física y el cuerpo se inclina como un nivel de verdad.
Vidrio
Plástico de burbujas
Pro
Burbujas de plástico que se hunden al pasar y revientan al clic con sonido; las reventadas quedan arrugadas.
Vidrio
Tarjeta helada
Pro
Tarjeta de vidrio con condensación; las gotas se juntan y escurren, dejando huella, cuando la inclinas.
Vidrio