What is a Block?
A block is one typed piece of a page: a heading, a paragraph, an image, a button, a form field, a table. A page is blocks arranged in a tree, and an app is a set of pages.
Blocks come from packs
Blocks are not invented on demand. Every block comes from a pack, and each one has a manifest that says what it is for and which properties it accepts. The agent builds pages only from the blocks your project’s packs provide, so what it puts on a page is something the app can actually draw.
If a page needs a block your project does not have, the agent adds a pack from your workspace that has it. If no installed pack has it, the agent tells you, and you can install one from the marketplace.
The kinds of blocks
The foundation pack, which every project starts with, sorts its blocks like this:
| Kind | Examples |
|---|---|
| text | Headings, text, prose, alerts, code. |
| media | Images. |
| layout | Sections, grids, navigation bars, bottom bars, split views. |
| container | Cards, tabs, accordions. |
| control | Buttons, links, badges, avatars, breadcrumbs, dropdowns, pagination. |
| form | The form itself, inputs, selects, checkboxes, toggles, date inputs. |
| data | Tables, lists and repeaters that show records, progress, money amounts. |
| feedback | Spinners, toasts, progress rings. |
| overlay | Modals, drawers, popovers, tooltips. |
Other packs add more, such as charts or carousels. The studio’s Packs panel shows which packs your project uses.
Patterns: ready arrangements
A hero band, a pricing table or a contact form is not a single block. It is a pattern: a ready arrangement of blocks that a pack provides. The agent copies a pattern into the page and fills every placeholder with your real content, so you get a finished band rather than a template.
Every page sits in a shell pattern — a top menu, a bottom bar, or no menu for a single-task flow — and the rest of the page is bands inside it. The agent keeps the same shell across the app.
Look comes from the theme
Blocks do not carry their own colours. The app has one theme, set in
app/definitions/appearance.json, and blocks use its colours, fonts and
spacing. To change the look of the whole app, ask for a different theme or
brand colours in the chat; every page follows.
Properties are checked
Every block has properties: its text, its image, its link, its options. They are checked against the block’s own definition. The studio’s Checks panel lists anything wrong, and an app with errors cannot be published until they are fixed.