Thinking orbs

Show searching, listening and composing with a particle orb. Compare states and copy a progress indicator for your app.

See it in action

Choose an example to try, then make it your own below.

Make it yours

React code

import { ThinkingOrb } from '@/components/livenui/orbs'

<ThinkingOrb
  state={"working"}
  size={64}
  speed={1}
  paused={false}
  theme={"light"}
/>

Border beam

Highlight an action, input or card with a moving border. Try beam shapes and palettes, then copy the React component.

Metal

Add reflective rings, text and badges to actions or labels. Try materials and pointer deformation before copying the code.