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

# Browser

**Every box can come with its own browser.** Create a box with `browser: true` to get a managed, headless Chromium that you control through the SDK. You can open tabs, read pages, take screenshots, extract structured data, run AI agents on the live DOM, record sessions, and connect Playwright directly over CDP.

Everything works headless. There is no desktop, no VNC, and nothing to install. Chromium is provisioned with the box and boots on first use.

## Create a box with a browser

<CodeGroup>
  ```typescript box.ts theme={"system"}
  import { Box } from "@upstash/box"

  const box = await Box.create({
    runtime: "node",
    browser: true,
  })

  // Open a tab (boots Chromium on first use)
  const tab = await box.browser.tab.create("https://news.ycombinator.com")

  // Navigate the same tab and read the result
  const page = await tab.goto("https://upstash.com/docs")
  console.log(page.title)
  ```

  ```python box.py theme={"system"}
  from upstash_box import Box

  box = Box.create(runtime="node", browser=True)

  # Open a tab (boots Chromium on first use)
  tab = box.browser.tab.create("https://news.ycombinator.com")

  # Navigate the same tab and read the result
  page = tab.goto("https://upstash.com/docs")
  print(page.title)
  ```
</CodeGroup>

<Note>
  The browser can only be provisioned when the box is created. It cannot be
  enabled on an existing box. If you need a browser on a box that does not have
  one, create a new box with `browser: true`.
</Note>

## How it's organized

`box.browser` manages the browser itself: opening and listing tabs, recordings, and the CDP endpoint. Page-level operations live on a **Tab** handle, the object returned by `tab.create`, `listTabs`, or `getTab`. A tab handle is addressed by its Chrome DevTools Protocol target id, so it stays valid across navigations. You navigate, read, screenshot, and run AI tasks through the same handle.

## What you can do

<CardGroup cols={2}>
  <Card title="Tabs & Navigation" href="/docs/box/overall/browser/tabs">
    Open tabs, navigate, list and re-attach to them, and close them.
  </Card>

  <Card title="Reading Pages" href="/docs/box/overall/browser/reading-pages">
    Page text and links, PNG screenshots, and schema-validated data extraction.
  </Card>

  <Card title="AI Actions" href="/docs/box/overall/browser/ai-actions">
    Natural-language actions and autonomous multi-step tasks on the live DOM.
  </Card>

  <Card title="Live View" href="/docs/box/overall/browser/live-view">
    A shareable, view-only live stream of any tab that you can embed in an iframe.
  </Card>

  <Card title="Recordings" href="/docs/box/overall/browser/recordings">
    Record browser sessions to replayable video with chapter markers.
  </Card>

  <Card title="Connect over CDP" href="/docs/box/overall/browser/connect">
    Drive the same browser with Playwright, Puppeteer, or Stagehand.
  </Card>
</CardGroup>

<Note>
  The AI-powered operations use an LLM and are metered:
  [`extract`](/docs/box/overall/browser/reading-pages) and [`observe`, `act`,
  `run`](/docs/box/overall/browser/ai-actions). They need an API key for the model's
  provider (Anthropic, OpenAI, OpenRouter, Vercel, or OpenCode) on the box or
  your account.
</Note>

You can also watch and control the browser from the **Browser** tab on your box's page in the [Upstash Console](https://console.upstash.com). It shows the live view, runs AI tasks, and includes the SDK snippet for everything you do there.
