Integrate InterfaceGuard into Any Workflow

One API. Every surface. Use the VS Code extension, Chrome extension, standalone MCP server, or the hosted connector for Lovable.dev and Bolt.new.

VS Code Extension

Analyze interfaces without leaving your editor.

The InterfaceGuard VS Code extension brings screenshot capture and UX analysis directly into your editor. Trigger reviews from the Command Palette, track jobs in the Activity Bar, and browse interactive results — all without switching windows.

  • Capture screenshots via Playwright at desktop, tablet, and mobile viewports
  • Submit and track analysis jobs from the Command Palette or Activity Bar
  • Interactive results panel with severity filtering and code snippet recommendations
  • Secure API key storage via VS Code SecretStorage
  • Configurable via built-in commands or VS Code settings

Chrome Extension

One-click UX review from any browser tab.

The InterfaceGuard Chrome extension lets you analyze any web page from the browser side panel. No external server required — screenshots are captured directly via the Chrome DevTools Protocol. Analysis jobs run in the background so you can keep browsing.

  • No external server — screenshots captured via Chrome DevTools Protocol
  • Side panel UI with Capture → Analyze → Results → History tabs
  • Background job polling with badge notifications when analysis completes
  • Copy fix prompts, enhance with AI, and mark issues resolved
  • API URL syncs across Chrome profiles; API key stored locally on device

MCP Server

Native UX analysis inside Claude Code, Cursor, and Windsurf.

The InterfaceGuard MCP server connects your AI coding assistant directly to the UX analysis pipeline. Configure it once and Claude Code, Cursor, or Windsurf can capture screenshots, submit analysis jobs, surface issues, and generate fix prompts — all within a single conversation.

  • Works with Claude Code, Cursor, Windsurf, and any MCP-compatible tool
  • Headless Chromium capture built in — no browser configuration needed
  • 8 MCP tools covering capture, analysis, result fetching, and issue resolution
  • Claude Code skill (SKILL.md) for guided, best-practice agent workflows
  • AI-generated coding fix prompts ready to paste as tasks

Lovable.dev

Let Lovable's AI agent analyze and fix your UI.

The InterfaceGuard Lovable connector lets Lovable's AI agent run a full UX review without leaving the builder. Add it as a custom connector, then ask the AI to analyze your live preview URL — it captures a screenshot, submits the job, waits for results, and proposes code edits automatically.

  • Add InterfaceGuard as a Lovable connector — no local install needed
  • Point Lovable's AI at any live preview URL for instant UX analysis
  • Findings returned as prioritized issues with AI-generated fix prompts
  • The AI acts on results immediately — edits code, re-runs analysis
  • Works with Lovable's built-in preview URL for every project

Bolt.new

UX analysis inside Bolt.new via Claude Code.

The InterfaceGuard HTTP MCP server integrates directly with Bolt.new's Claude Code assistant. Add one config block to your project, then ask Claude to analyze your app's preview URL — screenshot capture runs server-side, so there's nothing extra to install.

  • Add InterfaceGuard as an HTTP MCP server in your Bolt.new project
  • Ask Claude to analyze your app's live preview URL in one message
  • No Chromium to install — screenshot capture runs server-side
  • Critical, high, medium, and low severity issues with code-ready fixes
  • Works alongside any other Claude Code MCP server in your project

Ready to get started?

Create a free account to get your API key, then pick the integration that works best for you.