Skip to content
Conduit

mcp server

ClipACanvas

HTML to video renderer with Playwright backend

mechreaper007x/ClipACanvascommunitylistedunreviewednot running here yet
Use tool

Set up

Runs on your computer. Pick your agent and operating system.

Before you start

  • uv (`curl -LsSf https://astral.sh/uv/install.sh | sh`)
~/Library/Application Support/Claude/claude_desktop_config.json
{
  "mcpServers": {
    "clipacanvas": {
      "command": "uvx",
      "args": [
        "clipacanvas-mcp"
      ]
    }
  }
}

same format Cursor, GitHub Copilot CLI, Junie, JetBrains AI Assistant, Augment (Auggie CLI), Factory Droid, Kiro, Devin CLI +12

Values in angle brackets are placeholders. Restart Claude Desktop after editing its config.Claude Desktop docs

README

synced Oct 14, 2026

Clip.A.Canvas

Clip.A.Canvas transforms HTML/CSS/JS animations into MP4 videos — entirely local or hosted in the cloud. Powered by Chromium + FFmpeg for high-quality, browser-accurate rendering. Perfect for AI agents generating video content, demos, or visual explanations on-the-fly.

Clip.A.Canvas is a local and remote browser-motion-to-video toolkit.

It includes:

  • Desktop App: Paste, preview, and export animations locally with a pywebview UI.

  • MCP Server: Exposes HTML-to-video rendering tools to Antigravity, Gemini, Codex, Claude Code, and other AI clients.

  • Terminal UI (TUI): Keyboard-first command-line client for code-first rendering.

  • Website: https://clipacanvas.vercel.app

  • GitHub: https://github.com/mechreaper007x/ClipACanvas

  • Releases: https://github.com/mechreaper007x/ClipACanvas/releases/tag/v1.0.0

  • Cloud MCP (SSE): https://mechreaper007x-clip-a-canvas-mcp.hf.space/sse

🎬 MCP Server (Model Context Protocol)

Expose render_video and render_video_to_file tools to your AI assistant.

1. Cloud-Hosted (Zero Resource Usage)

We host a public instance of the MCP server on Hugging Face Spaces using Server-Sent Events (SSE). Point your client configuration directly to our cloud endpoint:

Claude Desktop Configuration (claude_desktop_config.json):

{
  "mcpServers": {
    "clipacanvas": {
      "url": "https://mechreaper007x-clip-a-canvas-mcp.hf.space/sse"
    }
  }
}

2. Local Execution (Standard PyPI)

If you prefer running the server locally on your machine:

# Run locally with uvx
uvx --from clipacanvas-mcp clipmcp

# Or install via pip
pip install clipacanvas-mcp

Claude Desktop Configuration for Local Server:

{
  "mcpServers": {
    "clipacanvas": {
      "command": "uvx",
      "args": ["--from", "clipacanvas-mcp", "clipmcp"]
    }
  }
}

💻 Terminal UI (TUI)

A keyboard-first CLI tool for local render pipelines.

Install from PyPI:

# Using pipx (recommended)
pipx install clipacanvas-tui

# Using uv
uv tool install clipacanvas-tui

Usage:

Run either command (clipacanvas-tui or clippp):

clipacanvas-tui --clipboard --preview
# or
clippp --clipboard --preview

🖥️ Desktop App

A visual UI for editing, previewing, and rendering HTML code to MP4.

Install Dependencies:

git clone https://github.com/mechreaper007x/ClipACanvas.git
cd ClipACanvas
pip install -r requirements.txt
pip install -r desktop_requirements.txt
npm install
python -m playwright install chromium

Run the App:

  • Windows: Run launch_desktop.bat or python desktop_app.py
  • macOS: Run ./launch_desktop.command

🏗️ Build Outputs & Packaged Releases

See build_desktop.py to package binaries:

  • Windows Portable EXE: python build_desktop.py -> dist/ClipACanvas.exe
  • Windows Installer: python build_installer.py -> dist/ClipACanvas-Setup.exe
  • macOS Bundle: python3 build_mac_app.py -> dist/ClipACanvas.app

📄 License

MIT

↑↓ navigate openesc close