# Custom AI View [Health: Active]

**Category:** 💻 Developer Tools  
**Repository:** https://github.com/ccustomai/custom-ai-view  
**GitHub Stars:** 1  
**Views:** 0  
**Installs:** 0  
**Upvotes:** 0  
**Directory Page:** https://allmcps.com/mcp/custom-ai-view

## Description
See any site as it looks on a real iPhone, iPad or MacBook — and drive that window over MCP.

## Claude Desktop Quick Installation
Remote MCP endpoint (confidence: high). Install path detected from listing signals. Add as a URL/SSE server in your client:

```json
"mcpServers": {
  "custom-ai-view": {
    "url": "https://ccustom.ai/view"
  }
}
```

## Documentation & README

# Custom AI View

**See any website the way it looks on a real phone — and let an AI agent see it too.**

A real browser inside pixel-accurate device frames: iPhone, iPad, Android, MacBook.
Ships as a Windows app, a Mac app and a VS Code extension, with an MCP server so your
AI assistant looks at the same window you do, over the Model Context Protocol.

If you have ever wanted to *view a site as on mobile*, *preview responsive design on a
real device frame*, or *give an AI agent eyes on your own browser window* — that is
what this is.

[ccustom.ai/view](https://ccustom.ai/view) · by [Custom AI](https://ccustom.ai)

![An element picked on the phone, revealed in the code](https://raw.githubusercontent.com/ccustomai/custom-ai-view/HEAD/docs/inspect-element.png)

---

## Why this exists

Chrome's device toolbar resizes a viewport. It does not give you a phone, and it does
not give an agent anything to look at.

Custom AI View does three things nothing free does together:

- **It photographs the window you are actually looking at** — your login session, your
  scroll position, your unsaved input — and hands the picture to an AI agent over MCP.
  Not a re-render in a clean profile: the screen you can see.
- **It shows sites that refuse to be framed.** A local reverse proxy strips
  `X-Frame-Options` and CSP, rewrites `@media (hover)` and `env(safe-area-inset-*)`,
  renames `__Host-` cookies so logins survive, and terminates the self-signed TLS your
  dev server uses.
- **It is physically true.** Bodies, screens and corner radii come from published
  dimensions in millimetres; bezels are derived from body-minus-panel. *Actual size
  1:1* measures your monitor over EDID and draws the device at life size — hold a real
  iPhone against the glass and it matches.

## What an agent can do with it

```
custom_ai_view_open        open a URL on a given device
custom_ai_view_wait        wait for an element, or for loading to finish
custom_ai_view_screenshot  the live window — and it says so when it is not
custom_ai_view_find        elements by selector or visible text, with real visibility
custom_ai_view_click       tap something
custom_ai_view_type        type into a field, optionally submitting on Enter
custom_ai_view_key         Enter, Escape, Tab, arrows
custom_ai_view_scroll      the page, or one scroller inside it
custom_ai_view_inspect     markup, computed styles, box, ancestry
custom_ai_view_tree        walk the DOM a level at a time
custom_ai_view_edit        change the live page; survives reload; revert undoes it
custom_ai_view_console     page output *and* the browser's own messages, with ages
custom_ai_view_back        go back without losing SPA state
custom_ai_view_record      screen recording with no fixed length
custom_ai_view_record_clip a clip of fixed length, when the length is known
custom_ai_view_collect     screenshot + markup + console + selection, in one folder
custom_ai_view_state       what is open now: address, device, viewport, selection
custom_ai_view_set_device  change the device without losing the page
custom_ai_view_devices     the catalogue, with points, pixels and millimetres
custom_ai_view_reload      normal, hard, or clearing the cache first
custom_ai_view_edits       every live edit currently in force
custom_ai_view_revert      put one of them back, or all of them
custom_ai_view_library     what has been captured, filed by site
```

Every tool takes a `window` argument, so a phone and an iPad can be driven side by
side.

## Install

**Windows app** — download `CustomAIView.exe` from
[Releases](https://github.com/ccustomai/custom-ai-view/releases), run it, and pin it.
No dependencies; it needs Chrome or Edge installed. To put the branded shortcut on
your desktop: `node scripts/make-launcher.js`.

**Mac app** — download `CustomAIView-macos-arm64.zip` (Apple silicon) or
`-x64.zip` (Intel) from the same page, unzip it into `/Applications` and open it.
It needs Chrome or Edge installed. The bundle is signed ad-hoc rather than notarised,
so the first launch is right-click → **Open** — or, once:

```
xattr -dr com.apple.quarantine "/Applications/Custom AI View.app"
```

**VS Code extension** — download the `.vsix` from Releases and
`code --install-extension custom-ai-view-<version>.vsix`, then reload the window.

**For your AI assistant** — the server speaks MCP over stdio, so any MCP client takes
the same block:

```json
{
  "mcpServers": {
    "custom-ai-view": { "command": "node", "args": ["<path>/mcp/server.js"] }
  }
}
```

In VS Code, **Custom AI View: Show MCP Server Setup** hands you that block with the
path already filled in. The MCP server starts the app itself if it is not running, so
an agent never has to ask a human to open something first.

## Build from source

```
node scripts/build-exe.js       # dist/CustomAIView(.exe)  (Node SEA, ~82 MB)
node scripts/build-mac-app.js   # dist/Custom AI View.app + a zip   (macOS only)
node scripts/make-launcher.js   # desktop shortcut with the icon    (Windows only)
npm run package                 # the .vsix
```

The single executable is a copy of the node binary it was built with, so a Mac build
needs a Mac. `.github/workflows/release.yml` builds all three on a tag — Apple
silicon, Intel and Windows — and attaches them to the release.

![MacBook Pro 14-inch frame: black glass, the notch cut into the macOS menu bar, and the deck below the lid](https://raw.githubusercontent.com/ccustomai/custom-ai-view/HEAD/docs/macbook.png)

A MacBook lid is one sheet of black glass with a hairline of anodised edge, its chin
three times its forehead, and its notch cut **into** the menu bar — where a browser
window never reaches, so it is never a black rectangle over your site.

## What it looks like

![The start page, listing the dev servers found on this machine](https://raw.githubusercontent.com/ccustomai/custom-ai-view/HEAD/docs/start-page.png)

Dev servers are not guessed from a list of usual ports. The app asks the operating
system what is listening, then asks each port whether it serves pages — and shows the
site's own title and icon. The one on 8899 above is on no list of usual ports.

| | |
|---|---|
| ![iPhone 16 Pro frame showing a live site](https://raw.githubusercontent.com/ccustomai/custom-ai-view/HEAD/docs/iphone.png) | ![iPad Pro 11-inch frame showing the same site](https://raw.githubusercontent.com/ccustomai/custom-ai-view/HEAD/docs/ipad.png) |
| iPhone 16 Pro — 402 × 874 pt, @3x, 67 × 145 mm, safe area 62/34 | iPad Pro 11" (M4) — the same engine, the same proxy, the same session |

## Notable details

- **The home indicator floats over the page**, as on a real phone — nothing is carved
  out of the viewport. `env(safe-area-inset-bottom)` still reports 34.
- **A finger, not an arrow.** On phones and tablets the cursor is a 44 px circle: the
  contact patch a fingertip actually covers, which is what decides whether a control
  is reachable.
- **Momentum matches iOS** (0.967 per frame), horizontal strips drag, and text does not
  select while you swipe.
- **Captures are filed by site** under *Desktop → Custom AI View*, with `screenshots/`,
  `recordings/`, `logs/` and `code/`, plus a one-button "save everything about this
  page".
- **When a page leaves for another app** — `itms-appss://` and friends — the frame says
  so instead of going white.

## Licence

Proprietary. See [LICENSE](https://github.com/ccustomai/custom-ai-view/blob/HEAD/LICENSE). You may use it; you may not redistribute it,
fork it, rebrand it, or present any part of it as your own. "Custom AI",
"Custom AI View" and the C mark are trademarks of Custom AI.

For permission: contact@ccustom.ai

---

Read this in [Russian](https://github.com/ccustomai/custom-ai-view/blob/HEAD/README.ru.md) · © 2026 Custom AI · https://ccustom.ai

