Astra

Ripple Grid

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

Ripple Grid, a Astra component

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

Related components

  • Dot Grid

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

  • Line Waves

    Fine lines that flow in silky waves while a band of light drifts through them.

  • Liquid Chrome

    Soft ribbons of liquid chrome that swirl through a dark pool, ripple under the cursor and catch the light as it moves.