Boids Flock

An animated flock of simple triangular agents drawn on a canvas, following classic boids separation/alignment/cohesion rules and reacting to the pointer, used as ambient motion in a hero, empty state, or loading background.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Boids Flock to your project and fits it to your theme.

import { BoidsFlock } from "@/components/ui/boids-flock";

export default function BoidsFlockScatterDemo() {
  return (
    <div className="relative h-screen w-full bg-background text-foreground">
      <BoidsFlock pointer="flee" className="absolute inset-0" />
    </div>
  );
}