Structure

Dashboard

Required

Full-width app shell with persistent sidebar navigation, filter toolbar, alert banner, stats tiers, data tables, charts, and right-rail insights.

Required slots

nav.sidebarnav.headerstats.primarytable.primarychart.overview

Optional slots

breadcrumbssearch.globaluser.menunotifications.menuactions.quickstatus.badgesfilters.toolbarfilters.dropdownfilters.sidebaractions.primaryactions.secondaryalerts.banneralerts.inlinestats.secondarystats.trendstable.secondarychart.detailchart.comparisonchart.distributionlist.activitylist.tasksinsights.sidebarnotes.panelhelp.panelempty.stateerror.statestates.system

Pair this with a visual language to generate code.

Structure

SaaS

Required

Marketing page with hero, trust strip, metrics, feature grid, integrations, pricing, case study, FAQ, and CTA.

Required slots

hero.primaryfeatures.gridpricing.cardscta.banner

Optional slots

trust.logosmetrics.stripfeature.detailintegrations.strippricing.comparisoncase.studytestimonialsfaqstates.system

Pair this with a visual language to generate code.

Structure

Editorial

Required

Publication layout with masthead, nav, featured story, highlights, trending, resources, archive, and newsletter signup.

Required slots

mastheadfeature.storyarticles.grid

Optional slots

articles.trendinghighlights.stripeditors.noteresources.listsidebararchive.liststates.publishingnewsletter

Pair this with a visual language to generate code.

Structure

Portfolio

Required

Personal or studio portfolio with hero, work gallery, services, testimonials, and contact call-to-action.

Required slots

hero.primarywork.galleryproject.featurecontact.cta

Optional slots

services.gridabout.profiletestimonialsclient.logoscase.studiesawards.stripfooter

Pair this with a visual language to generate code.

Structure

Support

Required

Helpdesk workspace with ticket inbox, ticket detail, customer context, and response tools.

Required slots

nav.sidebarinbox.listticket.detailresponse.editor

Optional slots

customer.profileactivity.timelinemacros.panelsla.statusfilters.toolbaralerts.bannerempty.state

Pair this with a visual language to generate code.

How it works

Visual language × structure = one-shot emission

Select a structure, then pick a visual language. Send both to the emit API to generate deterministic code without storing state.