Cursor

Neon trail cursor

Neon trail cursor: Un haz de luz cónico atravesó la trayectoria reciente del puntero, cálido y ancho en la cabeza, adelgazando y cambiando de color hacia la cola.

Every path we draw fades before the next one begins.

Cómo usar Neon trail cursor

Neon trail cursor se presenta con el formato de vista previa «ancho» y el tema «oscuro».

Personalizar la vista previa

Estos controles se pasan a la demo. Los valores y límites describen la vista previa; consulta la implementación para conocer todas sus props.

Control	Tipo	Valor inicial	Límites de la vista previa
`trailLength`	`number`	`40`	De 10 a 64; paso 2
`width`	`number`	`8`	De 2 a 20; paso 1
`followSpeed`	`number`	`0.16`	De 0.05 a 0.6; paso 0.01
`idleFade`	`boolean`	`true`	Los metadatos no indican otro límite.
`color`	`color`	`#FF6A1F`	Los metadatos no indican otro límite.
`tailColor`	`color`	`#F5C542`	Los metadatos no indican otro límite.

¿Para qué frameworks está disponible Neon trail cursor?

Neon trail cursor está disponible para React, Vue, Svelte, Astro, HTML. La vista previa usa React; las observaciones sobre el código corresponden a index.tsx. Revisa la versión elegida antes de asumir que ofrece las mismas interacciones.

¿Qué dependencias tiene Neon trail cursor?

Los metadatos de React indican estas dependencias npm además de React: clsx.

¿Qué detalles de accesibilidad se observan en Neon trail cursor?

El código React de Neon trail cursor incluye: atributos y manejadores (aria-hidden). Son observaciones del código. Comprueba los nombres accesibles, el orden del foco y el comportamiento del teclado en la página completa.

¿Cómo maneja Neon trail cursor el movimiento reducido?

Neon trail cursor consulta la preferencia de movimiento en su código React mediante matchMedia(prefers-reduced-motion). Revisa la implementación completa, los estilos compartidos y la versión elegida con movimiento reducido activado; estas observaciones no garantizan que se detengan todas las animaciones.

Conecta tu agente

Componentes abiertos relacionados

Imagen fija del componente Smoke trail cursor de Fieldbook, de la categoría Cursor.

1806Smoke trail cursorCursorUna nube suave y agitada que sigue el puntero como si fuera humo, se enrosca sobre sí misma cuando cambias de dirección y se disuelve cuando te detienes.

Imagen fija del componente Swarm trail cursor de Fieldbook, de la categoría Cursor.

1815Swarm trail cursorCursorUna nube de manchas suaves orbita el puntero dentro de un panel, dejando rastros ahusados y fusionándose en una forma donde se superponen.

Imagen fija del componente Tile trail de Fieldbook, de la categoría Cursor.

1796Tile trailCursorUn sendero de puntero que deja caer pequeñas baldosas redondeadas a lo largo del camino, cada una de las cuales surge de una piscina reciclada y se aleja a medida que otras nuevas ocupan su lugar.

Imagen fija del componente Stamped cursor trail de Fieldbook, de la categoría Cursor.

1812Stamped cursor trailCursorTarjetas pequeñas estampadas a lo largo de la trayectoria del puntero a intervalos de distancia fijos, cada una de las cuales cae con una inclinación y envejece detrás del cursor.

Imagen fija del componente Bracket lock cursor de Fieldbook, de la categoría Cursor.

1764Bracket lock cursorCursorUn puntero personalizado de cuatro soportes de esquina que gira mientras está inactivo y se abre alrededor de cualquier elemento marcado como objetivo.

Imagen fija del componente Fluid Splash de Fieldbook, de la categoría Cursor.

1776Fluid SplashCursorArrastrar por el panel empuja la tinta a través de una simulación fluida, por lo que el color ondea, se curva y se disipa lentamente detrás del puntero.