Xyle

Inspiration

Static websites are fast, simple, and cheap to run, but even a tiny content change often means going back to a developer. Xyle started as a human-first visual editor for existing static websites.

WebMCP opened up another possibility: instead of building a separate AI editor, an agent could safely operate the same editing system a person already uses.

What it does

Xyle lets people edit an existing website directly on the page.

With WebMCP, Xyle exposes those same editing capabilities to AI agents through structured tools. An agent can discover editable content, read its current value, update text or links, inspect the change history, and undo changes.

Human edits and agent edits share the same page state and history. There is no separate “AI version” of the website.

The agent also does not receive arbitrary DOM access. Xyle exposes only the editing operations it explicitly supports, while publishing remains a deliberate human action.

How we built it

Xyle has a shared editor core used by both its visual UI and its WebMCP integration.

The WebMCP layer is intentionally thin: tools registered through document.modelContext call the same editing operations used by the human interface rather than introducing a second editing system.

Xyle also keeps static files as the canonical published content. There is no separate content database. Unpublished edits live in the editing session, and publishing applies narrow changes back to the site's source files.

Challenges and what we learned

The hardest part was not simply making a webpage editable by an agent. It was making agent actions predictable, constrained, visible, and reversible while keeping humans and agents in sync.

That led to one of the main ideas behind Xyle's WebMCP implementation: WebMCP works particularly well as a capability layer over an existing application. The agent does not need a chatbot embedded in the product or unrestricted access to the page. It can use the product's existing tools directly.

What's next

The next step is expanding the set of safe editing capabilities while keeping the same shared-control model: agents can help make changes, but people can always see, review, undo, and decide what gets published.

Built With

• biome
• cloudflare
• node.js
• pages
• parse5
• playwright
• pnpm
• typescript
• vitest
• webmcp