Pulsing Orb

Animated dot orbs for AI and agent interfaces. Drop one in as a loader, a status indicator next to “Thinking…” text, or a full-size hero visual. It looks right from 20px icons to 800px heroes.

Six animations

• Working: particles circling on tilted orbits

• Searching: a scan line sweeping a dotted globe

• Solving: bands twisting like a puzzle, then snapping back

• Listening: a waveform rolling through the rings

• Composing: an undulating ribbon of dots

• Shaping: a dotted outline morphing between circle, triangle and square

Controls

• State: switch between the six animations

• Color: any color, including color styles, so it can follow your dark mode

• Speed, Spin and Tilt: set the motion and viewing angle

• Dot Size and Density: from sparse and airy to dense and detailed

• Follow Cursor: the orb turns and drifts toward the cursor

• Depth, Background, Pause and a screen-reader label

Built to perform

• Lightweight 2D canvas, no WebGL

• Pauses automatically when off-screen or in a background tab

• Shows a still frame for visitors who prefer reduced motion

• Fully responsive: resize it like any layer

Great for

AI products and chat interfaces, agent dashboards, SaaS landing pages, loading and empty states, and product launch heroes.

Good to know

Follow Cursor works in Preview and on your published site. Framer’s canvas doesn’t pass mouse movement to components while you design.

Built on the open-source thinking-orbs library by Jakub Antalik (MIT license).