Add to Chrome
SafariDocs
How to install Design Mode, set up MCP for your AI coding agent, work with the Changes tab, and fix common issues.
Browser support & parity
Design Mode runs on Chromium browsers (Chrome, Edge, Brave, Arc), Firefox 121+ and Safari on Mac. Everything core is available across browsers; a few extras depend on browser APIs, and Safari needs a short manual setup.
ReadKeyboard shortcuts
Design Mode has 12 shortcuts that work directly on the page while the side panel is open, plus two browser-level commands for opening the panel and taking a screenshot — 14 in total.
ReadMCP setup
Start with the copyable setup prompt at https://designmode.app/mcp, or configure your client below. Examples were checked against first-party documentation on 29 September 2026. MCP support, policy and reload behaviour vary by client version.
ReadThe Changes tab
The Changes tab is where every edit you make in the side panel lands. It's the foundation of the handoff — to a teammate, to a tracker, to an AI agent.
ReadTroubleshooting
Most issues fall into a handful of patterns. Here's the short list.
Read