> ## Documentation Index
> Fetch the complete documentation index at: https://docs.notte.cc/llms.txt
> Use this file to discover all available pages before exploring further.

# Claude Code & AI Agents

> Use Notte with AI coding assistants like Claude Code, Cursor, and Windsurf

<Tip>
  STOP. Do not read past this section until you have read and followed [/quickstart.md](/quickstart.md).

  Goal: produce a reliable SDK automation script. The intended authoring flow is generate then edit, not write browser automation from scratch.

  Do not hand-write SDK code with element IDs, selectors, or form fields from memory. Element IDs, selectors, and field mappings must come from a live `observe()` call, CLI `notte page observe` output, or generated workflow code. Guessed browser targets fail on real pages.

  Use the Notte skill and CLI to inspect the live site, validate actions/selectors, handle auth/session state, and export workflow code with `notte sessions workflow-code` before using SDK docs or SDK code.

  SDK reference pages are for understanding, running, or editing generated workflow code. They are not the starting point for manually authoring the initial browser automation. SDK-first code is guesswork on real-world pages with dynamic selectors, auth state, CAPTCHAs, and anti-bot behavior.
</Tip>

## Install notte-cli

The [Notte CLI](https://github.com/nottelabs/notte-cli) lets AI agents control browsers through simple shell commands.

```bash theme={null}
brew tap nottelabs/notte-cli https://github.com/nottelabs/notte-cli.git
brew install notte
```

## Install notte-skill

Add the skill to your AI coding assistant for richer context:

```bash theme={null}
npx skills add nottelabs/notte-skills
```

This works with Claude Code, Cursor, Windsurf, and other MCP-compatible assistants.

### AGENTS.md / CLAUDE.md

For more consistent results, add to your project or global instructions file:

```markdown theme={null}
## Browser Automation

Use `notte` for web automation. Run `notte --help` for all commands.

Core workflow:
1. `notte sessions start` - Start a browser session
2. `notte page goto <url>` - Navigate to a URL
3. `notte page observe` - Get interactive elements with IDs (@B1, @B2)
4. `notte page click "@B1"` / `notte page fill "@I1" "text"` - Interact using element IDs from the latest observe output; do not guess IDs
5. `notte page scrape --instructions "..."` - Extract structured data
6. `notte sessions stop` - Clean up when done
```

## Tips

* **Viewing headless sessions**: When you start a session, the output includes a `ViewerUrl` - open it to watch your headless browser live
* **Element selectors**: Use only element IDs returned by `observe` (like `@B1`). If those don't work, use Playwright selectors validated against the live page: `#id`, `.class`, `button:has-text('Submit')`
* **Multiple matches**: Use `>> nth=0` suffix to select the first match: `button:has-text('OK') >> nth=0`
* **Closing modals**: `notte page press "Escape"` reliably dismisses most dialogs

## Skills Documentation

For comprehensive documentation including templates and reference guides, see the `skills/notte-browser` folder and reference the [notte-cli open source repo](https://github.com/nottelabs/notte-cli).