Background ASCII Dither

A full-bleed animated canvas background that renders flowing noise or an image as an ASCII, Bayer-dither, or dot-matrix glyph grid, brightening near the cursor.

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

import AsciiDitherMedia from "@/components/ui/background-ascii-dither";

export default function Demo() {
  return (
    <div className="relative h-screen w-full bg-background text-foreground">
      <AsciiDitherMedia mode="ascii" />
    </div>
  );
}