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

# Criar layout de checkout

> Cria um layout de checkout da conta

Permissão: `checkout_layout.write` (chave secreta; chave publicável não é aceita).

## Endpoint

<CodeGroup>
  ```bash cURL theme={null}
  curl -X POST https://api.upag.dev/v1/checkout/layouts \
    -H "Authorization: Bearer sk_test_your_api_key" \
    -H "Content-Type: application/json" \
    -d '{
      "name": "Tema escuro",
      "favicon": "https://example.com/favicon.png"
    }'
  ```

  ```javascript Node.js SDK theme={null}
  import { Upag } from 'upag';

  const upag = new Upag('sk_test_your_api_key');

  // Sem `theme`, a API aplica o tema padrão.
  const layout = await upag.checkoutLayouts.create({
    name: 'Tema escuro',
    favicon: 'https://example.com/favicon.png',
  });
  ```
</CodeGroup>

<Note>
  Em produção use `https://api.upag.io/v1` com `sk_live_...`.
</Note>

## Parâmetros

<ParamField body="name" type="string" required>
  Nome do layout (1 a 255 caracteres).
</ParamField>

<ParamField body="theme" type="object">
  Tema completo (todas as chaves listadas na [referência](./reference), exceto `font`, que é opcional). Padrão: tema padrão da Upag.
</ParamField>

<ParamField body="favicon" type="string | null">
  Até 255 caracteres.
</ParamField>

<ParamField body="desktop" type="object | null">
  Configuração de blocos para desktop.
</ParamField>

<ParamField body="mobile" type="object | null">
  Configuração de blocos para mobile.
</ParamField>

## Resposta

`201 Created`

```json Response theme={null}
{
  "id": "c1d2e3f4-5a6b-4c7d-8e9f-0a1b2c3d4e5f",
  "name": "Tema escuro",
  "theme": {
    "radius": "0.65rem",
    "background": "oklch(0.985 0 0)",
    "foreground": "oklch(0.145 0 0)",
    "card": "oklch(1 0 0)",
    "card-foreground": "oklch(0.145 0 0)",
    "popover": "oklch(1 0 0)",
    "popover-foreground": "oklch(0.145 0 0)",
    "primary": "oklch(0.7 0.133 226.05)",
    "primary-foreground": "oklch(0.985 0.002 247.839)",
    "secondary": "oklch(0.97 0 0)",
    "secondary-foreground": "oklch(0.205 0 0)",
    "muted": "oklch(0.97 0 0)",
    "muted-foreground": "oklch(0.556 0 0)",
    "accent": "oklch(0.97 0 0)",
    "accent-foreground": "oklch(0.205 0 0)",
    "destructive": "oklch(0.57 0.18 29.23)",
    "destructive-foreground": "oklch(0.97 0 0)",
    "success": "oklch(0.64 0.17 171.45)",
    "success-foreground": "oklch(1 0 0)",
    "warning": "oklch(0.82 0.20 100.24)",
    "warning-foreground": "oklch(1 0 0)",
    "border": "oklch(0.922 0 0)",
    "input": "oklch(0.922 0 0)",
    "ring": "oklch(0.8 0.0906 223.63)"
  },
  "favicon": "https://example.com/favicon.png",
  "desktop": null,
  "mobile": null,
  "createdAt": "2026-03-18T11:15:00.000Z",
  "updatedAt": "2026-03-18T11:15:00.000Z"
}
```

`422` se o corpo for inválido (por exemplo, `theme` com chaves faltando).


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