# Getting started

This guide walks you through your first Audome render in under five
minutes. You will need an Audome account with a paid plan and at least
one credit available.

## 1. Mint an API token

1. Sign in at `https://audome.io/signin`.
2. Open `https://audome.io/render/api-tokens`.
3. Click **Create new token**, give it a name, and copy the value.
   Tokens are shown only once — store yours in a secrets manager.

The token is a long random string prefixed with `audm_`. Treat it like
a password.

## 2. Create a template

1. Go to `https://audome.io/render` and click **New project**.
2. Drag text and image elements onto the canvas.
3. For each element you want to be dynamic, toggle **Dynamic** in the
   right rail and set its **Key** (for example `title` or `hero`).
4. Save the project. Copy the `projectId` shown in the URL.

## 3. Render via cURL

```bash
curl -X POST https://audome.io/api/render/generate \
  -H "Authorization: Bearer YOUR_API_TOKEN" \
  -H "Content-Type: application/json" \
  -d '{
    "projectId": "PROJECT_ID",
    "data": {
      "title.text": "Hello world",
      "hero.img": "https://example.com/photo.jpg"
    },
    "format": "png",
    "quality": 90
  }'
```

The response is JSON containing a public CDN URL:

```json
{
  "success": true,
  "imageUrl": "https://cdn.audome.io/renders/abc123.png",
  "creditsUsed": 1,
  "creditsRemaining": 499
}
```

## 4. Embed the Studio in your own app

If you would rather give your customers a visual editor, drop the
embed SDK into any HTML page:

```html
<div id="audome-studio" style="width:100%;height:700px;"></div>

<script src="https://audome.io/embed/audome-embed.js"></script>
<script>
  AudomeEmbed.studio({
    container: '#audome-studio',
    token: 'YOUR_API_TOKEN',
    theme: 'dark',
    locale: 'en',
    onRender: (imageUrl) => {
      console.log('Rendered:', imageUrl);
    },
  });
</script>
```

See [Embed SDK](/docs/embed) for the full options reference and the
`postMessage` event protocol.

## 5. Production checklist

- Move tokens out of client-side code and into your server.
- Sign embed sessions with short-lived tokens that you proxy from your
  backend, so customers never see your master key.
- Cache rendered URLs — they are immutable and served from CDN.
- Set up a [webhook](/docs/webhooks) for asynchronous workflows so you
  do not have to keep the HTTP connection open for slow renders.
