Theme Designer AI
Answer three questions, generate a theme, then apply.
Quick start
- Sign in and open Preview for a portfolio (
/portfolios/preview/[pid]). From theme edit (/portfolios/theme-edit/[pid]), use the workspace menu or header Preview first. - Open the portfolio workspace menu and choose Theme Designer. The panel opens on step 1 with heading Theme Designer.
- Answer all three questions: Overall vibe, Color mode, and Layout density.
- Click Generate theme. When generation finishes, you move to Preview your theme and the live preview updates.
- Click Save theme to keep the result. Use Regenerate to run again with the same answers, or Back to change your answers.
- You should now have an AI-personalized theme saved for this portfolio. Refine further under Global and Sections in the theme editor.
For a short “what is Theme Designer AI?” answer, see the FAQ. This guide is the step-by-step wizard how-to — it does not paste FAQ answers.
Deep dive
Where Theme Designer lives
Theme Designer is an AI wizard on Preview, not a separate sidebar tab inside theme edit. Canonical workspace paths:
| Step | Where |
|---|---|
| Open preview | /portfolios/preview/[pid] |
| Refine after apply | /portfolios/theme-edit/[pid] — Theme editor overview |
From Preview, the workspace menu lists Theme Designer next to Change theme (catalog picker). Closing the designer without saving restores the theme you had when you opened the panel.
The three questions
The Configure step always asks the same three labels (exact product copy):
| Question | What you choose |
|---|---|
| Overall vibe | Mood for colors, type, and spacing (for example Minimal, Professional, Bold) |
| Color mode | Light, Dark, or No preference |
| Layout density | Airy, Balanced, or Compact — how spacious the page should feel |
All three are required before Generate theme runs.
Starts from a recommended persona base
Theme Designer does not invent a blank theme from scratch. It starts from the recommended persona catalog base for your portfolio category (shown in the info message, for example Studio or Tech), then personalizes:
- Colors
- Typography
- Spacing feel from Layout density
- Up to three section layout overrides
That “up to three layouts” limit is intentional. Theme Designer is a strong starting point, not an unlimited rewrite of every section layout. After you save, use Sections in the theme editor to change other layouts by hand — see Section styles.
Prefer Theme Designer when you want a fresh overall look. Prefer Global / Sections or Edit theme with Mira for small follow-up tweaks.
Layout density is spacing feel
Layout density maps to how airy or compact the page feels (Airy / Balanced / Compact). Portura applies that as theme spacing — you are not typing raw CSS padding or inventing custom spacing values in this wizard.
Generate, preview, regenerate, save
| Action | What it does |
|---|---|
| Generate theme | Runs AI generation from your answers and opens Preview your theme |
| Regenerate | Runs again with the same answers (preview updates again) |
| Back | Returns to the questions so you can change answers |
| Save theme | Persists the generated theme for this portfolio |
Watch the live preview after generate. If you close the panel without Save theme, Preview restores the theme from when you opened Theme Designer.
Tokens and usage
Generating (and regenerating) uses AI tokens (usage credits). Allowances, account credit, and plan differences change over time — check the FAQ and Settings → billing. A dedicated Plans and tokens guide will cover this when Account & billing Help ships. This article does not hard-code prices or token counts.
Theme Designer vs other AI surfaces
| Goal | Use |
|---|---|
| Full starting theme from three questions | Theme Designer (this guide) |
| Chat about theme styles in theme edit | Edit theme with Mira |
| Portfolio content review and change proposals | Mira portfolio review |
Theme Designer changes theme look and limited layouts. Default generate keeps your existing pages and placements. Recompose site is opt-in when you want Designer to propose a new page map. Catalog apply updates look, not pages. Scroll order after you save: Layers and section order. Theme Designer does not rewrite your portfolio text, projects, or media — edit those in the portfolio editor.
Tips
- Finish all three questions before Generate theme — invalid fields show Required.
- Start with a vibe that matches how you present your work; regenerate if the first pass misses the mark.
- After Save theme, open Edit theme and tune Hero readability or Global colors if needed.
- Expect at most three layout changes from one generate — plan manual Sections edits for the rest.
- Use the ? next to Theme Designer on step 1 for a short reminder and a Learn more link to this article.
If you only need a catalog persona or color variant without AI, use Change theme on Preview instead of Theme Designer.