For agents

A skill file, a chooser, and a JSON catalog. An agent installs an orb, maps the app's status onto its state, and can read every parameter back.

What an agent does with it

  1. Picks an orb from the chooser, or the full catalog in llms.txt.
  2. Installs it with the shadcn CLI. The runtime file comes with it.
  3. Maps the app's status onto state — idle, thinking, speaking. That is the whole integration.
  4. When asked to tune the look, reads the orb's params from the API and passes params, or retunes one state with statePresets.

How to call it

Put the skill in the folder the agent already reads, install an orb, and ask for the UI.

https://orbkit.zzzzshawn.cloud/skill.md
https://orbkit.zzzzshawn.cloud/skill/recipes.md
npx shadcn@latest add https://orbkit.zzzzshawn.cloud/r/shdr-11.json
import { Shdr11 } from "@/components/ui/shdr-11";

const orbState =
  status === "connecting" ? "thinking"
  : isAgentSpeaking ? "speaking"
  : "idle";

<Shdr11 size={320} state={orbState} />

Machine-readable

States

  • idlecalm, slow drift — the agent is listening or waiting
  • thinkingrestless motion with a slow wander — the agent is working
  • speakingfast, bright, strongly precessing — the agent is talking

Each state synthesizes two volume signals, input (user speech energy) and output (agent speech energy), which the shader reads. Pass real levels through volumes when you have them.

Chooser

The askTry first
A voice-assistant avatar with a clear state readshdr-11 (quantum orbital, rainbow chroma), shdr-26 (a crazed web of coloured threads knotted to a cell grid), shdr-13 (plasma globe: crawling lightning filaments)
Calm glass for a product hero or a loading stateshdr-01 (cut-glass orb with a dispersive, turbulent interior), shdr-25 (the folds of a warped field, drawn by their own steepness), shdr-21 (light diffusing through a cloud)
Retro, terminal, pixel, CRT, printshdr-23 (an ASCII glyph matrix in CRT green, wrapped on the ball), shdr-14 (a lit plasma dome quantized to chunky two-tone pixels), shdr-28 (nested binary grids shuttering on a tumbling bit-sphere), shdr-29 (an LED tile wall lighting up in flowing blobs, wrapped on the ball), shdr-33 (a thermal image, risograph-printed on the ball), shdr-27 (a weather-radar mosaic, fronts of coloured pixels sweeping the ball)
Nature: water, weather, cloudshdr-16 (sunlight through water — a caustic net crawling over the ball, fringing into colour where it moves), shdr-20 (a water film rushing down the ball, fountain-style), shdr-21 (light diffusing through a cloud), shdr-17 (a grainy many-coloured storm with band shear and lightning)
Cosmic: galaxy, crystal, coronashdr-32 (a galaxy marched as gas and dust inside the ball), shdr-18 (a crystal folded out of one eighth of space, tumbling), shdr-31 (raymarched shell, volumetric godrays), shdr-22 (field lines swirling around the ball about a wandering axis)
Ornament and patternshdr-02 (ornate scrollwork on a rolling dome), shdr-19 (beads swelling and shrinking in their cells, packed over the ball), shdr-30 (a meadow folding into itself toward a blue vanishing point)

Every orb with its one-line look is in llms.txt; every prop is on the usage page (16 shared props, then per-orb params).

Rules

  • One orb per agent, driven by state. Do not animate it yourself.
  • Override only params the orb declares; read them from the API. Do not invent keys.
  • Retune a state with statePresets, not by forking the orb file.
  • Install through the shadcn CLI, never npm. Two files land; they import nothing but React.
  • Keep mounted orbs under about a dozen per page — each is a WebGL context.
  • Use the wrapper prop for a bezel; never add a border that changes the footprint.

Try it

Prompts that exercise the skill.

Build the call screen for our voice agent. It has connecting, listening, and speaking states from the SDK.

Use an Orbkit orb as the avatar. Map connecting to thinking, listening to idle, speaking to speaking. Feed the mic level into volumes.input. Don't animate it yourself.
The thinking state on our orb is too busy for the dashboard.

Read the orb's params from the API and pass a statePresets override for thinking only. Keep idle and speaking as shipped.

Links