Jakubantalik/thinking-orbs

What it solves

Thinking-orbs provides a set of lightweight, standardized loading animations specifically designed for AI and agent-based user interfaces. It solves the problem of creating consistent, high-performance visual feedback that communicates what an AI agent is currently doing (e.g., searching, solving, or listening) without relying on heavy graphics libraries.

How it works

The library uses a plain 2D canvas to render nine distinct, hand-tuned animations. It automatically detects your application's color theme to ensure the dots match your UI, and it includes built-in performance optimizations like pausing animations when the element is off-screen or the browser tab is hidden. It is designed to be "drop-in" ready for web projects, with specific presets for both chat-avatar and inline-text sizes.

Who it’s for

This project is for developers building AI-powered web applications who need a polished, accessible, and performant way to show users that an agent is active or processing information.

Highlights

• Nine distinct animation states representing different agent actions.
• Two purpose-tuned sizes (64px and 20px) that adjust dot count and speed for optimal clarity.
• Automatic theme detection that syncs with your project's light or dark mode.
• Built-in accessibility features, including automatic support for reduced-motion settings and screen readers.
• High-performance rendering using 2D canvas, ensuring compatibility across all major browsers without the overhead of WebGL or filters.