How to use

import { DrawingCursorEffect } from "@/components/v1/skiper59";

const CustomDrawingEffect = () => {
  return (
    <DrawingCursorEffect
      type="drawAlways"
      strokeColor="#ffffff"
      strokeWidth={2}
      followEffect={true}
      customCursor={true}
      className="h-screen w-full"
    >
      <div className="p-8 text-center text-white">
        <h1 className="text-4xl font-bold">Drawing Trail Effect</h1>
        <p className="mt-2">Move cursor to see the effect.</p>
      </div>
    </DrawingCursorEffect>
  );
};

Types

interface DrawingCursorEffectProps {
  children?: React.ReactNode;
  strokeColor?: string;
  strokeWidth?: number;
  type: "drawOnHold" | "drawAlways";
  followEffect?: boolean;
  customCursor?: boolean;
  className?: string;
}
x;

Attribution

• Cursor effect inspired by Artemiy Lebedev