How to Use the Microsoft Clarity MCP in Cursor

Q: Can Cursor write code fixes based on Microsoft Clarity rage clicks?

Yes, the editor agent runs listrageclicks to identify the broken UI elements. It then locates the corresponding source file on your machine and writes the patch.

Q: How does Cursor use Microsoft Clarity heatmaps to improve my CSS?

Your agent queries visual data using getheatmap to see where users actually click. It then reviews your local tailwind or CSS files to align your layouts with actual user behavior.

Fix front-end bugs instantly in Cursor by feeding live Microsoft Clarity user frustration data directly to your coding agent.

See Vinkius in Action

Works with every AI agent you already use

…and any MCP-compatible client

MCP Servers - Free for Subscribers

Connect Microsoft Clarity MCP to Cursor

Create your Vinkius account to connect Microsoft Clarity to Cursor and route execution through our secure gateway. The platform manages server hosting, runtime updates, and security layers. Configuration requires no manual server provisioning.

GDPR Free for Subscribers

Setup Microsoft Clarity with Cursor

Ask AI about this MCP

ChatGPT

Claude

Perplexity

Feed live Microsoft Clarity error logs into Cursor Agent

Coding in the dark ends today. By linking this MCP server to your Cursor environment, your coding agent pulls actual user struggle metrics directly into your active files. The agent uses `list_rage_clicks` to find where users are repeatedly slamming their mouse on broken buttons. Once it finds the hot spots, the agent reads your local React or HTML files. It writes the fix for the broken element using the exact context of the user's frustration.

Debug layout issues using scroll and click data

Stop guessing why users abandon your checkout flow. Your Cursor agent calls `get_scroll_depth` to see exactly where users lose interest on your live pages. It compares this depth data with your local CSS layouts to see if important buttons are pushed below the fold. If users are clicking dead space, the agent uses `list_dead_clicks` to find the bad selectors. It then patches your styles directly in the editor to make those areas interactive.

Verify your web project health inside the editor

You don't need to open a browser to check if your production site is running smoothly. This MCP Server lets your agent run `check_clarity_status` to verify your analytics pipeline is active. If you need a quick status report, the agent calls `get_dashboard` to pull down real-time session metrics. You get immediate confirmation that your latest deploy didn't break user tracking.

Setup guide

Set up Microsoft Clarity 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 Microsoft Clarity 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 Microsoft Clarity transactions." If the MCP tools are loaded correctly, Cursor will call the Microsoft Clarity tools automatically. You can also check Settings → MCP for a green status indicator.

.cursor/mcp.json

{
  "mcpServers": {
    "microsoft-clarity-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 Microsoft Clarity. 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 Microsoft Clarity 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 Microsoft Clarity MCP in Cursor

You configure it by adding the server details to your local configuration file in your project root. This lets the editor agent call the analytics tools during active coding sessions.

Yes, the editor agent runs `list_rage_clicks` to identify the broken UI elements. It then locates the corresponding source file on your machine and writes the patch.

Your agent queries visual data using `get_heatmap` to see where users actually click. It then reviews your local tailwind or CSS files to align your layouts with actual user behavior.

No, the MCP server connection runs through the Vinkius cloud proxy. Cursor connects directly to the hosted endpoint to fetch your analytics data.

Your project details and heatmap data are transmitted securely via HTTPS through Vinkius. Cursor only accesses the specific analytics endpoints you authorize, keeping your customer data private.

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