Breakpoints, states, and the code tab

Read the code

New Code tab in the inspector. Select anything on the canvas and see the file it lives in, formatted, scrolled to that element.

Breakpoints are frames

Put the same page at 390 and 1280. Edit the wide one — spacing, layout, size — and Webora writes xl: classes. Rename a breakpoint in settings and every class using it is rewritten.

States

Hover, focus, active, dark mode, reduced motion — pick one in the States section, style it, and it lands as hover:, dark:, motion-reduce:. A light/dark override on a single element is saved too.

Insert

The Insert panel places real Base UI components and adds the import.

Agents write source

MCP gets list_source_files, get_source, search_source, write_source, get_source_diagnostics. A write that breaks the render is rolled back and the agent gets the error, not you.