companion-bot
Add a furry 3D companion bot to a web app — a drop-in <companion-bot> web component that blinks, glances at the pointer, fidgets, hops when clicked, and shows the app's mood (idle, working, sleeping), plus a full customizer (presets, fur, face, nose, eyes, 14 glasses frames, saved presets) for a settings page. Three.js on WebGPU, falling back to WebGL 2, then a flat WebGL 1 shader, then a still picture. Use when someone wants a mascot, companion, buddy, avatar or character in their UI — in a header, empty states, loading or "all done" states, onboarding — or wants users to customize one. Works in plain HTML, React, Next.js, Vue, Svelte and Astro with no build step.
Pinned to revision 6da1e9b6b958, so it is the text this page describes rather than whatever the author pushed since.
Files
- skills/companion-bot/SKILL.md
- skills/companion-bot/agents/openai.yaml
- skills/companion-bot/assets/companion-bot-reference.jpg
- skills/companion-bot/assets/companion-bot/LICENSE
- skills/companion-bot/assets/companion-bot/appearance.js
- skills/companion-bot/assets/companion-bot/bot-still.png
- skills/companion-bot/assets/companion-bot/bot2d.js
- skills/companion-bot/assets/companion-bot/bot3d.js
- skills/companion-bot/assets/companion-bot/companion-bot.js
- skills/companion-bot/assets/companion-bot/customizer.css
- skills/companion-bot/assets/companion-bot/customizer.js
- skills/companion-bot/assets/companion-bot/presets/finn.png
- skills/companion-bot/assets/companion-bot/presets/mochi.png
- skills/companion-bot/assets/companion-bot/presets/nova.png
- skills/companion-bot/assets/companion-bot/presets/poppy.png
- skills/companion-bot/assets/companion-bot/presets/sage.png
- skills/companion-bot/assets/companion-bot/presets/theo.png
- skills/companion-bot/assets/companion-bot/vendor/dialkit-2.1.0/LICENSE
- skills/companion-bot/assets/companion-bot/vendor/dialkit-2.1.0/index.js
- skills/companion-bot/assets/companion-bot/vendor/dialkit-2.1.0/styles.css
- skills/companion-bot/assets/companion-bot/vendor/three-0.186.1/LICENSE
- skills/companion-bot/assets/companion-bot/vendor/three-0.186.1/addons/environments/RoomEnvironment.js
- skills/companion-bot/assets/companion-bot/vendor/three-0.186.1/three.core.js
- skills/companion-bot/assets/companion-bot/vendor/three-0.186.1/three.tsl.min.js
- skills/companion-bot/assets/companion-bot/vendor/three-0.186.1/three.webgpu.min.js
Every link opens the file at its source, pinned to the revision this page describes.