Componentes de Mouse Effects

Componentes de Mouse Effects listos para copiar: demo en vivo y código fuente. Acceso lifetime en Ui Ux Library.

• GazeFollow — Hero de vídeo scrubbeado con el cursor: un personaje pregrabado girando la cabeza sigue al puntero con la mirada (la posición X del cursor decide el frame que se pinta en canvas, con lerp suave). Frames WebP pregenerados con IA; sin puntero hace un barrido automático.
• Gaze2D — Versión 2D de GazeFollow: rejilla de frames (filas = mirada arriba/centro/abajo, columnas = giro izquierda→derecha) y el personaje mira hacia el cursor en cualquier dirección. Canvas + lerp en ambos ejes; órbita automática sin puntero; frames WebP pregenerados con IA.
• StickyCursor — Cursor personalizado con lag elástico y squash&stretch que se pega y se deforma para envolver los elementos interactivos cercanos. En preview un cursor virtual recorre los targets en bucle.
• CometCursor — Un cursor cometa: una cabeza brillante con glow radial que sigue al puntero con un pequeño lag y deja una estela de partículas que se desvanecen, encogen y viran de color, como una estrella fugaz. Las partículas heredan la velocidad de la cabeza y se dispersan un poco. Sin puntero, un cursor virtual recorre una órbita en forma de 8 para animar la estela en el preview. Etiqueta opcional. Solo React + Canvas 2D, con rAF, soporte DPR y respeto a prefers-reduced-motion (cabeza fija con estela corta).
• InkTrail — Trazo de tinta caligráfico que sigue al cursor sobre lienzo oscuro: puntos interpolados con líneas de extremos redondeados, grosor variable según la velocidad (más rápido → más fino) y una cola que se estrecha y se desvanece en ~1s. Degradado opcional de cabeza a cola. Sin puntero real, un cursor virtual recorre una figura-8 en bucle para animar el preview. Canvas 2D con rAF y DPR; en prefers-reduced-motion pinta un trazo de muestra estático.