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

# Live preview & recording

> Watch the agent's browser in real time. Embed it in your app.

<Note>
  Want a ready-made UI? See the [Chat UI tutorial](/cloud/tutorials/chat-ui).
</Note>

`liveUrl` is returned on session creation.

<CodeGroup>
  ```python Python theme={null}
  from browser_use_sdk.v3 import AsyncBrowserUse

  client = AsyncBrowserUse()
  session = await client.sessions.create(task="Check how many GitHub stars browser-use has")
  print(session.live_url)
  ```

  ```typescript TypeScript theme={null}
  import { BrowserUse } from "browser-use-sdk/v3";

  const client = new BrowserUse();
  const session = await client.sessions.create({
    task: "Check how many GitHub stars browser-use has",
  });
  console.log(session.liveUrl);
  ```
</CodeGroup>

`liveUrl` is also returned when creating a standalone browser session:

<CodeGroup>
  ```python Python theme={null}
  browser = await client.browsers.create()
  print(browser.live_url)
  ```

  ```typescript TypeScript theme={null}
  const browser = await client.browsers.create();
  console.log(browser.liveUrl);
  ```
</CodeGroup>

## Embed live browser into your app

Useful for human interaction or to see live what's happening.

```html theme={null}
<iframe
  src="{LIVE_URL}"
  width="1280"
  height="720"
  allow="autoplay"
  style="border: none; border-radius: 8px;"
></iframe>
```

The live URL is hosted on `live.browser-use.com`. If your app sets a Content Security Policy, add it to your `frame-src` directive:

```
Content-Security-Policy: frame-src 'self' https://live.browser-use.com;
```

For responsive sizing, use CSS instead of fixed dimensions:

```html theme={null}
<iframe
  src="{LIVE_URL}"
  style="width: 100%; aspect-ratio: 16/9; border: none; border-radius: 8px;"
  allow="autoplay"
></iframe>
```

## Customize

Append query parameters to the `liveUrl`:

| Parameter | Values                    | Description                             |
| --------- | ------------------------- | --------------------------------------- |
| `theme`   | `light`, `dark` (default) | Light or dark mode                      |
| `ui`      | `false`                   | Hide the browser chrome (URL bar, tabs) |

```
https://live.browser-use.com?wss=...&theme=light
https://live.browser-use.com?wss=...&ui=false
```

## Recording

<Note>
  `waitForRecording` / `wait_for_recording` requires the **v3 SDK** (`from browser_use_sdk.v3 import AsyncBrowserUse` / `import { BrowserUse } from "browser-use-sdk/v3"`).
</Note>

Enable recording to get an MP4 video of the browser session. Only available when the agent actually opens a browser — tasks answered without browsing produce no recording. If you run multiple tasks in the same session (with `keep_alive`), you may get multiple recordings.

<CodeGroup>
  ```python Python theme={null}
  from browser_use_sdk.v3 import AsyncBrowserUse

  client = AsyncBrowserUse()
  result = await client.run(
      "Check how many GitHub stars browser-use has",
      enable_recording=True,
  )

  # Waits up to 15s for recording to be ready. Returns [] if no browser was opened.
  urls = await client.sessions.wait_for_recording(result.id)
  for url in urls:
      print(url)  # presigned MP4 download URL
  ```

  ```typescript TypeScript theme={null}
  import { BrowserUse } from "browser-use-sdk/v3";

  const client = new BrowserUse();
  const result = await client.run("Check how many GitHub stars browser-use has", {
    enableRecording: true,
  });

  // Waits up to 15s for recording to be ready. Returns [] if no browser was opened.
  const urls = await client.sessions.waitForRecording(result.id);
  for (const url of urls) {
    console.log(url); // presigned MP4 download URL
  }
  ```
</CodeGroup>

For standalone browser sessions, pass `enable_recording` when creating the browser and retrieve the URL after stopping it:

<CodeGroup>
  ```python Python theme={null}
  browser = await client.browsers.create(enable_recording=True)
  # ... use the browser via CDP ...
  stopped = await client.browsers.stop(browser.id)
  print(stopped.recording_url)  # presigned MP4 download URL
  ```

  ```typescript TypeScript theme={null}
  const browser = await client.browsers.create({ enableRecording: true });
  // ... use the browser via CDP ...
  const stopped = await client.browsers.stop(browser.id);
  console.log(stopped.recordingUrl); // presigned MP4 download URL
  ```
</CodeGroup>

<Warning>
  Recording URLs are presigned and **expire after 1 hour**. Download or serve the recording promptly. If you need to access it later, save the MP4 to your own storage.
</Warning>

## Related

* [Live messages](/cloud/agent/streaming) — stream the agent's messages alongside the live browser view
* [Follow-up tasks](/cloud/agent/follow-up-tasks) — chain tasks in one session while watching live