Cursor Glow

Component 1

About

Ambient glow layer that follows the pointer across its container and fades when it leaves. Drop it behind heroes, grids or feature panels.

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

Code

How Cursor Glow is used: the demo's code. The component's own source comes with a free account.

Usage.tsx

import { CursorGlow } from "@/components/ui/cursor-glow";

export default function CursorGlowDemo() {
  return (
    <div className="flex h-screen w-full items-center justify-center bg-background p-8">
      <CursorGlow className="flex h-80 w-full max-w-md items-center justify-center rounded-xl border bg-card">
        <p className="px-8 text-center text-sm text-muted-foreground">
          Move your mouse over this panel to see the glow follow the cursor.
        </p>
      </CursorGlow>
    </div>
  );
}