HAVI + Codeium

HAVI works alongside Codeium.

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

The gap

Codeium 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.

Codeium 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 Codeium 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 Codeium the same way it plugs into Claude Code. Keep your editor; HAVI adds the browser context.

Setup

Add HAVI to Codeium 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 Codeium. Add browser context.

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