How to Use the PagePixels MCP in Cursor

Q: How do I configure PagePixels in my Cursor project?

Add the PagePixels MCP Server to your .cursor/mcp.json file in the root of your workspace. Once configured, your AI agent can immediately call the screenshot tools during your coding sessions.

Q: Can Cursor use PagePixels to test responsive styles?

Yes, your agent can call quicksnapwithoptions with custom viewports to capture different screen sizes. This lets you inspect mobile, tablet, and desktop layouts side-by-side inside the editor.

Q: How do I remove an old screenshot setup?

You use the deletescreenshotconfig tool by passing the specific configuration ID. Your agent can find this ID by running the listing tool first.

Generate real-time visual previews of your web application directly inside Cursor using the PagePixels MCP Server.

See Vinkius in Action

Works with every AI agent you already use

…and any MCP-compatible client

MCP Servers — Included with Plan

Connect PagePixels MCP to Cursor

Create your Vinkius account to connect PagePixels to Cursor — we handle the hosting, security, and runtime updates so you don't have to. No server setup required.

GDPR Included with Plan

Setup PagePixels with Cursor

Ask AI about this MCP

ChatGPT

Claude

Perplexity Vinkius runs on Gemini

Gemini

Grok

Verify code changes with Cursor and PagePixels

The `quick_snap` tool gives your Cursor agent the ability to check how your live site looks after a deployment. You run the tool inside your active terminal or chat panel via the MCP link to get a visual confirmation of your latest code commit. When you need to test responsive breakpoints, your agent calls `quick_snap_with_options` to modify the rendering resolution. This puts real visual feedback directly into your coding environment, replacing manual browser checks.

Manage testing configurations from the editor

The `create_screenshot_config` tool lets you write persistent capture profiles directly from your codebase. Your agent reads these profiles using `list_screenshot_configs` to track which pages are currently being monitored for visual changes. If a design change requires new viewport settings, you can modify the profile with `update_screenshot_config`. This keeps your testing database synchronized with your actual code without leaving your workspace.

Render local code blocks instantly

The `snap_custom_html` tool takes raw code from your active file buffer and transforms it into a rendered image. You can test isolated components or experimental CSS layouts without deploying them to a staging server first. This workflow relies on sending the markup directly to the rendering engine. You instantly see how the browser interprets your code, helping you debug rendering bugs during active development.

Setup guide

Set up PagePixels MCP in Cursor

Prerequisites

Cursor installed (macOS, Windows, or Linux)
Active Vinkius subscription with a valid endpoint token

1

Open MCP Settings

Go to Cursor Settings → MCP or open the Command Palette (Cmd+Shift+P / Ctrl+Shift+P) and search for "MCP: Add Server".
2

Add the PagePixels MCP

Cursor will create or open .cursor/mcp.json in your project root. Paste the JSON snippet on the right. Replace [YOUR_TOKEN_HERE] with your endpoint token from cloud.vinkius.com.
3

Enable Agent mode

Open Composer (Cmd+I / Ctrl+I) and switch to Agent mode using the dropdown at the top. MCP tools are only available in Agent mode.
4

Verify the connection

Ask Cursor something like "List my recent PagePixels transactions." If the MCP tools are loaded correctly, Cursor will call the PagePixels tools automatically. You can also check Settings → MCP for a green status indicator.

.cursor/mcp.json

{
  "mcpServers": {
    "pagepixels-mcp": {
      "url": "https://edge.vinkius.com/[YOUR_TOKEN_HERE]/mcp"
    }
  }
}

Get your connection token →

Independent Platform Disclaimer: Vinkius is an independent platform and is not affiliated with, endorsed by, sponsored by, verified by, or otherwise authorized by PagePixels. All third-party trademarks, logos, and brand names are the property of their respective owners. Their use on this website is strictly for informational purposes to identify service compatibility and interoperability.

Why Choose Vinkius

Vinkius connects your tools to AI with real-time monitoring and automatic cost savings — all from one dashboard.

Connect PagePixels now

Real-time monitoring

Live

visibility into every interaction

Connect your favorite tools to your AI and see exactly what's happening — every request, every response, in real time.

Built-in savings

60%

lower AI costs

Vinkius compresses data between your apps and your AI automatically. Lower bills every month — no configuration required.

Single dashboard

One

place for every integration

Every tool your AI connects to, managed from a single screen. One account, complete control.

Common questions about PagePixels MCP in Cursor

Add the PagePixels MCP Server to your `.cursor/mcp.json` file in the root of your workspace. Once configured, your AI agent can immediately call the screenshot tools during your coding sessions.

Yes, your agent can call `quick_snap_with_options` with custom viewports to capture different screen sizes. This lets you inspect mobile, tablet, and desktop layouts side-by-side inside the editor.

No, the actual rendering happens on the PagePixels cloud infrastructure. Your Cursor editor communicates with the API via the MCP server to send the target parameters and receive the image link.

You use the `delete_screenshot_config` tool by passing the specific configuration ID. Your agent can find this ID by running the listing tool first.

Only the specific URLs and HTML blocks you target are sent to the PagePixels rendering engine. These payloads are transmitted securely and are never used to train models, ensuring your proprietary code remains confidential.

Use it with your favorite AI tools

Connect this server to Cursor, Claude, VS Code, and more.

OpenAI Agents SDK sdk-python

Google ADK sdk-python

Pydantic AI sdk-python

Vercel AI SDK sdk-typescript