Pixel cursor

A cursor-following pixel trail — a speed-gated brush lights sparse square pixels on a Canvas2D grid, banded into a bright core color and two secondary outer rings as the signal decays.

Customize

Main color

Edge 1

Edge 2

Pixel size5px

Spread10px

Density75%

Trail2.9

Delay95%

Usage

import { PixelCursor } from "@/components/lazy-ui/pixel-cursor";

export function Demo() {
  return (
    <div className="relative h-96 w-full overflow-hidden bg-black">
      <PixelCursor
        color="#ffffff"
        edgeColor1="#7c3aed"
        edgeColor2="#22d3ee"
        lag={0.8}
      />
    </div>
  );
}