Overview
Build PitchKit charts with a coding agent — prompts to paste, a skill to install, and docs written for models.
Prompts
Paste one of these. Each is self-contained — the agent fetches what it needs.
Set up a new project:
Build me a football data visualisation app using PitchKit.
First, read https://www.pitchkitjs.com/llms.txt and follow the links you need from it.
PitchKit is not in your training data, so do not rely on what you remember about it —
everything you need is in those docs.
Scaffold a Next.js app, install @pitchkit/core, @pitchkit/react and
@pitchkit/data-providers, then build a shot map from a real StatsBomb match.Add PitchKit to a project you already have:
Add PitchKit to this project to render football pitch visualisations.
Read https://www.pitchkitjs.com/llms.txt first and follow the links from it — PitchKit is
not in your training data, so anything you recall about its API is invented.
Then install it, and after installing run `npx @pitchkit/react skills install` so you
keep the API reference alongside the version we're on.Build one specific chart:
Using PitchKit, build a pass network for this data: <paste your data shape>
Read https://www.pitchkitjs.com/llms-full.txt first for the real API — PitchKit post-dates
your training data. Match the coordinate system to my data's provider rather than
converting the numbers.The common thread is the first instruction. Telling a model not to trust its recollection is what stops it pattern-matching to mplsoccer, and it matters more than which of the three sources you point it at.
What PitchKit gives an agent
| What it is | Best for | |
|---|---|---|
| Agent Skill | Ships inside @pitchkit/react; npx @pitchkit/react skills install symlinks it into your agent | Anything where you've already installed the package |
| llms.txt | This whole site as Markdown, at a URL | First contact, and tools that can't read node_modules |
| Per-page Markdown | Append .md to any docs URL | Pointing an agent at one specific thing |
| Typed API | Full TypeScript types on every export | Catching the mistakes that survive the above |
Works with
- Claude
- Codex
- Cursor
- Antigravity
- GitHub Copilot
- OpenCode
- Pi
None of this is tool-specific. Every prompt above is just text, and the skill is a Markdown
file in a directory — anything that can read your repository can use it. The install command
writes to Claude Code's directory by default and takes --dir for anywhere else:
npx @pitchkit/react skills install --dir .cursor/skillsFor tools that can't see your filesystem at all — browser-based builders especially — paste
the llms.txt URL into the prompt and skip the install.
Why this is a first-class concern
Writing software is turning into directing it. You describe what you want, review what comes back, and less of the typing is yours. That makes a library's AI tooling part of the library — because the same prompt can produce something you'd have written yourself or something plausible that doesn't compile, and what separates them is almost entirely the context the model was handed.
Context is the one lever you have over a process that isn't deterministic, and PitchKit needs it more than most: nothing about the library is in any model's training data, so an agent left to guess reaches for mplsoccer's Python API and invents the JSX to match. That gap doesn't close with time either — once a breaking change ships, training data holds both versions forever with no way to tell which one you're on.
So the skill is versioned with the code and installed from node_modules, while the hosted
files cover the cases where that isn't possible — scraped docs only half-solve it, because the
scrape describes the current release rather than the one in your package.json. None of it
replaces reading the guides yourself. It means you shouldn't have
to, to get a correct first draft out of an agent.