How it works Features Pricing FAQ Docs Add to Chrome — Free
HAVI + ❯ GitHub Copilot

HAVI works alongside GitHub Copilot.

GitHub Copilot reads your code. HAVI captures what's in your browser: screenshots, the exact selector you clicked, console errors, and failed requests. Your GitHub Copilot session pulls them in via MCP.

Add to Chrome — Free Compare features
The gap

GitHub Copilot reads your code. HAVI shows it the browser.

Your agent has your code but not the rendered page. Here's what each side gives it.

❯ GitHub Copilot alone
  • ✓ Full codebase & file context
  • ✓ Inline edits and chat in the editor
  • ✕ No screenshot of the rendered page
  • ✕ No CSS selector for the broken element
  • ✕ Console errors lost on app-switch
With HAVI added
  • ✓ Screenshot of the bug — full page or region
  • ✓ Exact CSS selector you clicked
  • ✓ Console errors & failed requests
  • ✓ URL, viewport & DPR for the breakpoint
  • ✓ Pulled in over MCP — no copy-paste
Side by side

Feature comparison

Capability GitHub Copilot HAVI
Screenshot pulled into the session via MCP Manual paste ✓ Automatic
Exact CSS selector of the element ✕ ✓
Console errors captured automatically ✕ ✓
Failed network requests attached ✕ ✓
Viewport & DPR context ✕ ✓
Works inside your editor ✓ Native ✓ Via MCP
W3C Web Annotation, exportable ✕ ✓
EU-hosted, GDPR-compliant — ✓

Not an either/or. HAVI speaks MCP, so it plugs into GitHub Copilot the same way it plugs into Claude Code. Keep your editor; HAVI adds the browser context.

Setup

Add HAVI to GitHub Copilot in two steps.

  1. Install the Chrome extension
    Free tier, magic-link sign-in, no card. Hosted — no binary or daemon.
  2. Add the MCP server
    Point your MCP config at https://havi.handgemacht.ai/api/mcp with your setup code, and capture away.

Keep GitHub Copilot. Add browser context.

Install the extension, connect over MCP, and start capturing browser context for your agent.

Add to Chrome — Free Read the docs