Skip to content
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
22 changes: 21 additions & 1 deletion guides/data-apps/themes.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -14,11 +14,31 @@ A theme is a bundle of resources the agent uses when it builds an app:
- **Fonts.** Loaded into the app and available to the agent.
- **Images.** Logos, imagery intended to be used in the app, design inspiration, or examples of component styles you'd like the agent to follow. The agent tries to guess each image's intent from its name and content, but you can be explicit in the instructions.
- **`skill.md`.** Free-form instructions for the agent on how to use the theme. This can describe a vibe, specific interactions, or tell the agent exactly how to use the other resources in the theme.
- **Extra instructions.** A free-text field on the theme itself, edited inline from the theme detail panel. Useful for quick tweaks you don't want to manage as a file. See [Extra instructions](#extra-instructions) below.

<Tip>
The quality of a theme depends largely on the specificity of the instructions in `skill.md`. The more concretely you describe how the agent should use the CSS, fonts, and images - and what the app should feel like - the more consistent your results will be.
The quality of a theme depends largely on the specificity of the instructions in `skill.md` and the extra instructions field. The more concretely you describe how the agent should use the CSS, fonts, and images - and what the app should feel like - the more consistent your results will be.
</Tip>

## Extra instructions

Each theme has an **Extra instructions** field that you can edit directly from the theme detail panel in **Settings → Themes**. These instructions are passed to the agent alongside any uploaded instruction markdown files when an app is built with the theme.

Use extra instructions for:

- Quick guidance you want to iterate on without uploading or re-uploading a file.
- Overrides or additions that complement a stable `skill.md`.
- Short, focused directives — for example, capitalization rules, layout preferences, or tone.

Example:

```text Extra instructions
Use sentence case for all headings. Prefer dense layouts over generous whitespace.
Always show the company logo in the top-left corner of the app.
```

Leave the field blank to disable it — empty values are ignored at build time.

## Creating a theme

You create and manage themes from the **Themes** page in **Settings**.
Expand Down
Loading