embed-three-ws-avatar

embed-three-ws-avatar is a skill for Claude Code, Codex from nirholas/three.ws. It costs 133 tokens per session (2,097 once invoked), scanned A, original, Apache-2.0.

A web component for adding a live, animated 3D avatar to a website. It can load a rigged GLB character without requiring a particular web framework.

In plain words
What is it for?
Use it to place an animated character or agent on a website, configure its body model and display mode, and load the component from a versioned CDN URL.
Why use it?
It provides one browser element that can be embedded in many kinds of sites, including plain HTML, React, WordPress, and other listed platforms.

Skill for Claude CodeCodex

Part of the three-ws-core plugin — 42 skills shipped together

Install

Getting it into your agent

One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.

agentmods
npx agentmods add skills/nirholas/three.ws/embed-three-ws-avatar
Any agent
npx skills add nirholas/three.ws --skill embed-three-ws-avatar
Clone the repo
git clone --depth 1 https://github.com/nirholas/three.ws

Made for: Claude Code, Codex.

Or install three-ws-core, the plugin that ships this one along with the rest of its 42 skills.

Wrote this? Show the measurements

A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.

agentmods badge for embed-three-ws-avatar

README.md
[![agentmods](https://agentmods.dev/badge/skills/nirholas/three.ws/embed-three-ws-avatar.svg)](https://agentmods.dev/skills/nirholas/three.ws/embed-three-ws-avatar)
Your own site
<a href="https://agentmods.dev/skills/nirholas/three.ws/embed-three-ws-avatar"><img src="https://agentmods.dev/badge/skills/nirholas/three.ws/embed-three-ws-avatar.svg" alt="Measured on agentmods" height="20"></a>
Per session 133 Skills are progressive disclosure: only the name and description are preloaded; the body loads when the skill is used.
When invoked 2,097 The whole file, excluding the scripts and references it only reads on demand.
Security scan A 0 findings. Scan, not verified.
Origin original No closer match found in the catalogue.
Token cost

What it costs to keep this loaded

Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.

ModelPer sessionOnce invoked
Fable 5 $0.00133 $0.02097
Opus 5 $0.00067 $0.01048
Sonnet 5 $0.00027 $0.00419
Haiku 4.5 $0.00013 $0.00210

Measured 5d ago against content hash 10cba3d6b893, method: parsed. Prices are Anthropic first-party input rates as of 2026-08-30, from the pricing page.

Security

Grade A, and why

embed-three-ws-avatar scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 5d ago.

A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.

Nothing flagged

None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.

.agents/skills/embed-three-ws-avatar/SKILL.md · 158 lines

How it starts

The opening of the file, as written. The whole thing — 158 lines — stays where its author put it; the contents beside it link to each section on GitHub.

Embed a three.ws avatar on any site

The <agent-3d> web component renders a rigged, animated 3D avatar (GLB) with zero framework dependencies. It works in plain HTML, React, Vue, Svelte, Angular, WordPress, Webflow, Shopify, Framer, and Notion embeds. The bundle is served from the three.ws CDN with access-control-allow-origin: *, so it loads from any origin.

Quick start

<script
  type="module"
  src="https://three.ws/agent-3d/1.5.2/agent-3d.js"
  integrity="sha384-xkFDjVP866hYt7voUhfnQHj6IO4hYxA6n8Laupk+VtD6y+IKiO/AZdE3VbfLtg0C"
  crossorigin="anonymous"
></script>

<agent-3d
  body="https://three.ws/avatars/default.glb"
  mode="section"
  kiosk
  poster="/images/avatar-poster.webp"
  style="width:100%;height:420px;display:block"
></agent-3d>

A UMD build exists at the same path as agent-3d.umd.cjs if ES modules are not an option.

Pick the right CDN channel (do not ship latest)

Path Cache Use when
/agent-3d/<MAJOR>.<MINOR>.<PATCH>/agent-3d.js immutable, 1 year production. Pin exact bytes, always combine with SRI
/agent-3d/<MAJOR>.<MINOR>/agent-3d.js 5 min follow patch releases automatically
/agent-3d/<MAJOR>/agent-3d.js 5 min follow minor + patch releases
/agent-3d/latest/agent-3d.js 5 min demos and prototypes only

latest can ship breaking changes with no action on your side. For production, pin an exact version with an integrity attribute. Machine-readable release data:

  • https://three.ws/agent-3d/versions.json: current version, channels, publish time.
  • https://three.ws/agent-3d/<version>/integrity.json: sha384 SRI hashes for that exact version.

Getting a GLB for body

Any humanoid GLB URL works. Models generated on three.ws come back on persistent https://three.ws/cdn/forge/... URLs you can use directly in body with no re-hosting (self-hosting also works if you want control):

  • Generate from text or a reference image: the create-3d-avatar skill (rigged, animation-ready) or generate-3d-model (static prop). Both return a glbUrl.
  • Rig an existing GLB: the rig-a-model skill.
  • Let end users design one interactively: the Avatar Studio iframe flow below.

Read the full file on GitHub · 158 lines

Changes

What this file has done since we first saw it

Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.

  1. 5d ago First seen · 158 lines · 133 tokens per session scan A 10cba3d6b893

Subscribe to this mod's changes

embed-three-ws-avatar is a skill published in the GitHub repository nirholas/three.ws (110 stars, last pushed yesterday), licensed Apache-2.0. It adds 133 tokens to every session and 2,097 once invoked, about $0.0007 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.

Related

Other skills, from other repositories

3d-website-architect

Expert skill for designing, building, and deploying modern premium websites with advanced animations and 3D interactive experiences using Three.js, React Three Fiber, GSAP, and Framer Motion. Use this skill whenever the user wants to build a website with 3D elements, create an immersive web experience, add interactive…

deveshpunjabi/3d-website-skill · 240 tokens

like-burst

Add a celebratory particle burst to a like / favorite / reaction button. A delight micro-interaction that fires on user tap only (never on load), bursts on the "like" transition (not un-like), and ships a prefers-reduced-motion fallback. Use when a small, earned moment of positive feedback will feel good — and only…

nexu-io/motion-anything · 79 tokens

magnetic-button

Make a primary button feel alive by gently pulling it toward the cursor as it approaches, then springing back. Keep it subtle and reserve it for one or two primary actions. Disabled on touch and under prefers-reduced-motion. Do not use it on dense UIs full of buttons.

nexu-io/motion-anything · 63 tokens

comparison-diagrams

Create animated comparison diagrams showing before/after states or side-by-side alternatives using the Excalimate MCP server. Use when asked to compare architectures, show migration paths, visualize before/after changes, present alternatives, pros/cons, or any A-vs-B visual comparison — even if the user says "what…

excalimate/excalimate · 74 tokens

loading-shimmer

Skeleton placeholders with a soft sweeping shimmer while content loads. Use to fill space for cards/lists/profiles that are still loading and make the wait feel shorter. Honors prefers-reduced-motion (static skeleton). Only show while real content is loading — never as decoration.

nexu-io/motion-anything · 60 tokens

click-spark

A quick burst of sparks flies from the point you click — a playful tap accent. Reserve for a delightful primary action; skip on serious/destructive ones. No sparks under prefers-reduced-motion.

nexu-io/motion-anything · 43 tokens