Browser and design mode
Preview your app in the built-in browser, point the agent at elements with design mode, choose where links open, and snap your screen into a chat.
The built-in browser
Machine Code has a browser that opens as a tab next to your chat. Use it to look at your dev server while the agent works on it.
Open one with Ctrl+Shift+B, the browser button in the header, or the + in the tab bar. Use Device size to see the page at phone or tablet width, and Responsive to go back.
Design mode
Design mode lets you point at the thing you want changed instead of describing where it is.
Turn on design mode
Click Design mode in the browser's toolbar.
Pick elements
Click an element on the page. Shift-click to pick several.
Say what to change
Write what you want, for example make these buttons the same height and use the brand blue, and click Attach.
The agent gets each element's location in the page, its HTML and styles, a picture of it, and a hint at which source file it probably comes from.
Where links open
When you click a web link in an agent's reply, Machine Code asks where to open it:
| Choice | What it does |
|---|---|
| Machine Code browser | Opens in a tab next to your chat, with design mode ready. |
| Your browser | Chrome, or whatever your default browser is. |
Tick Always open links this way to stop being asked.
Snapshot into a chat
Press Ctrl+Shift+Alt+S (⌘⇧⌥S on Mac) from anywhere to take a snapshot of your screen and attach it to the chat you're in. If no chat is open, Machine Code asks you to open one first.