Astra

Cursor Grid

A crisp grid whose cells light up and fade behind the cursor, with grid styles, tiles and click pulses.

Cursor Grid, a Astra component

Use Cursor Grid in your project

Choose JavaScript or TypeScript and plain CSS or Tailwind. Enable JavaScript for the interactive preview, customization controls and source tabs.

npx shadcn@latest add @react-bits/CursorGrid-TS-TW
How to install Astra components

Related components

  • Cubes

    A grid of outlined 3D cubes that turn to face the cursor, spin when swept and ripple on click.

  • Glare Hover

    A glossy light streak that sweeps across any element in the direction the cursor moves.

  • Glow Cursor

    Light that pours from the cursor, drifts softly through the air and cools as it fades.