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

# Browser agents

> Give your agents a headless browser to browse and interact with the web at scale, persistent sessions, real-time observability, and Agent Identity built in.

Most of the web doesn't have an API. Browserbase gives your agents a headless browser so they can do real work on the web at scale, without breaking.

* **Browse anything** — if a human can do it in a browser, your agent can too
* **Stay logged in** — sessions persist across runs with [contexts](/platform/browser/core-features/contexts), no re-auth loops
* **See what your agent sees** — every session is inspectable via [live view](/platform/browser/observability/session-live-view) and [session recording](/platform/browser/observability/session-recording)
* **Access any website** — [Agent Identity](/platform/identity/overview) gets your agent past anti-bot systems and authentication walls
* **Skip the infra** — no browser clusters to manage, spin up thousands of sessions on demand

<Info>
  **Looking to deploy your browser agent?** [Functions](/platform/runtime/overview) let you deploy and run agents on Browserbase for faster, more secure execution — invocable via webhook or API call.
</Info>

## What you can build

If your agent touches the web, it needs a browser. Build agents that:

* Navigate portals, fill out forms, and submit data on sites without APIs
* Log into third-party tools and take action on a user's behalf
* Pull live data from sites that require authentication or block bots
* Run parallel workloads across thousands of browser sessions

Whether you're using LangChain, CrewAI, Mastra, custom tooling, or [Stagehand](https://stagehand.dev) — Browserbase drops in as the browser layer your agent already needs.

## Implementation

Use [Search](/platform/search/overview) and [Fetch](/platform/fetch/overview) to gather context cheaply, then hand off to a browser agent for interaction.

<Steps>
  <Step title="Search the web">
    Use the [Search API](/platform/search/overview) to find relevant pages without spinning up a browser. Returns structured results — quick, token-efficient recon for your agent.
  </Step>

  <Step title="Fetch page content">
    Use the [Fetch API](/platform/fetch/overview) to retrieve content from a target URL. Faster and cheaper than a full session for read-only checks and pre-processing.
  </Step>

  <Step title="Launch a browser agent">
    Use [Stagehand](https://docs.stagehand.dev) to give your agent a headless browser. The agent autonomously navigates, interacts with elements, and extracts structured data — powered by any model via the [Model Gateway](/platform/model-gateway/overview).
  </Step>
</Steps>

## Example: Research agent

Search the web, fetch a page for recon, then launch a Stagehand agent to extract key points from the top result.

<Tabs>
  <Tab title="Node.js">
    ```typescript theme={null}
    import "dotenv/config";
    import { Browserbase } from "@browserbasehq/sdk";
    import { Stagehand } from "@browserbasehq/stagehand";

    async function main() {
      const bb = new Browserbase({ apiKey: process.env.BROWSERBASE_API_KEY! });

      const query = "best coffee shops in San Francisco";

      // Step 1: Search the web for relevant pages (no browser needed)
      const searchData = await bb.search.web({
        query,
        numResults: 5,
      });

      const topResult = searchData.results[0];
      if (!topResult) throw new Error("No search results found.");

      const targetUrl = topResult.url;

      // Step 2: Fetch page content for recon (no browser needed)
      const fetchResult = await bb.fetchAPI.create({
        url: targetUrl,
        allowRedirects: true,
      });

      console.log(`Fetched ${targetUrl} — ${fetchResult.content.length} chars`);

      // Step 3: Launch a browser agent with Stagehand
      // Model Gateway routes LLM requests through your Browserbase API key —
      // no separate model API key needed.
      const stagehand = new Stagehand({
        env: "BROWSERBASE",
        model: "anthropic/claude-sonnet-4-6",
      });

      await stagehand.init();

      const page = stagehand.context.pages()[0]!;
      await page.goto(targetUrl);

      const agent = stagehand.agent({
        systemPrompt:
          "You are a helpful research assistant browsing the web. " +
          "Extract factual information from pages. Be concise and structured.",
      });

      const result = await agent.execute({
        instruction:
          `You're on a page about "${topResult.title}". ` +
          `Extract the top 3 recommendations or key points from this page. ` +
          `For each, include the name and a one-sentence summary.`,
        maxSteps: 10,
      });

      console.log(result);

      // Watch the session recording to see what the agent did
      console.log(
        `Recording: https://browserbase.com/sessions/${stagehand.browserbaseSessionID}`,
      );

      await stagehand.close();
    }

    main().catch(console.error);
    ```
  </Tab>
</Tabs>

<Note>
  Stagehand's [Python SDK](https://docs.stagehand.dev) also supports this workflow. See the [Python quickstart](/welcome/quickstarts/stagehand) to get started.
</Note>

## Best practices

### Use Search and Fetch for recon

Search and Fetch are faster and cheaper than a full browser session. Use them to gather context, then send your agent to pages that need interaction.

<Tabs>
  <Tab title="Node.js">
    ```typescript theme={null}
    const bb = new Browserbase({ apiKey: process.env.BROWSERBASE_API_KEY! });

    // Search returns structured results without a browser
    const results = await bb.search.web({ query: "target query", numResults: 5 });

    // Fetch retrieves page content without a browser
    const page = await bb.fetchAPI.create({ url: results.results[0].url });

    // Only launch a browser session for pages that need interaction
    ```
  </Tab>
</Tabs>

### Persist sessions with contexts

Use [browser contexts](/platform/browser/core-features/contexts) to save login state across agent runs. Your agent authenticates once, then picks up where it left off — no re-auth loops.

<Tabs>
  <Tab title="Node.js">
    ```typescript theme={null}
    const stagehand = new Stagehand({
      env: "BROWSERBASE",
      browserbaseSessionCreateParams: {
        browserSettings: {
          context: { id: "my-agent-context", persist: true },
        },
      },
    });
    ```
  </Tab>
</Tabs>

### Constrain agent behavior with system prompts

A well-scoped system prompt reduces hallucination, limits unnecessary navigation, and keeps token usage predictable.

<Tabs>
  <Tab title="Node.js">
    ```typescript theme={null}
    const agent = stagehand.agent({
      systemPrompt:
        "You are a data extraction agent. Only interact with the current page. " +
        "Do not navigate to external links. Extract structured data and return it.",
    });

    const result = await agent.execute({
      instruction: "Extract all pricing tiers from this page.",
      maxSteps: 5,
    });
    ```
  </Tab>
</Tabs>

### Monitor with live view and session recordings

Use [live view](/platform/browser/observability/session-live-view) to watch agent sessions in real time, and [session recordings](/platform/browser/observability/session-recording) to debug after the fact.

<Tabs>
  <Tab title="Node.js">
    ```typescript theme={null}
    const stagehand = new Stagehand({ env: "BROWSERBASE" });
    await stagehand.init();

    // Every session gets a recording URL automatically
    console.log(
      `Watch live: https://browserbase.com/sessions/${stagehand.browserbaseSessionID}`,
    );
    ```
  </Tab>
</Tabs>

## Agent identity & trust

Different agents need different levels of trust. Browserbase supports a layered identity model — from basic API keys to cryptographic proof-of-humanity — so you can match the access level to your use case.

| What your agent needs                    | How to get it                                                                                      |
| ---------------------------------------- | -------------------------------------------------------------------------------------------------- |
| Access Browserbase browsers              | [API key](/welcome/getting-started) — standard SDK authentication                                  |
| Log into third-party sites               | [1Password](/integrations/1password/introduction) — secure credential access from vaults           |
| Bypass bot detection on partner sites    | [Web Bot Auth](/platform/identity/overview) — Cloudflare Signed Agents                             |
| Prove it's human-backed (permissionless) | [AgentKit](/integrations/agentkit/introduction) — proof-of-humanity via Tools for Humanity on x402 |

The [x402 integration](/integrations/x402/introduction) is particularly relevant for autonomous agents: pay with crypto (no account needed), prove humanity with AgentKit (no KYC needed), and get premium Verified browsers with residential proxies.

<Card title="Agent Identity overview" icon="shield-check" href="/platform/identity/overview">
  Learn about all identity layers available to your agents
</Card>

## Next steps

<CardGroup cols={3}>
  <Card title="Stagehand" icon="wand-magic-sparkles" href="https://docs.stagehand.dev">
    The AI SDK for browser agents
  </Card>

  <Card title="Agent Identity" icon="shield-check" href="/platform/identity/overview">
    Access any website without getting blocked
  </Card>

  <Card title="x402 + AgentKit" icon="fingerprint" href="/integrations/x402/agentkit">
    Permissionless premium browsers with proof-of-humanity
  </Card>

  <Card title="Contexts" icon="database" href="/platform/browser/core-features/contexts">
    Persist login state across agent runs
  </Card>

  <Card title="Functions" icon="bolt" href="/platform/runtime/overview">
    Deploy and run agents on Browserbase
  </Card>

  <Card title="Model Gateway" icon="key" href="/platform/model-gateway/overview">
    One API key, access to every model
  </Card>
</CardGroup>

## GitHub repository

Get started with the full ready-to-use browser agent implementation.

<Card title="Browser agent demo" icon="rocket" href="https://github.com/browserbase/gtm-demos/tree/main/apps/browser-agent">
  Clone, configure, and run in minutes
</Card>
