# Sticker

Die-cut sticker with a white cut edge and a soft shadow, set at a slight tilt. Press it and it lifts off the page while one corner peels back to show the white backing.

> Composed · Free · Data Display — React Native, Expo Go compatible.

## Install

```bash
npx @lumioui/cli add sticker
```

## Import

```tsx
import { HANDWRITING, PAPER, paperShadow, usePaperLift, Sticker } from "@/components/ui/sticker/sticker";
```

## Props

| Prop | Type | Notes |
| --- | --- | --- |
| `className?` | `string` | — |
| `children?` | `React.ReactNode` | Sticker content — text, an icon, a small layout. Ignored when `image` is set. |
| `image?` | `ImageSourcePropType` | Image printed on the sticker. |
| `size?` | `number` | Image side in points (square). Default 112. |
| `shape?` | `"rounded" | "circle" | "pill"` | Die-cut outline. Default "rounded". |
| `edge?` | `number` | White cut edge in points. Default 6. |
| `tilt?` | `number` | Resting tilt in degrees. Default -4. |
| `peel?` | `number` | How far the corner is already peeled at rest, 0–1. Default 0 — it only  peels while pressed. A resting peel shows `backdrop` under the corner. |
| `peelCorner?` | `Corner` | Which corner peels. Default "bottom-right". |
| `backdrop?` | `string` | Colour under the peeled corner — the page the sticker sits on. Default  the theme background. |
| `contentClassName?` | `string` | Classes for the inner face (background, padding) when using children. |
| `haptic?` | `boolean` | Selection haptic as it lifts. Default true. |
| `disabled?` | `boolean` | — |
| `accessibilityLabel?` | `string` | — |

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