Grid Motion

An animated grid motion background with content cells.

background grid

Item 1

Item 2

Item 3

Item 4

Item 5

Item 6

Item 7

Item 8

Item 9

Item 10

Item 11

Item 12

Item 13

Item 14

Item 15

Item 16

Item 17

Item 18

Item 19

Item 20

Item 21

Item 22

Item 23

Item 24

Item 25

Item 26

Item 27

Item 28

import GridMotion from "@/components/vritti/grid-motion";

export function GridMotionExample() {
  return (
    <div className="relative h-[400px] w-full overflow-hidden rounded-lg">
      <GridMotion />
    </div>
  );
}

Installation


pnpm dlx shadcn@latest add "https://vritti.thesatyajit.com/r/grid-motion"

Dependencies


pnpm add gsap