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

# Using Lighthouse in Chrome DevTools

> Run Lighthouse audits directly from the Chrome DevTools Lighthouse panel — no installation required.

Lighthouse is built into Chrome DevTools. You can run performance, accessibility, SEO, and best practices audits on any page without installing anything extra.

## Opening the Lighthouse panel

<Steps>
  <Step title="Open Chrome DevTools">
    Press `F12` or `Ctrl+Shift+I` (Windows/Linux) / `Cmd+Option+I` (macOS), or right-click anywhere on the page and select **Inspect**.
  </Step>

  <Step title="Navigate to the Lighthouse panel">
    Click the **Lighthouse** tab in the DevTools toolbar. If you don't see it, click the `»` overflow menu to find it.
  </Step>

  <Step title="Configure categories and mode">
    Choose the audit categories you want to run (Performance, Accessibility, Best Practices, SEO) and select a mode (Navigation, Timespan, or Snapshot). Select a device form factor: **Mobile** or **Desktop**.
  </Step>

  <Step title="Generate the report">
    Click **Analyze page load** (Navigation), **Start timespan** (Timespan), or **Analyze page state** (Snapshot). Lighthouse will run the selected audits and display a report in the panel.
  </Step>
</Steps>

## Audit modes

DevTools exposes all three Lighthouse modes directly in the panel.

<Tabs>
  <Tab title="Navigation">
    **Navigation** mode analyzes a single cold page load. This is the default mode and the most familiar — Lighthouse navigates to the URL, collects metrics, and scores the page.

    **Use this mode to:**

    * Obtain a Lighthouse Performance score and all Core Web Vitals.
    * Assess Progressive Web App capabilities.
    * Analyze accessibility immediately after page load.

    **Limitations:**

    * Cannot analyze form submissions or single-page app transitions.
    * Cannot analyze content that only appears after user interaction.

    Click **Analyze page load** to run a navigation audit.
  </Tab>

  <Tab title="Timespan">
    **Timespan** mode records an arbitrary period of time, typically including user interactions. There is no overall performance score; instead you get metrics scoped to the recorded period.

    **Use this mode to:**

    * Measure layout shifts and JavaScript execution time across interactions.
    * Discover performance opportunities for long-lived pages and SPAs.

    **Limitations:**

    * No overall performance score.
    * Cannot measure moment-based metrics like Largest Contentful Paint.
    * No Accessibility category.

    Select **Timespan**, click **Start timespan**, perform your interactions, then click **End timespan**.
  </Tab>

  <Tab title="Snapshot">
    **Snapshot** mode analyzes the page in its current state at a single point in time. No navigation occurs.

    **Use this mode to:**

    * Analyze the page in a specific state (e.g. after opening a modal).
    * Find accessibility issues deep within SPAs or complex forms.
    * Evaluate best practices of menus and UI elements hidden behind interaction.

    **Limitations:**

    * No performance score or metrics.
    * Cannot analyze network, main-thread, or other non-DOM issues.

    Set up the page in the state you want to evaluate, then click **Analyze page state**.
  </Tab>
</Tabs>

## Throttling settings

By default, Lighthouse simulates a mid-tier mobile device on a slow 4G connection. You can adjust this in the **Throttling** section of the Lighthouse panel:

* **Simulated throttling** (default) — Lighthouse collects data at full speed and then mathematically models what the experience would be on a throttled connection. Fast and reproducible.
* **DevTools throttling** — applies actual network and CPU throttling in the browser during the run. More realistic but can introduce variability.
* **No throttling** — runs without any throttling applied. Useful for debugging, but scores will not reflect real-world conditions.

<Tip>
  For the most consistent and comparable results, use the default simulated throttling. Avoid running Lighthouse while other tabs or applications are consuming significant CPU or network resources.
</Tip>

## Viewing and exporting reports

After a run, the report appears directly in the Lighthouse panel. From there you can:

* **Expand audits** — click any audit to see details, affected elements, and guidance.
* **Export as HTML or JSON** — click the download icon (or the **Export** dropdown) at the top of the report to save the report to disk.
* **Open in Lighthouse Viewer** — click **Export** → **Open in Lighthouse Viewer** to open the report in the online viewer at [https://googlechrome.github.io/lighthouse/viewer/](https://googlechrome.github.io/lighthouse/viewer/). You can also drag a saved JSON report onto the viewer.
* **Share via GitHub Gist** — in the online viewer, click the share icon and sign in to GitHub. Reports are saved as secret Gists under your account.

<Note>
  The online viewer at [https://googlechrome.github.io/lighthouse/viewer/](https://googlechrome.github.io/lighthouse/viewer/) accepts JSON reports exported from any Lighthouse run — CLI, Node module, or DevTools.
</Note>

## Multi-step flows

DevTools supports single Navigation, Timespan, and Snapshot runs individually. It does not support combining multiple steps into a single multi-step user flow report.

<Note>
  To run a multi-step user flow — for example, navigating to a page, interacting with it, and then snapshotting the result — use the [Node API with Puppeteer](/running/user-flows).
</Note>