Vision

Get Started

Quickstart: Build an app in 1 min

From a blank prompt box to a live app — the fastest path through Vision.

The fastest way to understand Vision is to build something. This takes about a minute.

1. Describe what you want

Your home page opens on one question: “What are we building?” Type into the prompt box: what the app is, who it’s for, and what it should do. Paste screenshots or mockups straight into the box if you have them.

The pill beside the box picks where the work lands — a blank project, a template (working apps you can change right away), one of your GitHub repositories, or an existing site to import.

An inventory tracker for our warehouse team — a table of items with
quantities, a form to log stock in and out, and a low-stock warning list.

Vision starts warming up a workspace the moment you begin typing, so launch is instant when you press Enter.

What are we building?

An inventory tracker for our warehouse team — a table of items with quantities, a form to log stock in and out, and a low-stock warning list.

Agent A blank project

Start from a blank project, a template, a GitHub repository, or an existing site.

The home prompt box — Vision starts warming a workspace the moment you type.

2. Pick a mode

The pill next to the prompt box picks how Vision responds:

  • Agent — makes real changes to your codebase. The default.
  • Design — prototypes it first as clickable mock screens.
  • Prompt Builder — asks a few questions, then builds a winning prompt. Brand-new blank projects start here by default — it’s the best way to turn a rough idea into a solid first build.

You can switch any time — see Agent modes.

3. Press Enter and watch it build

A workspace opens: chat on the left, your app’s live preview on the right. The agent plans, writes code, and runs it — you watch the preview update in real time. If the agent needs something (an API key, a decision), it asks in chat.

inventory-tracker Running
M

Maddie · just now

Add a low-stock warning to the dashboard — flag anything at or under its reorder point

V

Vision

9 steps

Added a Low stock section — items at or under their reorder point get an amber badge.

Guardrails · all 6 checks passed

Agent Ask Vision...
Inventory +
/dashboard
Inventory Log stock

Items

1,284

Low stock

7

Orders today

32

ItemQtyStatus
Steel brackets 412 In stock
M6 hex bolts 38 Low stock
Shipping labels 1,920 In stock
Packing tape 26 Low stock
The workspace: your conversation on the left, the app running live on the right.

4. Iterate

Talk to it like a teammate: “make the table sortable”, “the warning should be red”. For pixel-precise feedback, click any element in the preview and send it to the AI — see Visual edit. Every prompt becomes a restorable version, so you can never lose work (Rollbacks).

5. Publish

When it’s ready, put it live from Project settings → Publish. Your app gets its own public URL, and you can connect a custom domain with automatic HTTPS.

That’s the loop: describe, watch, refine, ship. Next, learn how the agents work under the hood.