# thinking-orbs review

> thinking-orbs is a React library of dotted, animated thought-orb loading indicators for AI and agent user interfaces.

Devtoolwatch Board, the week of Oct 25–31, 2026. Canonical page: https://index.devtoolwatch.com/tools/jakubantalik-thinking-orbs/

## TL;DR

thinking-orbs provides nine animated loading states for AI and agent UIs, each tuned at two sizes and drawn on a plain 2D canvas. It suits developers building chat or agent interfaces in React. It picks dark or light mode automatically, respects reduced motion, and pauses offscreen.

## thinking-orbs at a glance

- **Category:** [Model SDKs and gateways](https://index.devtoolwatch.com/categories/model-sdks-and-gateways/)
- **Maintained by:** Jakub Antalik (individual, [@Jakubantalik](https://github.com/Jakubantalik) on GitHub)
- **License:** MIT
- **Language:** TypeScript, JavaScript
- **Repository:** [github.com/Jakubantalik/thinking-orbs](https://github.com/Jakubantalik/thinking-orbs)
- **Website:** [orbs.jakubantalik.com](orbs.jakubantalik.com)
- **npm package:** [thinking-orbs](https://www.npmjs.com/package/thinking-orbs) 0.3.2
- **Latest release:** [thinking-orbs 0.3.2](https://www.npmjs.com/package/thinking-orbs) on npm, Sep 22, 2026
- **First published:** Jul 21, 2026

## What thinking-orbs does

- thinking-orbs offers nine distinct animated states, each representing something an agent can be doing, such as scanning or wiring a constellation.
- thinking-orbs ships two separately designed size presets: 64 for chat-avatar scale and 20 for inline-text scale.
- thinking-orbs detects dark or light theme from an ancestor data-theme attribute or class, or from prefers-color-scheme, and updates live.
- thinking-orbs sets role="img" with a per-state aria-label by default.
- thinking-orbs renders a static frame when prefers-reduced-motion is set to reduce.
- thinking-orbs pauses instances when scrolled offscreen or when the tab is hidden, and resumes them in phase on a shared clock.
- thinking-orbs passes other canvas props such as className, style and data attributes through to the element.

### How it works

thinking-orbs is an npm package that exports a ThinkingOrb React component. Each orb draws plain 2D canvas arcs with no WebGL or filters, so output matches across Chrome, Safari and Firefox. Device pixel ratio is capped at 2. The canvas paints only on the client after the theme resolves, which keeps it safe for server-side rendering.

## How to install thinking-orbs

**With npm**

```
npm install thinking-orbs
```

### Requirements

- A React project, since thinking-orbs ships as a React component.

### First steps

1. Install thinking-orbs with npm install thinking-orbs.
2. Import the ThinkingOrb component from 'thinking-orbs' in your React code.
3. Render ThinkingOrb in a status component, then choose a state, a size of 64 or 20, and a theme.

## Who thinking-orbs is for

- Developers building AI chat or agent interfaces who need loading indicators that convey agent activity.
- Projects using Tailwind or shadcn dark/light class conventions that want automatic theme matching.
- Apps targeting low-end devices or needing identical rendering across browsers.

### Limitations

- thinking-orbs is strictly monochrome, offering only light ink or dark ink with no custom color palettes described.
- thinking-orbs has only two size presets, 64 and 20, which are separate designs rather than a scale factor.

## Usage data (the week of Oct 25–31, 2026)

- Board rank: #76 overall, #1 in Model SDKs and gateways, momentum score 69
- Downloads that week: 1.4M (+44% vs 4-week average)
- New GitHub stars per week (last 12 weeks): Aug 9: 336; Aug 16: 79; Aug 23: 68; Aug 30: 36; Sep 6: 23; Sep 13: 169; Sep 20: 423; Sep 27: 215; Oct 4: 156; Oct 11: 131; Oct 18: 88; Oct 25: 61

## thinking-orbs alternatives

| Rank | Tool | Stars | Downloads/wk |
|---|---|---|---|
| #2 | [Headroom](https://index.devtoolwatch.com/tools/headroomlabs-ai-headroom/) | 78.5k | 125.8k |
| #3 | [LiteLLM](https://index.devtoolwatch.com/tools/litellm/) | 62.5k | 23.1M |
| #4 | [Honcho](https://index.devtoolwatch.com/tools/plastic-labs-honcho/) | 7.9k | – |
| #5 | [Anthropic SDK](https://index.devtoolwatch.com/tools/anthropic-sdk/) | 4k | 111M |
| #6 | [Hugging Face Hub](https://index.devtoolwatch.com/tools/hf-hub/) | 4k | 68.3M |
| #7 | [OpenAI SDK](https://index.devtoolwatch.com/tools/openai-sdk/) | 32k | 141.3M |

## thinking-orbs FAQ

### Is thinking-orbs free and open source?

Yes. thinking-orbs's source code is on GitHub (Jakubantalik/thinking-orbs) under the MIT license, so you can use it for free.

### How do I install thinking-orbs?

Run `npm install thinking-orbs`.

### Is thinking-orbs still maintained?

Yes. The Jakubantalik/thinking-orbs repository was last updated on Aug 16, 2026, and the latest release, thinking-orbs 0.3.2 on npm, came out on Sep 22, 2026.

### How popular is thinking-orbs?

thinking-orbs has 3.9k GitHub stars as of Nov 1, 2026. It gained 61 new stars in the week of Oct 25–31, 2026, against a 12-week average of 149 a week. Its main package had about 1.4M downloads that week, +44% against its own 4-week average. That made it #1 among LLM SDKs and gateways on the Devtoolwatch Board.

### What are the best alternatives to thinking-orbs?

Other LLM SDKs and gateways on the Devtoolwatch Board in the week of Oct 25–31, 2026, by momentum: Headroom (#2), LiteLLM (#3), Honcho (#4), Anthropic SDK (#5), Hugging Face Hub (#6). The alternatives table above has their numbers.

### Does thinking-orbs use WebGL?

No. thinking-orbs draws plain 2D canvas arcs only, with no WebGL, ctx.filter or SVG filters. The README says the output matches in Chrome, Safari and Firefox and is cheap on low-end devices.

### How does thinking-orbs choose dark or light mode?

thinking-orbs defaults to auto mode. It first checks an ancestor data-theme attribute or a dark/light class, then falls back to prefers-color-scheme. It updates live when either changes. You can also pin light or dark ink.

### Is thinking-orbs accessible?

Yes. thinking-orbs sets role="img" with a per-state aria-label by default. When prefers-reduced-motion is set to reduce, it shows a static representative frame that still follows the theme.

### Does thinking-orbs work with server-side rendering?

Yes. thinking-orbs is SSR-safe because the canvas paints only on the client, after the theme has resolved.

### Does thinking-orbs keep animating when off screen?

No. thinking-orbs pauses each instance when it scrolls offscreen or the tab is hidden. It resumes in phase because all instances share one clock.

## Sources

1. [Jakubantalik/thinking-orbs on GitHub](https://github.com/Jakubantalik/thinking-orbs)
2. [thinking-orbs README](https://github.com/Jakubantalik/thinking-orbs/blob/main/README.md)
3. [thinking-orbs on npm](https://www.npmjs.com/package/thinking-orbs)
4. [Devtoolwatch Board, the week of Oct 25–31, 2026](https://index.devtoolwatch.com/)