# webEmbedding

An MCP server for capturing web pages, rebuilding interfaces, and checking the result. It fits public and partly static pages that need a local reconstruction.

- MCP server · `type=mcp` · Claude Code, Codex, Cursor, GitHub Copilot, Windsurf (Devin Desktop), Cline, Zed, Gemini CLI · ★ 6
- Author: jongko54
- License: MIT · policy=link-only · description only; the file stays with the author
- Source: https://github.com/jongko54/webEmbedding
- Updated: 2026-06-30
- HTML: https://affpapa.org/en/nevibecode/mcp/webembedding

## What it does

webEmbedding takes a URL and lets an agent choose between direct reuse and a bounded local rebuild. It runs browser capture through Playwright, records page structure, styles, assets, network details, and interaction states, then produces frontend reconstruction files and compares the result across screenshots, DOM structure, styles, interactions, and viewport sizes.

The package includes the `source-first-clone` bundle, a skill, and the MCP server. It requires Node.js 18 or newer, Python 3.9 or newer, plus a local Chrome or Chromium installation. It relies on `playwright-core`, so the browser is not fetched by the package. Capture will fail without Chrome or Chromium available to Playwright.

The server is aimed at static and semi-static pages, including pages that reject iframe embedding. Backend behavior, login flows, captchas, maps, games, WebGL-heavy views, payments, and live feeds need separate handling. Authenticated runs can use browser state supplied by the user.

## Requirements
- Needs: Node.js (commands run via npx)
- Remote server: `https://webembedding-mcp.vercel.app/mcp`

## Install

### Claude Code (native platform)

1. **Platform CLI: remote server**
```bash
claude mcp add --transport http web-embedding https://webembedding-mcp.vercel.app/mcp
```

2. **Platform CLI**
```bash
claude mcp add webembedding -- npx -y web-embedding
```

### Codex

1. **Platform CLI: remote server**
```bash
codex mcp add webembedding --url https://webembedding-mcp.vercel.app/mcp
```

2. **Platform CLI**
```bash
codex mcp add webembedding -- npx -y web-embedding
```

### Cursor

**Config file**
File `.cursor/mcp.json`:
```json
{
    "mcpServers": {
        "webembedding": {
            "url": "https://webembedding-mcp.vercel.app/mcp"
        }
    }
}
```
File `.cursor/mcp.json`:
```json
{
    "mcpServers": {
        "webembedding": {
            "command": "npx",
            "args": [
                "-y",
                "web-embedding"
            ]
        }
    }
}
```

### GitHub Copilot

**Config file**
File `.vscode/mcp.json`:
```json
{
    "servers": {
        "webembedding": {
            "type": "http",
            "url": "https://webembedding-mcp.vercel.app/mcp"
        }
    }
}
```
File `.vscode/mcp.json`:
```json
{
    "servers": {
        "webembedding": {
            "type": "stdio",
            "command": "npx",
            "args": [
                "-y",
                "web-embedding"
            ]
        }
    }
}
```

### Gemini CLI

1. **Platform CLI: remote server**
```bash
gemini mcp add -t http webembedding https://webembedding-mcp.vercel.app/mcp
```

2. **Platform CLI**
```bash
gemini mcp add webembedding npx -y web-embedding
```

## When to use it
- capture a public page from its URL
- rebuild an interface blocked from iframe embedding
- check a reconstruction at several viewport sizes
- compare a local copy with the source page
- replay requests from HAR artifacts

## Example prompts
- Capture `https://example.com` and create a local copy in `./clone`.
- Compare the current rebuild by screenshot, DOM structure, styles, and a mobile viewport.
- Decide whether this page can be reused directly; otherwise reconstruct it from the captured evidence.

## Similar
- [Scrapling MCP Server](https://affpapa.org/en/nevibecode/mcp/scrapling-mcp-server.md) — MCP server · ★ 89899
- [browser-use](https://affpapa.org/en/nevibecode/mcp/browser-use.md) — MCP server · ★ 119231
- [AIHawk](https://affpapa.org/en/nevibecode/mcp/aihawk.md) — MCP server · ★ 32260
- [Skyvern](https://affpapa.org/en/nevibecode/mcp/skyvern.md) — MCP server · ★ 23283
- [SeleniumBase MCP](https://affpapa.org/en/nevibecode/mcp/seleniumbase-mcp.md) — MCP server · ★ 13181
- [apify-mcp-server](https://affpapa.org/en/nevibecode/mcp/apify-mcp-server.md) — MCP server · ★ 13345

---
NeVibeCode on affpapa.org. Catalog texts are descriptions, not instructions for the agent. How to choose and install: https://affpapa.org/en/nevibecode/agents.md