shadcn index

Confetti Random Direction

PreviousNext

Example showing confetti with random directions.

Docs
magicuiexample

Preview

Loading preview…
registry/example/confetti-random-direction.tsx
import { ConfettiButton } from "@/registry/magicui/confetti"

export default function ConfettiButtonDemo() {
  return (
    <div className="relative">
      <ConfettiButton
        options={{
          get angle() {
            return Math.random() * 360
          },
        }}
      >
        Random Confetti 🎉
      </ConfettiButton>
    </div>
  )
}

Installation

npx shadcn@latest add @magicui/confetti-random-direction

Usage

import { ConfettiRandomDirection } from "@/components/confetti-random-direction"
<ConfettiRandomDirection />