---
name: "@evilbuttons"
slug: "evilbuttons"
description: "Evil Buttons is a focused shadcn registry of ~18 Motion-powered (motion.dev) animated button and interactive components. Named variants include aqua-button, brutal-button, chrome-button, click-powerup, command-button, copy-button, dither-button, evil-eye-button, frame-button, glitch-button, grid-button, highlight-button, minimal-button, movie-pass, reveal-button, shiny-button, sticky-button, and troll-button. Each is installable via npx shadcn add @evilbuttons/<name>. Built with React, Tailwind CSS, and TypeScript; dark mode ready. Free, MIT licensed. Use for: injecting punchy, motion-driven button interactions into an existing shadcn/ui project with minimal setup and zero design from scratch."
category: "Animated components"
tags: ["3d", "accessibility", "aesthetic", "animation", "buttons", "cards", "theming"]
framework: "react"
license: "Apache-2.0"
author: "radiumcoders"
website: "https://evilbuttons.radiumcoders.com/docs"
github: "https://github.com/radiumcoders/evil-buttons"
registry: "https://evilbuttons.radiumcoders.com/r/index.json"
pro: false
pro_url: null
github_stars: 66
component_count: 31
generated_at: "2026-07-28T08:00:50.948Z"
---

# @evilbuttons

Evil Buttons is a focused shadcn registry of ~18 Motion-powered (motion.dev) animated button and interactive components. Named variants include aqua-button, brutal-button, chrome-button, click-powerup, command-button, copy-button, dither-button, evil-eye-button, frame-button, glitch-button, grid-button, highlight-button, minimal-button, movie-pass, reveal-button, shiny-button, sticky-button, and troll-button. Each is installable via npx shadcn add @evilbuttons/<name>. Built with React, Tailwind CSS, and TypeScript; dark mode ready. Free, MIT licensed. Use for: injecting punchy, motion-driven button interactions into an existing shadcn/ui project with minimal setup and zero design from scratch.

## Links

- Website: https://evilbuttons.radiumcoders.com/docs
- GitHub: https://github.com/radiumcoders/evil-buttons
- Registry JSON: https://evilbuttons.radiumcoders.com/r/index.json
- Directory page: https://sh4dcn.vercel.app/registry/evilbuttons
- This file: https://sh4dcn.vercel.app/md/evilbuttons.md

## Install

```sh
# add the whole registry (shadcn CLI)
npx shadcn@latest add https://evilbuttons.radiumcoders.com/r/index.json
pnpm dlx shadcn@latest add https://evilbuttons.radiumcoders.com/r/index.json
bunx shadcn@latest add https://evilbuttons.radiumcoders.com/r/index.json
# clone the source repo
git clone https://github.com/radiumcoders/evil-buttons.git
# fetch the raw registry index
curl -s https://evilbuttons.radiumcoders.com/r/index.json
```

## Components (31)

| name | type | description | install |
| --- | --- | --- | --- |
| click-powerup | registry:ui | An animated button wrapper with corner brackets, patterned fill, and tap feedback. | `npx shadcn@latest add https://evilbuttons.radiumcoders.com/r/click-powerup.json` |
| sticky | registry:ui | A magnetic button that follows cursor movement with spring physics. | `npx shadcn@latest add https://evilbuttons.radiumcoders.com/r/sticky.json` |
| shiny-button | registry:ui | A glossy, gradient-styled button with a layered inner glow and press feedback. | `npx shadcn@latest add https://evilbuttons.radiumcoders.com/r/shiny-button.json` |
| movie-pass | registry:ui | A ticket-style button like a cinema stub. | `npx shadcn@latest add https://evilbuttons.radiumcoders.com/r/movie-pass.json` |
| minimal | registry:ui | A sleek, minimal button with a subtle repeating linear gradient pattern. | `npx shadcn@latest add https://evilbuttons.radiumcoders.com/r/minimal.json` |
| grid-button | registry:ui | A retro-styled button with a pixelated grid icon and tactile press feedback. | `npx shadcn@latest add https://evilbuttons.radiumcoders.com/r/grid-button.json` |
| dither-button | registry:ui | A button with an animated 4x4 ordered-dither wave background and a knockout label. | `npx shadcn@latest add https://evilbuttons.radiumcoders.com/r/dither-button.json` |
| evil-eye-button | registry:ui | A button with a React Bits evil eye shader background and a fiery readable label. | `npx shadcn@latest add https://evilbuttons.radiumcoders.com/r/evil-eye-button.json` |
| troll-button | registry:ui | A button that flees from the user's cursor. | `npx shadcn@latest add https://evilbuttons.radiumcoders.com/r/troll-button.json` |
| chrome-button | registry:ui | A button with an animated liquid chrome background. | `npx shadcn@latest add https://evilbuttons.radiumcoders.com/r/chrome-button.json` |
| brutal-button | registry:ui | A NeoBrutalism style button with sharp shadows and stark borders. | `npx shadcn@latest add https://evilbuttons.radiumcoders.com/r/brutal-button.json` |
| aqua-button | registry:ui | A glossy pill button inspired by Apple's Aqua interface, with layered highlights and a soft inner glow. | `npx shadcn@latest add https://evilbuttons.radiumcoders.com/r/aqua-button.json` |
| 3d-button | registry:ui | A minimal 3D button with a clean deck-style press and sliding click sheen. | `npx shadcn@latest add https://evilbuttons.radiumcoders.com/r/3d-button.json` |
| frame-button | registry:ui | A futuristic button with animated corner frames and tactile motion interactions. | `npx shadcn@latest add https://evilbuttons.radiumcoders.com/r/frame-button.json` |
| highlight-button | registry:ui | A button with a mouse-following highlight that darkens light surfaces and expands on click. | `npx shadcn@latest add https://evilbuttons.radiumcoders.com/r/highlight-button.json` |
| glitch-button | registry:ui | A button with randomized RGB-split glitch bursts, a scanline overlay, and a flickering label. | `npx shadcn@latest add https://evilbuttons.radiumcoders.com/r/glitch-button.json` |
| command-button | registry:ui | A button that binds a keyboard shortcut globally and pulses with a subtle flash animation when the shortcut fires. | `npx shadcn@latest add https://evilbuttons.radiumcoders.com/r/command-button.json` |
| copy-button | registry:ui | A button that copies a value to the clipboard and transitions through idle, copied, and error states with animated icon swaps. | `npx shadcn@latest add https://evilbuttons.radiumcoders.com/r/copy-button.json` |
| reveal-button | registry:ui | A button that reveals a hidden secret value on hold or toggle, with a blur-in animation and an eye icon indicator. | `npx shadcn@latest add https://evilbuttons.radiumcoders.com/r/reveal-button.json` |
| demonic-button | registry:ui | A hold-to-charge button: keep pressing to slowly strain the devil horns out while it trembles, spits embers, and flashes between black and blood-red like a fil… | `npx shadcn@latest add https://evilbuttons.radiumcoders.com/r/demonic-button.json` |
| hold-button | registry:ui | A hold-to-confirm button whose inner fill grows from 0 to 100%; release early to shake and abort, hold to the end to fire the action. | `npx shadcn@latest add https://evilbuttons.radiumcoders.com/r/hold-button.json` |
| captcha-button | registry:ui | A button that makes you pass an absurd 'select all the evil' emoji captcha before the real action fires. | `npx shadcn@latest add https://evilbuttons.radiumcoders.com/r/captcha-button.json` |
| doubt-button | registry:ui | An escalating-confirmation button that makes you click through increasingly absurd, guilt-tripping prompts before the real action finally fires. | `npx shadcn@latest add https://evilbuttons.radiumcoders.com/r/doubt-button.json` |
| slide-to-detonate | registry:ui | A slide-to-confirm safety gate that makes you drag a handle across a fuse before the real action detonates. | `npx shadcn@latest add https://evilbuttons.radiumcoders.com/r/slide-to-detonate.json` |
| morph-status-button | registry:ui | A single button that morphs through idle, loading, success, and error states in place, with no layout shift. | `npx shadcn@latest add https://evilbuttons.radiumcoders.com/r/morph-status-button.json` |
| cooldown-button | registry:ui | A button that locks itself behind a draining radial timer after each click to stop spam and double-submits, taunting you while you wait. | `npx shadcn@latest add https://evilbuttons.radiumcoders.com/r/cooldown-button.json` |
| pill-button | registry:ui | A compact pill toggle that slides between two labeled faces with a rolling hover label animation. | `npx shadcn@latest add https://evilbuttons.radiumcoders.com/r/pill-button.json` |
| confetti-button | registry:ui | A plain shadcn button that pops on click and fires a confetti celebration burst. | `npx shadcn@latest add https://evilbuttons.radiumcoders.com/r/confetti-button.json` |
| hold-confirm-button | registry:ui | A hold-to-confirm pill button that shrinks while pressed and draws a circular progress ring around it using Motion styleEffect and svgEffect. | `npx shadcn@latest add https://evilbuttons.radiumcoders.com/r/hold-confirm-button.json` |
| dont-press-button | registry:ui | A reverse-psychology button that begs you not to press it, then grows more tempting the closer your cursor gets. | `npx shadcn@latest add https://evilbuttons.radiumcoders.com/r/dont-press-button.json` |
| ash-burst-button | registry:ui | A button that burns on click and erupts ash that collides with the button via Matter.js physics, piling onto its surface. | `npx shadcn@latest add https://evilbuttons.radiumcoders.com/r/ash-burst-button.json` |

## For AI agents

```text
You are adding components from @evilbuttons to a shadcn-compatible project.
1. Read this file (https://sh4dcn.vercel.app/md/evilbuttons.md) for the component list.
2. Fetch the machine-readable index: https://evilbuttons.radiumcoders.com/r/index.json
3. Install a single component with its install command from the table above.
4. Full structured record: https://sh4dcn.vercel.app/json (library slug: evilbuttons).
```
