Components
A button with a live ordered-dithering (Bayer matrix) canvas fill that animates a subtle wave across the surface, with stroked label and configurable dither color, size, and opacity. Pure 2D canvas — no WebGL.
npx shadcn@latest add https://21st.dev/r/radiumcoders/dither-buttonLoading preview...
"use client";
import DitherButton from "@/components/ui/dither-button";
export default function PressStart() {
return (
<div className="flex min-h-screen w-full items-center justify-center bg-background p-12">
<DitherButton ditherColor="#10b981" className="text-[#10b981]">Press Start</DitherButton>
</div>
);
}
Loading preview...
Loading preview...
Loading preview...
Loading preview...