# Confetti

> A confetti burst you fire from code.

Source: https://ngwr.dev/bits/confetti  
Updated in v15

## Installation

Import the class. This entry point has no stylesheet.

```typescript
import { WrConfetti } from 'ngwr/bits/confetti';
```

## Playground

Inject `WrConfetti` and call `fire()`.

```angular-ts
private readonly confetti = inject(WrConfetti);

onWin(): void {
  this.confetti.fire({
    count: 80,
    spread: 60,
    velocity: 12,
    gravity: 0.35,
  });
}
```

## API

| Name | Description | Type | Default |
| --- | --- | --- | --- |
| `WrConfetti.fire(opts?)` | Fires a confetti burst. Options: `count`, `spread`, `angle` (90 = up, 0 = right), `velocity`, `gravity`, `drag`, `origin`, `colors` (any CSS colour or token; the theme intents by default, read at fire time so dark mode recolours), `size`, `ttl`. | `service method` | `—` |

## See also

- [Click Spark](https://ngwr.dev/bits/click-spark) — Sparks that burst from wherever you click inside it.
- [Result](https://ngwr.dev/reference/components/result) — A full-size outcome screen, with ready-made 404, 403 and 500 pages.