# Confetti

Celebration burst of soft, accent-coloured specks of light that spill from whatever was just earned and fade away, plus a gentle, pausable rain mode for ambient moments.

> Composed · Pro · Feedback — React Native, Expo Go compatible.

## Install

```bash
npx @lumioui/cli add pro/confetti
```

## Import

```tsx
import { Confetti } from "@/components/ui/confetti/confetti";
```

## Variants

- `burst` — Burst: `npx @lumioui/cli add pro/confetti-burst`
- `rain` — Rain: `npx @lumioui/cli add pro/confetti-rain`

## Props

| Prop | Type | Notes |
| --- | --- | --- |
| `count?` | `number` | Mote count. Default 14 (burst) / 18 (rain). |
| `colors?` | `string[]` | Mote colours. Defaults to the surface accent — one hue, as light. |
| `mode?` | `"burst" | "rain"` | "burst" lights on demand; "rain" drifts ambient motes while active. |
| `fire?` | `boolean` | Declarative trigger — lights a burst on the false→true transition. |
| `active?` | `boolean` | Rain only: run the drift. false dims it out and stops the clock. Default true. |
| `origin?` | `{ x: number` | Where the burst lights, as fractions of the field. Default centre, upper third. |
| `y` | `number }` | — |
| `radius?` | `number` | Radius of the earned object at the origin — motes switch on at its edge. Default 0. |
| `className?` | `string` | — |

Source: https://lumioui.com/components/confetti