Get to know Design Studio
Create screens, edit on the canvas, test a prototype, and hand the design to a coding agent.
Last updated 23 September 2026
Studio is Choro’s default design workspace. It lives inside your project and uses your existing Codex or Claude connection for AI design work. You do not need a Penpot account or a separate browser window to create or implement a Studio design.
Find your way around
Design / Prototype at the top switches between editing the design and trying its interactions.
Agent, Screens, and Design system in the left sidebar keep the conversation, screen list, and shared styles close to your work.
The screen header contains All screens, the current screen context, and editing controls when an editor is active.
Canvas, Grid, and Focus at the bottom are three views of the same design. New designs start in Canvas.
Compare opens the implementation preview. Implement prepares a separate coding-agent request.
A typical workflow
Create a Studio design, or choose Design from a task or document.
Ask the Agent to create the screens you need, then double-click a screen to edit it.
Use Prototype to test linked screens and inspect desktop or mobile layouts.
Choose Implement when the design is ready, then use Compare to review the running app.
Existing design tools
Penpot is optional and off by default. Enable Settings → Beta features → Penpot only if you want that integration; Studio remains the default. Existing Penpot files are not converted into Studio designs. You can also add a Figma link as a reference; adding a link does not import an editable Studio screen.