Introducing Design View: Visual Theme Editing for AI-Generated Apps
Swap colors, change fonts, and apply theme presets with live preview. Design View extracts tokens from your app and lets you restyle it visually — then AI rewrites the code.
Ambuj Agrawal
Founder & CEO
Visual Theme Editing, No Prompting Required
Changing the look and feel of a generated app used to mean writing careful prompts: "make the background darker," "switch to a serif font," "use a blue accent color." It worked, but it was indirect. You described what you wanted and hoped the AI interpreted it correctly.
Design View flips this. Open the Design View panel, and GenMB extracts the actual design tokens from your live preview — every color, every font family. You see exactly what your app uses, and you change it directly.
How It Works
- Open Design View from the activity bar (palette icon)
- Colors are extracted from your preview automatically — background, text, accent, borders
- Pick new colors using the color palette or enter hex values
- Change typography — select heading and body fonts from a curated list
- Apply a preset — choose from dark, light, sepia, ocean, forest, and more
- Live preview — see changes instantly in your app preview
- Apply — the AI rewrites your source code with the new design system
Theme Presets
Not sure where to start? Theme presets give you a complete design system in one click:
- Dark — Dark backgrounds with light text and vibrant accents
- Light — Clean whites with subtle grays and professional blues
- Sepia — Warm tones inspired by aged paper
- Ocean — Cool blues and teals with a calming feel
- Forest — Natural greens with earthy undertones
- Sunset — Warm oranges and purples for a bold look
Each preset sets all colors and fonts at once. You can further customize individual tokens after applying a preset.
Why It Matters
Design View bridges the gap between "I know what I want it to look like" and "I can describe it in words." Instead of multiple chat iterations to get the right shade of blue, you pick it directly. The AI handles the hard part — rewriting CSS variables, updating Tailwind classes, and ensuring consistency across all components.
Available now for all users. Open any app, click the palette icon, and start designing.
Frequently Asked Questions
What is Design View in GenMB?▼
Do I need to write prompts to change my app's design?▼
What theme presets are available?▼
Ambuj Agrawal
Founder & CEO
Award-winning AI author and speaker. Building the future of app development at GenMB.
Follow on LinkedIn