# Teach the project

> Let the agent inspect what already exists and turn implicit visual decisions into reviewable project context.

## Ask naturally

> Learn the visual language of this project before we make the report.

Or, where slash commands are supported, ask for `/visualize teach`.

## What happens

The agent inspects existing product code, tokens, live pages, and prior artifacts. It asks about gaps and conflicts rather than inventing certainty. Then it proposes three plain files:

- `DESIGN.md` records the visual direction and component behavior.
- `PRODUCT.md` records audience, voice, and product context.
- `tokens.css` makes the visual choices usable in HTML.

Review the full proposed files and approve writing them before they become project guidance. Existing context should not be overwritten silently.

Use [artifact themes](/docs/design-systems) to apply a reference to one document without changing project files. Use [Artifact Explore](/docs/explore) to compare document structures or visual treatments. Neither requires you to run `teach` just because a profile file is missing. System Explore, for comparing complete project-system candidates, remains planned.

<details>
<summary>See representative file excerpts</summary>

From `PRODUCT.md`:

```md
The user asks in natural language. The agent creates or refines a local HTML
file using the project context it already has.
```

From `DESIGN.md`:

```md
Warm paper, coral actions, and dark denim anchors give the site character.
The overhead painting and glass prism form one composition. Examples retain
their own visual direction rather than inheriting the website's palette.
```

From `tokens.css`:

```css
--signal: #ffa38c;
--ink: #362a27;
```

</details>
