Augur
Assistant presence orb on 2D canvas: seeded noise-displaced blobs composited additively inside a glassy clipped sphere with Fresnel rim, soft specular and halo. Morphs per state — breathing idle, level-driven ripples while listening, folding bands and an orbit ring while thinking, pulses and a brighter core while speaking — blending over ~600ms. DPR-clamped, offscreen-paused, polite live-region announcements, a static lit frame per state under reduced motion.
canvaspro
Pro
The preview is live. The source is Pro.
One purchase, lifetime access: every pro component's source, CLI install with your own registry token, and all future drops.
Installation
CLI
npx shadcn@latest add @crucible/augurProps
| Prop | Type | Default | Description |
|---|---|---|---|
| state | AugurState | "idle" | What the assistant is doing right now. The orb blends every visual parameter toward the new state over ~600ms — it never pops. - idle — slow ~0.2Hz breathing and a gentle internal swirl - listening — surface ripples driven by level - thinking — internal bands rotate faster and fold; an orbit ring spins in - speaking — radial pulses timed to level and a brighter core |
| level | number | 0 | Live amplitude, 0–1 — mic input while listening, output volume while speaking. Smoothed internally with a fast attack and a soft decay, so you can feed raw analyser values every frame. Ignored in idle / thinking. |
| size | number | 160 | Orb diameter in CSS px. The halo and orbit ring bleed ~30% past this box without affecting layout. |
| colors | [string, string, string] | string[] | ["#a78bfa", "#818cf8", "#67e8f9"] | [core, mid, rim] — the inner glow, the body swirl, and the Fresnel rim / halo. Any CSS colors. Defaults to ion violet core → periwinkle → cyan rim. |
| speed | number | 1 | Animation-speed multiplier for swirl, breathing and ring spin. 1 = default. |
| intensity | number | 1 | Overall luminosity of glows, halo and rim, 0–2. Highlights stay soft at any value. |
| paused | boolean | false | Freeze the orb at a static, fully lit frame of the current state. |
| announce | boolean | true | Announce state changes ("Assistant is thinking") to screen readers via a visually hidden polite live region. |
Also accepts all props of Omit<React.ComponentPropsWithoutRef<"div">, "children"> — they pass through to the underlying element. | |||
Honors prefers-reduced-motion with a designed static fallback, pauses offscreen and on hidden tabs, and passes className through.