A React component library that renders six hand-tuned animated thought orb loading indicators on a plain 2D canvas, with two purpose-tuned sizes and automatic theme detection for AI and agent UIs.

Stars

295

7-day growth

No data

Forks

18

Open issues

0

License

MIT

Last updated

2026-07-21

Why it is worth attention

It provides aesthetically pleasing, accessible, and performant loading indicators specifically designed for AI/agent interfaces, with no dependencies, cross-browser compatibility, and features like reduced-motion support and offscreen auto-pause.

Who it is for

  • React developers building AI chatbots or agent UIs
  • Front-end developers needing elegant loading indicators
  • Developers focused on accessibility and performance in UI components

Use cases

  • Indicating an AI agent is searching, working, solving, listening, composing, or shaping
  • Displaying a loading state in chat avatars (64px) or inline text (20px)
  • Replacing generic spinners in dashboards or tools that show AI processing stages

Strengths

  • Six distinct hand-tuned animations with clear semantic states
  • Two purpose-tuned sizes with separate dot counts and speeds, not just scaling
  • Automatic theme detection (data-theme, class, prefers-color-scheme) with live updates
  • Accessibility and performance: role='img', reduced-motion support, offscreen auto-pause, plain 2D canvas

Considerations

  • Only monochrome (ink on light/dark background) – no color customization
  • Only two preset sizes (20 and 64) – arbitrary scaling not supported
  • React-only component; not provided for vanilla JS or other frameworks

README quick start

Quick start

Description

Dotted thought-orb loading indicators for AI & agent UIs — six tuned states, two sizes, auto dark/light

Related repositories

Similar projects matched by category, topics, and programming language.

openclaw
Featured
openclaw GitHub avatar

openclaw

OpenClaw is a self-hosted personal AI assistant that runs on your own devices and integrates with over 25 messaging channels, featuring voice support, a live canvas, and multi-agent routing.

AI & Machine Learning
383,088
TanStack
Featured
TanStack GitHub avatar

router

TanStack Router is a type-safe, data-driven React router with built-in caching, prefetching, and nested layouts, while TanStack Start extends it into a full-stack SSR framework.

Web Development
14,802
mereyabdenbekuly-ctrl
Featured
mereyabdenbekuly-ctrl GitHub avatar

clodex-ide

Clodex is an open-source, local-first agentic IDE that combines persistent AI tasks, code, terminal, browser, Git, models, memory, and governed execution in one Electron workspace, currently in technical preview.

Developer ToolsDesktop Apps
833