Confetti

Renders a canvas for confetti animations. It fires confetti when triggered or on mount. Use it to add celebratory effects during user interactions or events.

byMagic UI

Installation

terminal

pnpm dlx layro-cli add @magicuidesign/confetti

npx layro-cli add @magicuidesign/confetti

npx layro-cli add @magicuidesign/confetti

bunx layro-cli add @magicuidesign/confetti

New project? Start with init. Writes third-party code and installs packages with scripts off.

Code

Dependencies

Demo

"use client"

import type { ReactNode } from "react"
import React, {
  createContext,
  forwardRef,
  useCallback,
  useEffect,
  useImperativeHandle,
  useMemo,
  useRef,
} from "react"
import type {
  GlobalOptions as ConfettiGlobalOptions,