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.
npx skills add a2uicatalog/a2ui --skill a2ui-composegit clone --depth 1 https://github.com/a2uicatalog/a2uiWrote 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.
[](https://agentmods.dev/skills/a2uicatalog/a2ui/a2ui-compose)<a href="https://agentmods.dev/skills/a2uicatalog/a2ui/a2ui-compose"><img src="https://agentmods.dev/badge/skills/a2uicatalog/a2ui/a2ui-compose/github.svg" alt="Measured on agentmods" height="20"></a>Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.
<a href="https://agentmods.dev/skills/a2uicatalog/a2ui/a2ui-compose"><img src="https://agentmods.dev/badge/skills/a2uicatalog/a2ui/a2ui-compose.svg" alt="Reviewed on agentmods" width="80" height="20"></a>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.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00102 | $0.01072 |
| Opus 5.5 | $0.00041 | $0.00429 |
| Sonnet 5.5 | $0.00020 | $0.00214 |
| Haiku 4.5 | $0.00010 | $0.00107 |
Grade A, and why
a2ui-compose 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 1mo 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.
How it starts
The opening of the file, as written. The whole thing — 85 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Composing and rendering an A2UI payload
The payload shape
{
"title": "Weekly numbers",
"theme": "light",
"blocks": [
{ "type": "heading", "text": "This week" },
{ "type": "stat_card", "value": "1,234", "label": "Daily users", "delta": "+12%" }
]
}
blocks is an ordered array of atoms (the "blocks dialect"). A v1.0 createSurface
envelope (templates + dataModel bindings) is also accepted wherever a payload is taken —
theme is light, dark, or terminal (the catalog's own dark/monospace brand skin).
Render, by host capability
- MCP Apps-capable host (renders inline in the conversation, no URL, no size
ceiling):
render_surface(payload). - Any other MCP host:
preview_url(payload)— a shareable link on the shared demo renderer (rate-limited: 10 calls per client per 7 days). - No rate limit, your own deployment:
make_surface_url(payload, renderer_url)— renders against a renderer YOU deployed (see the self-hosting quickstart below), or omitrenderer_urlfor the encoded-fragment + BYO guidance. - Protocol-free, no MCP client at all:
POST https://a2uicatalog.ai/api/renderwith the payload as the JSON body — returns a complete self-contained HTML page. Same guards, same 50-requests/day-per-IP limit as the MCP tools above.POST /api/render/batchdoes up to 25 payloads in one call with PARTIAL SUCCESS semantics (one malformed payload doesn't fail the batch).
Failure modes worth knowing before they surprise you
- Preview-stage or unpublished atoms aren't an error — they render as a visible
"not published here" notice rather than being silently dropped, and are named in the
X-A2UI-Unpublishedresponse header. - Atoms that need a render-time server fetch (
data_source,firestore_read,doc_ai_summary,multi_doc_ai_brief,gemini_handoff) are refused with 400 on the public renderer — deploy your own renderer for those (see below). - Limits: 256 KB body, 300 blocks, 12 levels of nesting on
/api/render. An oversized or over-nested payload is a 400, not a silent truncation — check the error body for which limit was hit. - A surface query param (
?surface=web|mcp-apps|google-apps-script-web|google-meet-stage) applies that surface's declared compatibility policy: atoms markeddegraded_onstill render (named inX-A2UI-Degraded); atoms markedincompatible_onare replaced with a visible callout (named inX-A2UI-Incompatible) rather than rendering something wrong.pdf,emailandgoogle-chatare refused with 400 here — this endpoint emits HTML, and answering half-honestly about portability on those surfaces is worse than refusing.
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.
- 1mo ago First seen · 85 lines · 102 tokens per session scan A d6750d93bb78
a2ui-compose is a skill published in the GitHub repository a2uicatalog/a2ui (4 stars, last pushed yesterday), licensed MIT. It adds 102 tokens to every session and 1,072 once invoked, about $0.0004 per session on Opus 5.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-31.
Other skills, from other repositories
html-artifacts
Author the HTML for a plan artifact, dashboard iframe, or Slack attachment — structure, design plan, available runtime, theming, and craft. Read this before writing HTML for saveplan, outputiframe, or slackattachhtml.
skin-creator
Create and apply a two-asset LobsterAI visual skin from the user's style description. Use only when the AI Skin Designer kit supplies the structured skinpack workflow marker; do not use for ordinary theme or image requests.
card-design
A visual design system for social-media cards and posters, covering colour choices, Chinese typography, layouts, content density, and quality checks.
a2ui
Make a reply easier to read and act on with rich blocks inside ordinary Markdown — a choice the user picks from, a form that collects several answers, a procedure as steps with warnings in place, a callout, a Mermaid diagram, a weather card, a live clock or countdown, and a dashboard of gauges for a system snapshot, a…
canvas-design
Create beautiful visual art in .png and .pdf documents using design philosophy. You should use this skill when the user asks to create a poster, piece of art, design, or other static piece. Create original visual designs, never copying existing artists' work to avoid copyright violations.
asset-aesthetics
A set of art-direction rules for designing visual assets according to their period, place, identity, materials, and existing project decisions. It covers characters, clothing, buildings, objects, lighting, and checking the actual generated image.