Give your AI agent a canvas

AI that explains itself beautifully.
Hosted live. Nothing on your machine.

What changed in this PR?Walk me through the codebaseExplain this diff visually

Your agent answers with a live, hosted page — not a local file, not a wall of text. Diffs, diagrams, plans, dashboards you can actually open, share, and revisit.

claude_desktop_config.json
{
  "mcpServers": {
    "htmly": {
      "url": "https://html.shloksheth.tech/mcp"
    }
  }
}
Tool exposed: htmly
Works withClaude DesktopClaude CodeCursorVS CodeAny MCP client

In simple words

Your AI agent doesn't just describe changes — it builds a hosted page you can open in your browser. No local files, no clutter — just a live link with everything laid out visually.

Push-to-visualize

Your agent sends a bundle of HTML/CSS/JS through one tool - htmly - and gets back a live URL instantly.

Multi-file projects

Full project structures are supported: index.html, styles.css, app.js and more, written in parallel for speed.

Isolated workspaces

Every request gets its own cryptographically unique workspace, so previews never collide.

No local runtime

The renderer stays remote. Add the instruction skill and point your client at one URL - no server process or app package to run.

How it works

Three steps from connecting the server to a live page.

01

Connect Htmly

Add the MCP endpoint to your AI client using any of the methods above. Takes about a minute.

02

Ask for a visual

Tell your agent what you want to see — "show me this data as a dashboard" — and it writes the HTML.

03

Open the live link

Htmly hosts the result and hands your agent a real URL. Click it and the page is already live.

Step 1 · Add the judgment layer

Install the Htmly skill

A compact playbook that teaches your agent when HTML is the better answer—and how to turn plans, reviews, diagrams, comparisons, and reports into clear, interactive pages.

Recommended

Teach your agent when to go visual.

The MCP server hosts pages. The Htmly skill adds the judgment: when a live visual is more useful than another wall of Markdown, what format fits the work, and how to deliver it safely.

Implementation plansPR & design reviewsArchitecture mapsComparisonsDashboardsStructured reports
1

Paste this into Codex

Codex will install the skill from its public source. Restart Codex afterward so it appears in new tasks.

Codex prompt
Use $skill-installer to install https://github.com/shethshlok/htmly/tree/main/skills/htmly
Open Agent Skills format · MCP dependency includedInspect the skill source →

Step 2 · Connect the renderer

Add the MCP server your way

Same one-line endpoint, five different clients. Pick yours, copy the config, and you're connected.

Or just tell your agent:

“Add https://html.shloksheth.tech/mcp as an MCP server”

Open Settings → Developer → Edit Config, then add Htmly to your mcpServers and restart the app.

claude_desktop_config.json
{
  "mcpServers": {
    "htmly": {
      "url": "https://html.shloksheth.tech/mcp"
    }
  }
}

Frequently asked

MCP (Model Context Protocol) is an open standard that lets AI assistants use external tools. Htmly exposes one tool, htmly, which turns code your AI writes into a hosted web page.

Give your AI a place to render.

Copy the endpoint, drop it into your client, and your next prompt can come back as a live web page.

https://html.shloksheth.tech/mcp