Astra

Dot Grid

A springy dot grid that the cursor flicks and drags through like jelly, with click shockwaves.

Dot Grid, a Astra component

Use Dot 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/DotGrid-TS-TW
How to install Astra components

Related components

  • Dot Field

    A gradient dot field seen through a lens that follows the cursor, magnifying, pinching or swirling the dots.

  • Ripple Grid

    A crisp grid that ripples like water, bending and lighting up as waves pass through it.

  • Web Threads

    Glowing threads woven through luminous pinch points that light up under the cursor and carry light on click.