# Wax Seal

A document card you sign and seal. Draw your signature on a pen-like pad (strokes thin with speed and follow pen pressure; Enter signs with your name), then seal it: molten WebGL wax drops land and merge into a pool, a brass and walnut stamp comes down with its shadow tightening, squeezes the wax into a rim, rocks, lifts away to show the emblem in relief, and the wax cools from wet gloss to satin.

- Page and source: https://uibrik.com/components/wax-seal
- Install (Pro, needs a license key, see https://uibrik.com/docs/pro): `npx shadcn@latest add @uibrik-pro/wax-seal`
- Packages: none beyond React
- Import: `import { WaxSeal } from "@/components/uibrik/wax-seal/wax-seal"`

Where to use the Wax Seal React component:

- **Contract signing**: A seal makes accepting an agreement feel final and deliberate.
- **Approvals**: Sign-offs on budgets, releases or reviews get a moment of weight.
- **Certificates**: Issuing a certificate or credential ends on a real seal.

| Prop | Type | Default | Description |
| --- | --- | --- | --- |
| color | `string` | `"#961e1e"` | Colour of the wax. |
| monogram | `string` | `"A"` | One or two letters struck into the seal. |
| size | `number` | `68` | Diameter of the seal. |
| speed | `number` | `1` | Playback speed of the sealing. |
| undo | `boolean` | `true` | Offer an Undo for a few seconds after sealing. |
| width | `number` | `380` | Width of the card. |
| sealed | `boolean` |  | Whether the document is sealed (controlled). Pair with onSealedChange. |
| defaultSealed | `boolean` | `false` | Sealed at the start when uncontrolled. |
| onSealedChange | `(sealed: boolean) => void` |  | Called with true when the seal is set, and false on undo. |
| title | `string` | `"Service agreement"` | Document title. |
| subtitle | `string` | `"PDF · 3 pages"` | Line under the title. |
| details | `WaxSealDetail[]` | `SAMPLE_DETAILS` | Rows of the document summary. |
| signer | `string` | `"Alex Morgan"` | Name on the signature line. |
| onSign | `(signature: string) => void` |  | Called as sealing starts, with the signature as a PNG data URL. |
| label | `string` | `"Seal"` | Label of the seal button. |
| className | `string` |  | Classes for the card. |