Visual context-window usage meter — shows tokens consumed versus the model's total context limit, with a colour-coded fill that shifts amber then red as capacity is approached. Designed for AI agent dashboards, session monitoring, and prompt-engineering tooling. Original a2ui-catalogue atom.
| Surface | Note |
|---|---|
| googlechat | renders as "Used X / Y tokens (Z%)" plain text; no visual meter |
| bar renders statically; colour may be stripped by email client |
| Field | Type | |
|---|---|---|
| used | integer. Tokens consumed so far. | required |
| total | integer. Model context window size, e.g. 200000. | required |
| model | string. Model name shown as subtitle, e.g. "claude-sonnet-4-6". | optional |
| label | string. Override the default "Context window" heading. | optional |
| warn_at | number. Percentage threshold to shift to amber. Default 70. | optional |
| critical_at | number. Percentage threshold to shift to red. Default 90. | optional |
| animate | boolean. Count up from 0 to `used` using CSS @property animation. Bar grows in sync. Uses dark styling suited to Meet stage. Default false (static). | optional |
| duration | number. Animation duration in seconds when animate is true. Default 2.0. | optional |
{
"type": "token_budget_meter",
"used": 1,
"total": 5
}{
"identifier": "urn:air:a2uicatalog.ai:atom:token_budget_meter",
"displayName": "Token Budget Meter",
"type": "application/vnd.a2ui.atom+json",
"url": "https://a2uicatalog.ai/atoms/token_budget_meter",
"capabilities": [
"web",
"meet-stage",
"pdf",
"apps-script-web"
],
"description": "Visual context-window usage meter \u2014 shows tokens consumed versus the model's total context limit, with a colour-coded fill that shifts amber then red as capacity is approached. Designed for AI agent dashboards, session monitoring, and prompt-engineering tooling. Original a2ui-catalogue atom.",
"representativeQueries": [
"show a context window token usage meter with capacity warning colours",
"visual context-window usage meter \u2014 shows tokens consumed versus the model's total context limit, wi",
"render a token budget meter"
]
}The renderer is open source. Deploy your own instance in 4 commands — you own the URL, no dependency on the demo endpoint.
git clone https://github.com/a2uicatalog/a2ui
cd apps-script-surface/gas-schema-renderer
clasp push && clasp deploy