Say goodbye to toggling Chrome DevTools device mode back and forth! ScreenSync mirrors scrolls, clicks, and form inputs simultaneously across Mobile, Tablet, and Desktop in real time. Capture full-page bug reports, record videos, and automate cross-device QA with AI.
Eliminate device switching friction, capture ironclad visual bug evidence, and automate regression audits with AI.
Interact on any single device viewport and watch all others mirror your actions with 60/120 FPS precision.
Capture indisputable visual evidence in seconds without opening third-party screen snip tools or video software.
Native Model Context Protocol (MCP) server enables AI agents (Claude, Gemini, Antigravity, Cursor) to run automated QA runs.
Never experience blank screens or "refused to connect" errors. Built-in Declarative Net Request rules bypass iframe restrictions.
Measure element dimensions, spacing, typography, and breakpoint triggers with pixel-perfect accuracy.
Zero data collection. All simulations, screenshot captures, and recordings run 100% client-side inside your browser.
See why professional QA engineers and frontend leads switch from clunky toggling to real-time synchronized testing.
ScreenSync includes a native Model Context Protocol (MCP) server running over WebSocket. Your AI assistants can programmatically control multi-screen views, interact with buttons, capture visual screenshots, and catch layout overflow bugs autonomously.
| MCP Tool Name | AI Action Description |
|---|---|
| responsive_navigate | Loads target URL into all active device viewports. |
| responsive_interact | Simulates clicks, form inputs, and scroll actions across screens. |
| responsive_capture_screenshots | Captures base64 visual snapshots for LLM vision bug detection. |
| responsive_get_logs | Collects runtime JavaScript console errors and network failures. |
{
"mcpServers": {
"screensync": {
"command": "node",
"args": [
"/path/to/ScreenSync/mcp-server/index.js"
]
}
}
}
Choose your preferred setup method: instant 1-click install from the Chrome Web Store or load directly from source.
Open the official ScreenSync listing on the Google Chrome Web Store Developer Dashboard.
Confirm permissions. ScreenSync operates 100% locally and never transmits your browsing data.
Pin ScreenSync to your browser toolbar. Click the icon anytime on any webpage to open the studio.
Navigate to chrome://extensions/ in your browser and turn on Developer Mode toggle in the top-right corner.
Select the local folder where ScreenSync is cloned (e.g. /Users/t2t-2026/Desktop/PRJ/ScreenSync).
The ScreenSync icon will appear in your extensions list. Click it on any website to open the studio.
Run npm install inside the mcp-server/ directory to install WebSocket & Model Context Protocol SDK.
Add the Node executable path to Claude Desktop's config or Cursor's MCP server settings.
Ask Claude: "Audit localhost:3000 across mobile and tablet viewports and report any overflowing containers."
Common queries regarding multi-screen synchronization, localhost security, and AI integrations.
http://localhost:3000, http://localhost:5173, http://127.0.0.1:8080, and internal intranet IP addresses. Because it runs locally inside your browser, no tunneling (like ngrok) is necessary.
declarativeNetRequest API (Manifest V3) to selectively remove X-Frame-Options and Content-Security-Policy: frame-ancestors headers strictly on the extension's simulation tabs. This allows testing any site without white screen errors while keeping standard tabs securely protected.