token-card
Helps your agent create a visual card showing coding token usage. Useful for displaying progress in a README or sharing coding activity.
What it does
Creates a visual card (SVG image) showing how much you've used AI tools for coding, its equivalent cost, and your recent progress. This card is saved directly into your code files.
When to use it
- ✓When you want to display your AI coding assistance usage in your project.
- ✓When you want an easily shareable summary of your AI coding activity.
- ✓When you want to see an AI usage summary without relying on an online service.
Example of what to ask your AI
“Generate a token usage card for my project.”
Want more? Open the sections below.
How to use
The easiest way: copy the message below and paste it into Claude, ChatGPT, Cursor or any AI. It reads the skill and follows the instructions.
Skill link
Ready-to-paste message
How it works
The tool checks the usage logs of your AI programs (like Claude Code, Gemini, etc.) on your computer. It then generates an image (SVG) with this information and saves it in a folder within your project.
Installation
Easiest way: copy the skill link and paste it into Claude, ChatGPT or Cursor asking it to follow the instructions.
In the terminal (Claude Code, Codex, Cursor), in your project folder:
npx skills add affaan-m/ECC --skill token-cardOr download just the file:
curl -L https://raw.githubusercontent.com/affaan-m/ECC/main/skills/token-card/SKILL.md -o SKILL.mdTechnical content (original SKILL.md)
Original text by the author, straight from GitHub.
Token Card
Produce an SVG card summarising this machine's AI coding agent usage — total tokens, equivalent API cost, current streak, and the split across agents — and write it into the working tree as a file the README can reference.
The card is a committed artifact rather than a hosted image, so it renders from the repository itself and does not depend on a third-party endpoint staying up.
When to Activate
- Someone wants a usage figure visible in a README or docs page.
- Someone asks for a shareable summary of their agent activity across tools.
Use /cost-report instead when the question is "what did I spend this week". The two read
different sources and produce different things:
/cost-report |
Token Card | |
|---|---|---|
| Source | ~/.claude/metrics/costs.jsonl, written by ECC's stop:cost-tracker hook |
The agents' own session logs |
| Agents | Claude Code | Claude Code, Codex, Gemini CLI, OpenCode |
| Output | Terminal summary, optional CSV | An SVG file committed to the repo |
The tool this runs
@tokenchit/cli, MIT licensed: https://github.com/iyashjayesh/tokenchit
Pinned to an exact version, deliberately. @latest resolves to whatever the registry
currently serves, and this tool reads local session logs — so a compromised future release
would be executed with access to them before anyone had reviewed it. Pin, and raise the pin
knowingly:
TOKENCHIT_VERSION=0.10.0
To check the pinned artifact before running it the first time:
npm view @tokenchit/cli@0.10.0 dist.integrity dist.tarball
Workflow
Ask before the first download.
npxfetches the package from the npm registry and executes it. That is a remote download of code that will read local logs, so get explicit confirmation from the user before the first run on a machine. If they decline, stop here and say what would have run.Configure, unless this is a dry run. If
.tokenchit.jsonis absent, run:npx -y @tokenchit/cli@0.10.0 initIt detects which agents have logs on this machine and records them. The file is meant to be committed and never contains a credential.
Skip this entirely when the user passed
--dry-run, and report that.tokenchit.jsonwould be created. A preview that writes a config file is not a preview.Render the card. The bare command writes to the configured output —
tokenchit.svgunless.tokenchit.jsonnames another path:npx -y @tokenchit/cli@0.10.0 syncAppend only the flags the user actually asked for, each spelled exactly as below. Do not copy a placeholder into the command —
syncignores an unrecognised positional argument rather than refusing it, so a bracketed[--dry-run]reaches the CLI as junk and the card is written anyway, which is the opposite of what was asked.Flag Effect --out <path>Write somewhere other than the configured output --theme auto|light|darkCard theme; autoadapts to the reader's system--dry-runPrint what would be written and touch nothing syncreads local files and sends nothing: no prompts, no code, no file contents leave the machine, and it transmits nothing to any server. The npx invocation around it is a registry download — that is the network access in this workflow, and step 1 is where it is agreed.Report and offer. Print the figures it produced — tokens, equivalent cost, streak, per-agent split — and the path written. If the repository has a README that does not yet reference the card, offer to add:
syncprints the path relative to the repository root. A Markdown image resolves relative to the file it sits in, so rewrite it for the README being edited: a card atdocs/usage.svgis./docs/usage.svgfrom the root README but../usage.svgfromdocs/zh-CN/README.md. Pasting the printed path into a nested README points atdocs/zh-CN/docs/usage.svgand renders broken.Do not edit the README without being asked.
Stop after step 4. Publishing to the public leaderboard is a separate publish command that
requires explicit opt-in, and is not part of this workflow — run it only if the user asks for
it by name. unpublish removes the row and the account again.
Output
…
FAQ
What information appears on the card?
The total number of tokens used, the approximate cost in money, your current usage streak, and the breakdown of usage across different AI tools.
Do I need to install anything?
The tool uses `npx`, which downloads the necessary program on the fly without permanently installing anything on your computer. You only need to have Node.js installed.
Does this tool send my data anywhere?
No. It only reads local logs on your computer and generates the image. Nothing is sent to the internet, except for the initial download of the program.
Details
Original description by the author
Render a token-usage stat card from local Claude Code, Codex, Gemini CLI, and OpenCode session logs and commit it into the repository as a file. Use when someone wants a current usage figure in a README, or asks for a shareable card of their coding-agent activity.
repo: affaan-m/ECC
Popularity
- GitHub stars
- 280k
- Ranking position
- #301
- License
- MIT
- Updated
- 10/15/2026
Comments
- …
More skills from this repository
accessibility
Helps your agent create interfaces that everyone can use. Ensures websites and apps work well for people with disabilities, like those who are blind or have reduced mobility.
affaan-m/ECC
agent-architecture-audit
Makes your agent check if everything is working correctly. It finds and fixes problems in AI systems, ensuring they perform as expected.
affaan-m/ECC
agent-eval
Helps your agent compare different AI coding tools. It measures which one is faster, cheaper, and more reliable for specific tasks.
affaan-m/ECC
agent-harness-construction
Makes your agent better understand how to perform tasks. It optimizes the tools and instructions the agent uses to increase its chances of success.
affaan-m/ECC
Similar skills
karpathy-guidelines
Helps your agent write better code by avoiding common mistakes. It's useful for ensuring code is simple, clear, and easy to verify.
multica-ai/andrej-karpathy-skills
skill-creator
Lets the agent create, modify, and optimize skills. Useful for testing skill performance and improving their accuracy.
anthropics/skills
ponytail-debt
Lists all code shortcuts ('shortcut:') left for later. It helps to see what still needs to be fixed in the project.
DietrichGebert/ponytail