Themes

Create shared themes to give your data apps consistent styles, fonts, and instructions.

Themes let you define a reusable set of styles and instructions that data apps can pick up. They’re a good way to keep apps on-brand across your organization without having to re-prompt the agent for the same look and feel every time.

What’s in a theme

A theme is a bundle of resources the agent uses when it builds an app:

• CSS rules. Instantiated at the root of the app. Global styles are picked up automatically, and class-targeted styles are available for the agent to apply to specific elements based on the theme’s instructions.
• 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 below.

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.

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:

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.

Bootstrapping a theme with an agent (for example, asking an LLM to draft CSS rules and a skill.md against these guidelines) is a quick way to get a usable first version. From there, iterate on the instructions until the agent produces apps that match what you have in mind.

Setting a default theme

You can mark one theme as the default for your organization. New data apps will use the default theme unless you pick a different one.

Using a theme in a data app

When you create a new data app, you can choose which theme to apply. The agent will use the theme’s CSS, fonts, images, and skill.md instructions as part of the context for the build.