Thinking Orb
Minimalist monochrome spherical particle vortex with orbital physics, pure black-and-white luminous styling, and 9 cognitive state deformations.
state: working • 80px • 1x
Cognitive State Preset
Size (80px)
Speed
Atmosphere
Playback
Installation
Add the component directly to your repository using shadcn CLI:
npx shadcn@latest add Surajmaurya1/easyui/thinking-orb
API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
| state | 'working' | 'searching' | 'solving' | 'listening' | 'connecting' | 'weaving' | 'composing' | 'breathing' | 'shaping' | 'working' | Cognitive animation behavior preset and mathematical deformation pattern |
| size | number | 64 | Diameter of the canvas orb in pixels (e.g. 64 for avatar/assistant, 20 for inline text) |
| speed | number | 1 | Animation playback speed multiplier (1 = standard, 2 = 2x faster, 0.5 = slow) |
| dark | boolean | true | Dark mode tuning: true renders luminous white particles, false renders crisp dark graphite particles |
| paused | boolean | false | Freezes animation frame progression while preserving current particle positions |
| className | string | undefined | Optional CSS class string applied to the outer container |
| style | CSSProperties | undefined | Inline styles passed directly to the container span |
| aria-label | string | '${state} orb' | Accessible label for screen readers announcing the orb state |