The short version
Design Mode edits the page rendered in your browser and records a local change session. Release builds send usage analytics to PostHog without an opt-in and without a Settings off-switch. An unconfigured source build sends nothing. Events do not include page content or edits. A fresh install selects Cloud mode, but it does not contact the hosted relay until you choose Connect to Cloud and create an anonymous device credential.
When you deliberately send changes to Claude, Cursor or another coding agent, that provider processes the content under your account settings and its own privacy terms.
What the extension stores
| Storage | Contents | Lifetime |
|---|---|---|
storage.local | Interface preferences, including Chrome launch and floating-window preferences, shortcuts, comments, MCP mode, relay URL and the plaintext Cloud credential | Until you clear it or uninstall the extension |
storage.sync | Presets you explicitly save | Synced through your browser account, subject to browser quotas and settings |
| Per-URL style, text and DOM change sessions | Browser session; survives reloads but not a full browser restart |
| Per-URL style, text and DOM change sessions when
| Until cleared, overwritten or the extension is removed |
A session key is based on the page origin, path and query string. Comments are stored separately in local extension storage. Use the Changes tab to inspect, revert or clear recorded changes.
Design Mode reads the rendered DOM, computed styles and geometry required for features you invoke. It cannot run on browser-internal pages, extension-store pages or other surfaces where the browser blocks extension scripts. Do not use it to capture passwords, private form data, confidential screenshots or content you are not authorised to share.
Component-grouped change review also performs a bounded, read-only probe for React or Vue component names and source-file hints attached to changed elements. These hints are used in the local review interface. Markdown export can include detected file and line pointers, so a copied prompt can disclose them. The structured MCP get_changes and Send report does not add that grouping context. Production pages may omit source metadata. The grouping choice is kept only in panel memory.
When network traffic starts
No MCP connection
On a fresh install, Cloud is the selected mode but no Cloud credential exists. Design Mode leaves all MCP transports closed until you connect one. Copy as Prompt continues to work without MCP.
Normal webpage and browser actions can still make requests—for example, loading the page you opened or downloading media from a URL already present in that page. Those are browser requests to the referenced site, not uploads to Design Mode.
Local mode
Local mode connects the extension to the companion server on your machine over
the token-authenticated ws://127.0.0.1:9960 connection by default. Design Mode does not route that transport
through its hosted relay.
The optional guided Local setup previews project configuration before writing
only the files you confirm. Backups stay beside those files and may contain
credentials belonging to other tools, so they should not be committed. The
doctor command probes only the configured localhost bridge. Local feedback
round snapshots and session state stay in process memory.
Cloud mode
Choosing Connect to Cloud registers an anonymous device credential and opens
an authenticated connection to https://mcp.designmode.app. The extension keeps
the plaintext credential in storage.local. The service stores only its
SHA-256 hash, an anonymous tenant identifier, and created/last-seen timestamps
until the credential is revoked.
Agent-to-extension requests and extension responses are temporarily queued in Redis. The implementation requests a 60-second expiry and normally deletes responses as soon as they are consumed. Queue insertion and expiry are separate operations, and expiry failure is suppressed, so 60 seconds is a best-effort target rather than a guaranteed maximum. The relay also keeps operational quota and presence state needed to operate the service.
Structured service logs may include:
- anonymous tenant identifier;
- message or event type;
- payload byte count;
- latency and HTTP status;
- bounded error codes or messages.
The logging API does not accept selectors, screenshots or message payload bodies. Design Mode does not use relay traffic to train a model.
Self-hosted mode
Self-hosted mode points the extension at a deployment you operate. Its retention, logging and access controls are your responsibility. The repository implementation uses the same short-lived queue design as the hosted relay, but your deployed configuration is authoritative.
Screenshots and agent hand-off
Screenshots are captured by the browser. Clipboard and download actions stay on your machine. A screenshot leaves the machine only when you explicitly use an MCP action that returns it to a connected agent. The agent provider then handles it under that provider's terms.
Copy as Prompt writes a Markdown specification to your clipboard. Send to Agent makes the recorded changes available to a connected MCP client. Neither action grants Design Mode access to your repository; the coding agent must already have that access.
Usage analytics
Design Mode is free and MIT-licensed, with no paid version of the extension. It is a self-sustained project focused on features people regularly use. Release builds send usage analytics to PostHog without an opt-in and without a Settings off-switch. An unconfigured source build sends nothing. Analytics does not change what the editor can do. Coding-agent subscriptions, API usage and self-hosting costs are separate.
To measure active installations (DAU/WAU/MAU), retention and feature adoption,
the extension generates a persistent random UUID stored in storage.local
(dm-analytics-distinct-id) and enables PostHog person profiles
($process_person_profile: true) and IP-based GeoIP enrichment
($geoip_disable: false). The event payload includes the browser package
(chrome, firefox or safari), extension version, distribution hint,
validated language, timezone and navigator.userAgent ($raw_user_agent), while
omitting page URLs, selectors, edits, comments, text, tokens and screenshots.
This source does not verify the receiver's retention, deletion or billing
settings. The marketing site is a separate project and is not included in these
extension events.
What designmode.app collects
The marketing and documentation site is separate from the extension.
- Inter is fetched by the build system and self-hosted by Next.js; visiting the deployed site does not request it from Google Fonts.
- Google Analytics is rendered only when the deployment defines
NEXT_PUBLIC_GA_ID. - When enabled, the site sends page views plus
cta_click,contact_clickandoutbound_clickevents. CTA events include the store and browser label; contact events include the clickedmailto:ortel:target; outbound events include the destination URL and link text. The repository does not configure a custom user ID or send extension edits or MCP payloads.
Google processes Analytics traffic under its own terms. A content or tracker blocker may prevent the script from loading without blocking the core site.
Browser permissions
The extension requests:
activeTabandtabsto open the editor against the current tab and respond to navigation;scriptingto inject the inspector after you invoke the extension;storagefor the data described above;sidePanelon Chromium or Firefox's sidebar integration for the editor;- broad host access so the editor can run on sites you choose, except protected browser surfaces.
The extension does not modify a page until you invoke it on that tab.
Revoking or deleting data
- Clear a change session from the Changes tab.
- Remove saved presets or comments in the extension.
- Revoke the Cloud credential from the MCP settings page before deleting it locally if you want the server-side token hash removed.
- Uninstall the extension to remove its browser-managed local storage.
For a security concern, follow the private disclosure process linked below rather than posting credentials or exploit details publicly.