Make your AI agent feel alive.
One open-source motion engine for agent avatars: 58 agent states, reactions and interactions, on any avatar style. Swap the art without touching the behaviour. Drop it into React, Next.js, Remix, Tauri, Electron or plain DOM.
npm i awesome-agent-avatars @dicebear/core @dicebear/stylesnpx skills add Stitchable-ai/awesome-agent-avatarsEvery agent state. Any style.
States are data: each one picks keyframe clips (shuffled, never the same twice in a row), a face, props and an automatic next state. Pick a state, then swap the style: the motion stays, only the art changes.
What you get
58 agent states
Idle, listening, thinking, streaming (it talks), searching, reading, coding, running, controlling, needs-you, finished, failed, sleeping… plus reactions, indicators and moments.
Interactions built in
Eyes then head follow the pointer, click to hop, double-click to spin, drag to swing it, rub to make it shy. Turn any of it off.
Hot-swappable styles
DiceBear (Micah, Avataaars, Gaze, and any other DiceBear style), react-nice-avatar, Fluent Emoji 3D, or your own picture. avatar.setArt() swaps live.
An editing interface
Every style exposes fields, defaults() and render(). Build your own editor UI; save a small JSON recipe per user.
Small and framework-free
Core is ~24 KB gzipped with no dependencies. Styles are separate imports; the art libraries are your optional peers.
Polite by default
One shared animation loop that pauses off screen and in hidden tabs; honours reduced motion; SSR-safe; namespaced CSS.
Drop it in
Plain DOM and CSS: no native modules, no Node APIs. The same code runs in a browser, a Tauri v2 webview (WKWebView, WebView2, WebKitGTK) or Electron.
Wire it to your agent
agentPresence maps agent events to states. Tool names are guessed for you: web_search → searching, read_file → reading, edit_file → coding, bash → running, computer → controlling.
Bring your own style
A style is anything that returns faces (SVG or images) and a few hints. Use any DiceBear style, any picture, or write one from scratch; community styles are just npm packages.
For coding agents
Install the skill into Claude Code, Codex, Cursor and other agents in one command, then ask: “Add an animated agent avatar to this app with awesome-agent-avatars.”
npx skills add Stitchable-ai/awesome-agent-avatarsStanding on the shoulders of
Awesome Agent Avatars animates art made by other people. Their work is the reason this exists. Please keep their credits when you ship a style.