Coin Flip
A 3D coin with a sliced rim that flips with a spin and hop to a seeded heads or tails, plus a medal variant that turns on hover.
Preview
Click or press Space to flip.
Silver
Ink · starts tails
TopNo. 12026Medal · hover to turn
Install
Pro source requires Pebble Pro. Try the full preview above.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| variant | "coin" | "medal" | "coin" | coin flips on click, Enter or Space; medal is display-only and turns on hover. |
| size | number | 120 | Diameter in px. |
| thickness | number | 10 | Rim thickness in px. |
| tone | "gold" | "silver" | "ink" | "gold" | Metal, from theme tokens. |
| front | ReactNode | — | Custom heads face. Defaults to our sun emblem. |
| back | ReactNode | — | Custom tails face. Defaults to our wave emblem. |
| defaultSide | "heads" | "tails" | "heads" | Side showing at first (coin). |
| seed | number | 1 | Seed for the sequence of results, so flips are repeatable (coin). |
| onFlip | (side: CoinSide) => void | — | Called when a flip lands (coin). |
| label | string | "Flip the coin" | Accessible name. The coin appends the side showing; a medal needs one. |
Pro component
Try the full preview above. Editable source and build guides require Pebble Pro.