# Overview

Source: https://www.pitchkitjs.com/docs/agents

> Build PitchKit charts with a coding agent — prompts to paste, a skill to install, and docs written for models.

<AgentLogos />

## Prompts

Paste one of these. Each is self-contained — the agent fetches what it needs.

**Set up a new project:**

```text
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:**

```text
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:**

```text
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](/docs/agents/skills)** | Ships inside `@pitchkit/react`; `npx @pitchkit/react skills install` symlinks it into your agent | Anything where you've already installed the package     |
| **[llms.txt](/docs/agents/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

<AgentTools />

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:

```bash
npx @pitchkit/react skills install --dir .cursor/skills
```

For 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](/docs/guides/coordinates) yourself. It means you shouldn't have
to, to get a correct first draft out of an agent.