Syed

Interactive Eye Tracker

Component 36

About

An interactive SVG-based eye tracking component that follows the cursor with smooth transitions and dark mode support.

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

Code

How Interactive Eye Tracker is used: the demo's code. The component's own source comes with a free account.

Usage.tsx

import { EyeTracker } from "@/components/ui/interactive-eye-tracker";

export default function Demo() {
  return (
    <div className="flex items-center justify-center min-h-[300px] w-full">
      <EyeTracker shape="Cube" size={120} />
    </div>
  );
}

More by Syed

View all
  • Animated Beam Integration

    Animated Beam Integration

    85
  • Agency Bento Grid

    Agency Bento Grid

    67
  • Morphing Island Navbar

    Morphing Island Navbar

    55
  • Animated Tree View

    Animated Tree View

    40
  • Morphing Language Selector

    Morphing Language Selector

    35
  • Tier Badge

    Tier Badge

    34
  • Grid Testimonials Marquee

    Grid Testimonials Marquee

    27
  • Orbiting Circles

    Orbiting Circles

    25