> ## 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.

# Styleguide

> Extract a website's colors, typography, spacing and components

> [!TIP]
>
> Read [the Notte skill](https://notte.cc/skill.md) and follow its setup instructions when setting up Notte or building browser automation. This is the shared source for CLI setup, authentication, and the browser-to-code workflow.

`GET /data/web/styleguide` visits a site and returns its design tokens: colors, fonts, spacing, shadows and common components.

> [card] [Try it in the Console](https://console.notte.cc/data-apis/styleguide)
>
> Try this API in the playground, no code needed.

## Quick start

```bash theme={null}
curl "https://api.notte.cc/data/web/styleguide?domain=stripe.com" \
  -H "Authorization: Bearer $NOTTE_API_KEY"
```

The response is abbreviated below.

```json theme={null}
{
  "status": "ok",
  "domain": "stripe.com",
  "styleguide": {
    "mode": "light",
    "colors": { "accent": "#533afd", "background": "#ffffff", "text": "#ffffff" },
    "typography": {
      "headings": {
        "h1": { "fontFamily": "sohne-var", "fontSize": "48px", "fontWeight": 300, "lineHeight": "55.2px" }
      }
    },
    "elementSpacing": {},
    "shadows": {},
    "fontLinks": {},
    "components": {}
  },
  "code": 200,
  "finalDOMState": "loaded",
  "cache_metadata": { "status": "miss", "age_ms": 0 },
  "request_id": "..."
}
```

`finalDOMState` is `loaded` or `still-loading`. If it is `still-loading`, the page hadn't settled when the styleguide was captured.

## Parameters

All parameters are query parameters.

**domain** `string`

The site to analyze, for example `stripe.com`.

**directUrl** `string`

A full URL, when you need a specific page instead of a domain.

**colorScheme** `string` (default: light)

Which color scheme to capture.

**maxAgeMs** `integer`

Maximum age of a cached result. `0` forces a fresh capture.

`timeoutOpts[milliseconds]`, `timeoutOpts[behavior]`, `zdr` and `tags` are also query parameters. They work as described in [common parameters](https://docs.notte.cc/data-apis/overview.md#common-parameters).


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.