# Stamp

> A rubber stamp that slams down with real ink.

It drops from above, lands with a squash, leaves uneven ink and knocks the surface under it. For approvals, shipped orders, completed tasks, certificates and 'sold out' moments.

- Family: Originals
- Plan: Creative. Included with Creative.
- Requires: React, Tailwind CSS v4 and the motion package
- Page with a live preview: https://galactrex.com/ui/stamp/
- Licence: https://galactrex.com/ui/license/

## Install

```sh
npx @galactrex/ui login   # once, with an API key from https://galactrex.com/account/
npx @galactrex/ui add stamp
```

It installs to `components/galactrex/stamp.tsx`, with the shared motion helpers beside it. First time in a project: `npx @galactrex/ui init` (setup guide: https://galactrex.com/docs/ui-components-setup/).

## Usage

```tsx
import { Stamp } from "@/components/galactrex/stamp";

<Stamp label="Approved" detail="04 · 10 · 26" trigger="manual" stamped={approved} />
```

## Props

| Prop | Type | Default | Description |
| --- | --- | --- | --- |
| `label` | `string` | — | The stamped word. |
| `detail` | `string` | — | A small second line, such as a date. |
| `trigger` | `"mount" \| "inView" \| "manual"` | `"inView"` | When it lands. |
| `stamped` | `boolean` | — | Lands when true, for trigger="manual". |
| `tilt` | `number` | `-8` | Resting tilt in degrees. |
| `wear` | `number` | `0.45` | How worn the ink looks, 0 to 1. |
| `impact` | `boolean` | `true` | Knock the surface it lands on. |
| `onStamp` | `() => void` | — | Called when it touches down. |
| `className` | `string` | — | Extra classes for the outer element. |

## Variants

- **Approval.** Lands when a request is approved: `trigger="manual"`.
- **Certificate.** With `detail` for a date or a number.

## Accessibility

- The label is real text, readable before and after the animation.
- The ink texture is an SVG filter; contrast stays that of the theme ink.

## Motion

- Transform and opacity for the drop; one Web Animations knock on the parent.
- Reduced motion: it is simply there, without drop or knock.