Using design mode.
UPDATED 2026-08-08Design mode is a dedicated chat mode that produces one gorgeous HTML file per reply. Start one from the Design row in the sidebar, or from ⌘K → "New design chat," or by hitting /chat?new=1&mode=design directly.
Give it a specific brief: name, palette, voice, section list. "Landing page for Ember & Oak, a specialty coffee shop in Portland — warm cream palette with a burnt amber accent, hero + three features + hours" produces a substantially better result than "coffee shop landing page." The specification collapses the model's output space; the model is happier when it doesn't have to guess.
Every reply becomes a design artifact of type=design. The panel opens automatically on the right side of the chat with a live iframe preview. Toggle between Desktop / Tablet / Phone widths using the chips at the top of the preview to check responsive behavior. Hit Copy to grab the HTML or Download to save it as a .html file.
Iterate by asking for specific changes: "cut the testimonial section; replace with a mailing-list signup." The model preserves the parts you didn't ask to change and re-emits the full document so the preview always has a runnable file. Two-to-four changes per turn is the sweet spot; more than that and the model starts losing context.
Design turns are the most expensive kind of chat you can send (up to 16,000 output tokens, 60-120s wall time, roughly $0.05-$0.15 per turn). Use design mode when you need a shipped-quality single-page design; use a normal chat with a code block when you need small snippets.