TrollButton is a highly evasive component that actively moves away from the user's cursor as they try to click it. It creates a fun, frustrating, and playful interaction using precise motion physics to jump out of reach whenever hovered.

Preview

TrollButton

Interactive

Install

Add the item with the shadcn CLI.

npx shadcn@latest add @evilbuttons/troll-button

Usage

[]txt
import TrollButton from "@/components/evil-buttons/troll-button";

export function ButtonDemo() {
  return <TrollButton>Click If You Can</TrollButton>;
}

Props

PropTypeDefaultDescription
childrenReact.ReactNode-The visible button label or content.

Registry

The registry item includes components/evil-buttons/troll-button.tsx and installs motion as a dependency. It relies on the standard Button component from shadcn/ui.