agent-pet

Tiny animated companion-pet widget. Self-hostable, no backend, ~10 KB gzip. Vanilla DOM, no framework runtime.

One-line install

Minimal — emoji-glyph pet, zero config:

<script src="https://agent-pet.pages.dev/v0.8/agent-pet-widget.iife.js"></script>

Animated pet from codex-pets.net — just the pet id:

<script src="https://agent-pet.pages.dev/v0.8/agent-pet-widget.iife.js"
        data-codex-pet="homelander"></script>

Any Codex-format spritesheet — provide your own URL:

<script src="https://agent-pet.pages.dev/v0.8/agent-pet-widget.iife.js"
        data-image-url="https://your-cdn.example/sprite.webp"
        data-use-codex-atlas></script>

Pin to /v0.8/ for stable URLs (immutable, long cache); the bare path is "latest" and may break across releases.

Then drive it from JS:

AgentPet.setState('thinking');
AgentPet.say('Build done!', { link: '/results' });
AgentPet.configure({ name: 'Rex', imageUrl: '...', useCodexAtlas: true });

Pet catalog

Click any pet to make it the active companion. The pet bottom-right of the page is loaded by the script tag — pick a different one and it'll switch live.

Codex Pets — popular from codex-pets.net

Hundreds more on codex-pets.net — grab any pet's slug and pass it as data-codex-pet="<slug>".

j20.nz Hatchery

Full hatchery at j20.nz/hatchery — every Codex-format spritesheet there works as a pet.

Try it

Use the buttons below to drive the active pet's animation state and speech bubble.

Widget states — our semantic API

Codex atlas rows — same animations, original row vocabulary

Speech & configure

Hide

Collapse the pet to a small dock button in the corner — shows the active pet's icon, draggable on touch and mouse. Click (or tap) the dock to bring the pet back. Hidden state persists across reloads.

Chat

Optional: turn on the speech-bubble input. Type a message and press Enter — your handler receives a userMessage event. The demo handler echoes the text back via say(); in production you'd wire it to an LLM, helpdesk, or any backend, and call say(reply) to display the response.

Docs & source

See the GitHub repository for the full README, API reference, and SRI hashes.

Apache-2.0 — animations ported from nexu-io/open-design; pets from codex-pets.net and j20.nz/hatchery/.