# Fortune Teller

> Kami pack: a paper fortune teller of four pointed pockets that works itself like it's on fingertips, opening its mouth one way to show one color inside, then the other way to show another. A tap counts out a quick four and holds it open on your fortune. Plain kami, printed washi or crinkled foil. Raymarched in WebGL.

- Slug: `kami-fortune`
- Category: [Asset packs](https://www.assembli.design/category/asset-packs.md)
- Subcategory: [Kami](https://www.assembli.design/category/asset-packs/kami.md) (`kami`)
- Type: component
- Tags: 3d, webgl, raymarching, asset, origami, paper, fortune-teller, cootie-catcher, game, pockets, toy
- npm dependencies: none
- shadcn/ui dependencies: none
- Live preview: https://www.assembli.design/preview/kami-fortune
- Page: https://www.assembli.design/components/kami-fortune

![Fortune Teller preview](https://www.assembli.design/thumbnails/kami-fortune-light.png)

## Props

Other props pass through to the root element.

| Prop | Type | Default | Description |
| --- | --- | --- | --- |
| `palette` | `KamiPalette` |  | A preset palette. Every piece in the pack reads the same sheets. |
| `colors` | `Partial<KamiColors>` |  | Override any color of the palette, as any CSS color. |
| `studio` | `string` |  | The room the piece sits in, as any CSS color. It tints the fill light and what foil reflects. By default it's a warm paper white, or a deep ink blue on dark surfaces. |
| `finish` | `KamiFinish` |  | Plain kami, printed washi or crinkled foil. Changing it crossfades. |
| `print` | `KamiPrint` |  | The pattern washi is printed with. |
| `speed` | `number` |  | Idle motion speed. 0 holds the resting pose; reduced motion always does. |
| `interactive` | `boolean` |  | Lean toward the cursor, drag to turn and fling, tap for the piece's trick. |
| `poke` | `number` |  | Change this value to play the piece's tap trick on cue. |
| `shadow` | `boolean` |  | The soft shadow the piece casts on the ground beneath it. |
| `surface` | `"auto" \| "light" \| "dark"` |  | What the piece sits on. "auto" follows the page theme; set "light" or "dark" when it sits on its own backdrop. |
| `rotate` | `Vec3` |  | Extra rotation of the resting pose in degrees: [pitch, yaw, roll]. |

## Install

One-time setup (needs a subscription):

1. Add the registry to the project's `components.json`: `{"@assembli":{"url":"https://www.assembli.design/r/{name}.json","headers":{"Authorization":"Bearer ${ASSEMBLI_API_KEY}"}}}` (merge into `"registries"`).
2. Put an API key from https://www.assembli.design/account in `.env.local` as `ASSEMBLI_API_KEY=asm_…`.

Then install with the shadcn CLI (writes `components/kami-fortune/kami-fortune.tsx` and installs dependencies):

```bash
npx shadcn@latest add @assembli/kami-fortune
```

Registry item JSON: https://www.assembli.design/r/kami-fortune.json (send `Authorization: Bearer <api key>`)

## Code

> Component source needs an Assembli subscription ($12/month or $96/year) and an API key sent as `Authorization: Bearer <key>`. To get one without copying anything, POST https://www.assembli.design/api/agent/login (or call the MCP tool connect_account), show the user the link it returns, and poll https://www.assembli.design/api/agent/token for the key. Or subscribe at https://www.assembli.design/pricing and create a key at https://www.assembli.design/account.