{"slug": "give-the-google-antigravity-agent-eyes-screenshots-and-page-reading-over-mcp", "title": "Give the Google Antigravity agent eyes: screenshots and page reading over MCP", "summary": "The SnapRender team published a guide showing how to connect a screenshot MCP server to Google Antigravity so the coding agent can capture and read rendered web pages instead of guessing at layout results. The setup requires adding a serverUrl entry to Antigravity's mcp_config.json (not Gemini CLI's httpUrl), authenticating via browser or Bearer API key header, and optionally setting an mcp(snaprender/*) allow policy plus eager tool loading to avoid per-call approval prompts. The guide closes with prompts for mobile layout checks, design review, and markdown doc extraction.", "body_md": "*Written by the SnapRender team. SnapRender is the screenshot API used in this guide; the setup works on its free plan.*\n\nGoogle Antigravity is good at writing front-end code. What it cannot do out of the box is look at the result. It edits a component, tells you it fixed the layout, and has no way to check what the page actually looks like on a phone.\n\nMCP closes that gap. Antigravity can call tools from any MCP server you add, so if one of those tools returns a screenshot, the agent can open a URL, look at the rendered page and reason about what it sees. This guide adds one such server, explains the two Antigravity details that trip people up, and ends with prompts that are worth trying.\n\nAfter the setup below, the Antigravity agent can:\n\nCookie banners and ads are removed before the capture, so the agent sees the page the way a visitor does instead of a consent wall.\n\nAntigravity (the App, the IDE and the CLI) reads MCP servers from the same file:\n\n`~/.gemini/config/mcp_config.json` for all projects`.agents/mcp_config.json` for one workspace\nThe quickest way to open it: in the App, go to Customizations, Installed, and click Copy Config File Path next to MCP Servers. In the IDE, open the \"...\" menu at the top of the agent panel, then MCP Servers, Manage MCP Servers, View raw config.\n\nAdd this:\n\n```\n{\n  \"mcpServers\": {\n    \"snaprender\": { \"serverUrl\": \"https://app.snap-render.com/mcp\" }\n  }\n}\n```\n\n**The first detail that trips people up:** the field is `serverUrl` (`url` also works). Gemini CLI uses `httpUrl` for the same thing, and Antigravity does not accept it. If you copied a Gemini CLI snippet and the server never shows up, that is why.\n\nUnder MCP Servers, click **Authenticate** next to snaprender. A browser window opens; sign in (a free account is enough) and click Allow. Antigravity then shows an authorization code. Copy it, paste it into \"Enter authorization code\" and click Submit.\n\nIf you would rather use an API key than the browser sign-in, send it as a header instead:\n\n```\n{\n  \"mcpServers\": {\n    \"snaprender\": {\n      \"serverUrl\": \"https://app.snap-render.com/mcp\",\n      \"headers\": { \"Authorization\": \"Bearer YOUR_API_KEY\" }\n    }\n  }\n}\n```\n\nThe key sits in the file as plain text, so keep that file out of version control.\n\nUntil you allow them, MCP tools run in Ask mode: the agent stops and asks before every single call. That is a sensible default, but it gets old quickly when the agent wants to take six screenshots in a row.\n\nYou can allow the whole server with a policy of `mcp(snaprender/*)`. If you also want the screenshot tool registered on every turn (Antigravity loads MCP tools lazily by default), add this inside the snaprender entry:\n\n```\n\"tools\": { \"take_screenshot\": { \"eager\": true } }\n```\n\nsnaprender should show as connected under MCP Servers (or in `/mcp` in the CLI). Then ask the agent something simple:\n\nTake a screenshot of [https://example.com](https://example.com) and describe what you see.\n\nIf you get a description of the page back, you are done.\n\n**Mobile check after a change.**\n\nScreenshot [https://your-preview-url.vercel.app](https://your-preview-url.vercel.app) on desktop and on iPhone 15 Pro and list what breaks on mobile.\n\nThe agent gets two images and compares them. It is surprisingly good at spotting overflowing tables, buttons pushed off screen and text that wraps badly.\n\n**Design review against a description.**\n\nTake a full-page screenshot of the deployed preview and check it against the design I described earlier. List every difference.\n\n**Reading docs instead of guessing.**\n\nRead [https://example.com/docs/api](https://example.com/docs/api) as markdown and write a typed client for the endpoints it documents.\n\nThis one does not need an image at all. Markdown extraction gives the agent the actual docs text instead of whatever it remembers from training.\n\n**Competitor or reference pages.**\n\nScreenshot the pricing pages of these three sites and summarize how each one structures its plans.\n\nThe screenshots are taken on SnapRender's servers, not on your machine. That means `localhost` and private network addresses are out of reach. For local work, point the agent at a public preview deployment (Vercel, Netlify, Cloudflare Pages and similar all give you one per branch) or a tunnel.\n\nThe free plan includes 200 captures a month, which is plenty for checking your own work. Each screenshot or page read uses one capture; failed captures are not counted.\n\nThe full setup page, including the local `npx` option and an FAQ, is here: [SnapRender for Google Antigravity](https://snap-render.com/ai-connectors/antigravity).", "url": "https://wpnews.pro/news/give-the-google-antigravity-agent-eyes-screenshots-and-page-reading-over-mcp", "canonical_source": "https://dev.to/dennis-ddev/give-the-google-antigravity-agent-eyes-screenshots-and-page-reading-over-mcp-dob", "published_at": "2026-11-09 21:13:17+00:00", "updated_at": "2026-11-09 21:24:25.636710+00:00", "lang": "en", "topics": ["ai-agents", "agent-protocols", "ai-tools", "developer-tools"], "entities": ["Google Antigravity", "SnapRender", "Gemini CLI", "MCP", "Vercel"], "also_reported_by": [], "alternates": {"html": "https://wpnews.pro/news/give-the-google-antigravity-agent-eyes-screenshots-and-page-reading-over-mcp", "markdown": "https://wpnews.pro/news/give-the-google-antigravity-agent-eyes-screenshots-and-page-reading-over-mcp.md", "text": "https://wpnews.pro/news/give-the-google-antigravity-agent-eyes-screenshots-and-page-reading-over-mcp.txt", "jsonld": "https://wpnews.pro/news/give-the-google-antigravity-agent-eyes-screenshots-and-page-reading-over-mcp.jsonld"}}