Next AI Draw.io
draw.io diagrams your AI agent draws on a live browser canvas that you can also edit by hand
Description from the maker (original English)
MCP server for web inspection, design system extraction, and accessibility audits
We have not written a plain-language summary for this one yet. Below are the facts we read from the registry.
Pick the AI app you use, then copy the settings.
Passed 2/2 checks · Runs on your computer
First: which AI do you use?
Pick your app and the steps appear below.
Works with Claude, with some setup first
Install Node.js on your computer first (one time) · Only the Claude desktop app (Windows or Mac), not the web or phone
One time only; it works for every server that needs Node.js
SettingsDeveloperEdit Config
{
"mcpServers": {
"tapsite": {
"command": "npx",
"args": [
"-y",
"tapsite"
]
}
}
}Use Tapsite and tell me what you can do for me, then show me one thing✓ If Claude says it is using Tapsite or shows a Tapsite tool in the answer, you are connected
Menu names checked against Anthropic’s help page on Nov 11, 2026 · your screen may differ slightly by app version
ChatGPT cannot connect Tapsite yet
Tapsite runs on your computer, but ChatGPT can only connect servers that run on the web
A · Use an app that can connect Tapsite
B · Others in Design, images & audio that work with ChatGPT
Picked from the most used in the same category, only ones that connect by address with no key
Works with Claude Code, with some setup first
Install Node.js on your computer first (one time)
One time only; it works for every server that needs Node.js
Mac: press Command+Space and type Terminal · Windows: open PowerShell
claude mcp add tapsite -- npx -y tapsiteYou should see Tapsite listed as connected
Use Tapsite and tell me what you can do for me, then show me one thing✓ If Claude Code says it is using Tapsite or shows a Tapsite tool in the answer, you are connected
Menu names checked against Anthropic’s help page on Nov 11, 2026 · your screen may differ slightly by app version
Works with Cursor, with some setup first
Install Node.js on your computer first (one time)
One time only; it works for every server that needs Node.js
Use Tapsite and tell me what you can do for me, then show me one thing✓ If Cursor says it is using Tapsite or shows a Tapsite tool in the answer, you are connected
Menu names checked against Cursor’s help page on Nov 11, 2026 · your screen may differ slightly by app version
Works with VS Code, with some setup first
Install Node.js on your computer first (one time)
One time only; it works for every server that needs Node.js
Use Tapsite and tell me what you can do for me, then show me one thing✓ If VS Code says it is using Tapsite or shows a Tapsite tool in the answer, you are connected
Menu names checked against VS Code’s help page on Nov 11, 2026 · your screen may differ slightly by app version
Claude Code
claude mcp add tapsite -- npx -y tapsiteClaude Desktop (claude_desktop_config.json)
{
"mcpServers": {
"tapsite": {
"command": "npx",
"args": [
"-y",
"tapsite"
]
}
}
}Cursor (~/.cursor/mcp.json)
{
"mcpServers": {
"tapsite": {
"command": "npx",
"args": [
"-y",
"tapsite"
]
}
}
}VS Code (mcp.json)
{
"servers": {
"tapsite": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"tapsite"
]
}
}
}These settings are generated from the maker’s registry entry. If the README says otherwise, follow the README.
Based on how this server connects and on each app’s own docs, checked Nov 10, 2026.
Run on your computer in
ClaudeGooseLM StudioMsty StudioCherry StudioCursorVS Code + GitHub CopilotVisual StudioWindsurf (Devin Desktop)ZedKiroClineContinueJetBrains AI AssistantClaude CodeCodex CLIGemini CLIOpenCodenodecodeWarpLibreChatRaycast
Runs on your computer; the tool list appears in your AI app after you install it.
We check information anyone can see; we have not read the code. Checks that do not apply are left out of the count. · Checked Nov 12, 2026
The registry name was verified with the GitHub account mgriffen, which owns the repo
Code last changed 9 days ago
We have not read this repo from GitHub yet
This one runs on your computer; there is no internet endpoint
Runs on your computer and uses local settings instead
Runs on your computer; we can only read tool lists from internet endpoints
Ask, share a tip or report that it does not work. Sorted by what people marked helpful.
No posts yet. Be the first to ask or share.
Posts here are written by users, not the PopNx team.
No reviews yet
Compared with every active server in this category in the registry. Stars count only when the publisher owns the repo.
It passed 2 of 2 applicable basic checks. We have not read the code. Before adding a key or token, see what access the server asks for and use a key with only the permissions you need.
The registry does not list a required key, though some servers ask you to sign in on first use.
It runs on your computer. Your AI app starts it when needed, and data does not pass through the maker’s servers (unless it calls an online service itself).
The GitHub repo last changed 9 days ago, and the latest version (4.0.1) reached the registry 8 months ago.
Apps that support MCP, such as Claude Desktop, Claude Code, Cursor and VS Code. You also need Node.js on your computer.
In the same category: Next AI Draw.io, Pascal 3D Editor, screenpipe
Servers in the same category from other makers, sorted by stars.
Reading a card:↓ Downloads per weeki★ GitHub starsiThree pillars: reviews · checks · usageiUpdated = latest version published to the registryi
draw.io diagrams your AI agent draws on a live browser canvas that you can also edit by hand
Create, inspect, validate, and save editable 3D building scenes with Pascal's MCP server.
Search your local screen recordings, audio transcripts, and computer activity from screenpipe.
Copied from the maker’s repo as written. PopNx MCP has not reviewed or endorsed it. HTML, images and scripts are removed. Links lead off this site.
The MCP server for web intelligence extraction. 55 tools that give AI agents the ability to *understand* websites — not just drive a browser, but extract structured intelligence about design systems, accessibility, performance, content, and more.
Other MCP browser tools let agents click buttons. tapsite lets agents extract a complete color palette, audit WCAG contrast ratios, diff two sites' design tokens, detect tech stacks, or pull structured data with custom CSS/XPath/regex selectors — all as structured JSON that agents can reason about.
55 Tools · 11 Categories · 4 Workflows · Multi-Format Export
Works with Claude, Cursor, Windsurf, and any MCP-compatible AI agent. LangChain/LangGraph integration coming soon.
[View the full docs site →](https://mgriffen.github.io/tapsite/)
# Quick start (no install required)
npx -y tapsite
npm install -g tapsite npx playwright install chromium npx playwright install-deps chromium
Add to your AI agent's MCP config:
{
"mcpServers": { "tapsite": { "command": "npx", "args": ["-y", "tapsite"] } } }
First run: Playwright will install Chromium automatically if not already present (~150MB one-time download).
Also available on the MCP Registry and Glama.
| Other browser MCPs | tapsite |
|---|---|
| Click buttons | Extract full design systems |
| Fill forms | Audit WCAG accessibility |
| Take screenshots | Diff sites over time |
| Read raw HTML | Detect tech stacks & APIs |
| Custom CSS / XPath / regex extraction | |
| Anti-bot resilience & proxy rotation |
Extract design systems — colors, fonts, spacing scales, breakpoints, components, shadows, icons, CSS variables, and contrast ratios from any website. Output as structured JSON or W3C design tokens.
Audit quality — accessibility scoring with WCAG contrast analysis, performance timing (Core Web Vitals), tech stack detection, dark mode support, and animation inventory.
Compare and track — diff two sites side by side, or track a single site over time with snapshot-based temporal diffs. Regressions and improvements are flagged automatically. Disk caching means crawls resume where they left off, and results are reused across sessions.
Work behind login walls — persistent browser sessions with full MFA support. A 3-tier anti-bot escalation system handles protected sites automatically — from stealth scripts to proxy rotation. Log in once manually, then extract across tool calls without re-authenticating. Credentials never enter the chat.
| Tool | Description |
|---|---|
tapsite_login_manual | Open headed browser for manual login + MFA |
tapsite_login_check | Verify authenticated session state |
tapsite_inspect | Navigate to URL and inspect the DOM (nav, headings, buttons, forms, tables, links) |
tapsite_screenshot | Take a screenshot of the current page |
tapsite_interact | Click or fill an indexed element from the last inspect |
tapsite_scroll | Scroll the page |
tapsite_run_js | Execute arbitrary JavaScript and return the result |
tapsite_close | Close the browser session |
| Tool | Description |
|---|---|
tapsite_extract_table | Extract a specific table as structured data |
tapsite_extract_links | Extract all links with text and href |
tapsite_extract_metadata | Extract page metadata (title, description, OG tags, etc.) |
tapsite_extract_content | Extract main readable content (article body, headings, paragraphs) |
tapsite_extract_forms | Extract all forms with fields, labels, and actions |
tapsite_extract_markdown | Extract page content as clean Markdown (raw, fit, or citations mode) with optional chunking |
| Tool | Description |
|---|---|
tapsite_extract_custom | Extract structured data using custom schemas (CSS selectors, XPath, or regex) |
tapsite_extract_schema_suggest | Analyze page DOM and auto-suggest extraction schemas |
| Tool | Description |
|---|---|
tapsite_extract_colors | Extract color palette (hex values + usage counts) |
tapsite_extract_fonts | Extract font families, sizes, weights |
tapsite_extract_css_vars | Extract CSS custom properties |
tapsite_extract_spacing | Extract spacing scale values |
tapsite_extract_shadows | Extract box-shadow and text-shadow patterns |
| Tool | Description |
|---|---|
tapsite_extract_images | Extract all images with src, alt, dimensions |
tapsite_download_images | Download images to local output directory |
tapsite_extract_svgs | Extract inline SVGs |
tapsite_extract_favicon | Extract favicon URLs and sizes |
| Tool | Description |
|---|---|
tapsite_extract_layout | Extract layout tree (inline text representation) |
tapsite_extract_components | Detect repeated UI components and patterns |
tapsite_extract_breakpoints | Extract responsive breakpoints from CSS media queries |
| Tool | Description |
|---|---|
tapsite_extract_a11y | Accessibility audit (ARIA, roles, contrast issues) |
tapsite_extract_contrast | Audit WCAG contrast ratios between text and background |
tapsite_extract_perf | Extract performance metrics (Core Web Vitals, resource sizes) |
tapsite_extract_security | Audit security headers (CSP, HSTS, SRI, permissions policy) |
tapsite_extract_darkmode | Detect dark mode support and extract dark palette |
tapsite_extract_pwa | Detect PWA support (manifest, service worker, installability) |
tapsite_extract_i18n | Extract internationalization signals (lang, hreflang, translations) |
| Tool | Description |
|---|---|
tapsite_extract_stack | Detect frontend framework, libraries, and tech stack |
tapsite_extract_animations | Extract CSS animations and transitions |
tapsite_extract_icons | Detect icon libraries and extract icon usage |
tapsite_extract_graphql | Detect GraphQL endpoints and introspect schemas |
tapsite_extract_aiml | Detect AI/ML integrations (models, embeddings, inference endpoints) |
tapsite_extract_canvas | Extract canvas and WebGL usage patterns |
tapsite_extract_wasm | Detect WebAssembly modules and usage |
tapsite_extract_web_components | Detect custom elements and shadow DOM usage |
tapsite_extract_third_party | Inventory third-party scripts, trackers, and services |
tapsite_extract_storage | Audit client-side storage (cookies, localStorage, sessionStorage, IndexedDB) |
| Tool | Description |
|---|---|
tapsite_capture_network | Capture network requests during a page load |
tapsite_extract_api_schema | Infer API schema from observed network traffic |
| Tool | Description |
|---|---|
tapsite_crawl | Crawl multiple pages from a start URL |
tapsite_diff_pages | Compare two URLs (cross-site) or track changes over time (temporal) using real extractors |
| Tool | Description |
|---|---|
tapsite_export | Export inspection results as JSON + Markdown + HTML report + CSV tables + screenshots |
tapsite_export_design_report | Full design system report: report.html (visual), design-tokens.json (W3C format), design-tokens.css (copy-pasteable :root vars) |
Resilient extraction engine. Parallel browser pooling for concurrent page extraction. Persistent disk caching — crawls resume where they left off and results are reused across sessions. 3-tier anti-bot escalation with automatic proxy rotation for protected sites.
| Tool | Description |
|---|---|
tapsite_teardown | Comprehensive competitive design teardown (all extractors) |
tapsite_audit | Pre-launch quality audit (a11y, contrast, perf, SEO, darkmode) |
tapsite_harvest | Inventory all site assets (images, SVGs, forms, fonts, links) |
tapsite_designsystem | Extract design tokens as W3C JSON and CSS variables |
Native LangChain and LangGraph integration is on the roadmap. When released, it will provide a dedicated Python wrapper with tool subsets and managed session lifecycle.
Prompt injection defense (hidden element filtering + output sanitization), HTTPS enforced, private IPs blocked, auth headers redacted. Credentials never enter the chat — log in manually with full MFA support.
Extractors skip hidden elements (display:none, visibility:hidden, opacity:0, zero-size, clip-hidden) to prevent invisible text injection. All output is scanned for prompt injection patterns — instruction overrides, role hijacking, exfiltration attempts, and tool manipulation are flagged inline as [INJECTION_DETECTED].
Never pass credentials through the chat. Use tapsite_login_manual to open a headed browser, log in manually (including MFA), then tapsite_login_check to confirm. Credentials never touch the AI provider's servers or local transcripts.
tapsite ships a Dockerfile and docker-compose.yml for headless-only use — CI pipelines, server deployments, or anywhere you don't want a local Node.js install.
docker build -t tapsite .
docker compose up
tapsite_login_manual is not available in Docker (it requires a display). To use authenticated sessions in Docker, log in locally first, then mount the profiles/ directory into the container:
volumes:
Security note:
profiles/contains live session cookies. Don't commit it to version control (it's already in.gitignore).
git clone https://github.com/mgriffen/tapsite
cd tapsite npm install npx playwright install chromium npx playwright install-deps chromium
MCP config pointing to local source:
{
"mcpServers": { "tapsite": { "command": "node", "args": ["/absolute/path/to/tapsite/src/server.js"] } } }
src/
server.js — MCP server entry point browser.js — shared Chromium context (ensureBrowser, closeBrowser) helpers.js — shared helpers (safeNavigate, summarizeResult, indexPage) sanitizer.js — prompt injection detection diff.js — per-extractor diff logic and extractor name/args mapping snapshots.js — temporal snapshot I/O (saveSnapshot, loadLatestSnapshot) browser-pool.js — parallel browser context pooling cache.js — persistent disk caching with TTL markdown.js — HTML-to-Markdown converter (raw/fit/citations) chunker.js — LLM-friendly text chunking (fixed/semantic/sentence) content-filter.js — BM25 relevance filtering anti-bot.js — block detection and tier escalation proxy.js — proxy rotation with failure tracking stealth-setup.js — Puppeteer-extra stealth plugin registration extraction-strategies.js — CSS/XPath/regex flexible extrac