Skip to content
IndexDesign corpus
Agent Design ToolingAI ToolMCP ServerAppAGPLFreemiumReact

Loora

Canvas design tool with a remote MCP server your coding agent edits live

Aboutloora.design

An infinite-canvas design tool by lassejlv where pages, components and tokens are stored as structured nodes, and every edit — yours or an agent's — goes through the same validated, undoable, conflict-aware transaction. It runs a remote MCP server at https://mcp.loora.design/mcp over streamable HTTP with OAuth 2.1 (PKCE, dynamic client registration, no API key), and exposes roughly 30 typed tools grouped as Read (listDesigns, getDesignContext, readNode, readTree, searchNodes, listAssets, listVersions), Write (createPage, insertNodes, patchNodes, moveNodes, deleteNodes), Reuse (createComponent, createInstance, setTokens), Motion (setAnimations, animateNodes), Look (viewCanvas, viewPage, viewNode, getScreenshot), Branches (listBranches, createBranch, proposeBranch, compareBranch, applyBranch, reopenBranch, closeBranch) and Designs (createDesign, renameDesign, deleteDesign, exportCode). Designs have git-style branches and version history; export is one-way to HTML/CSS, React TSX, plain JSX, Tailwind utilities, raw JSON or PNG. There is no built-in chat agent — you bring Claude Code, the Claude app, Codex, Cursor, VS Code Copilot, opencode, Windsurf, Cline, Zed, Gemini CLI, Goose or Warp.

Install
npx skills add https://github.com/lassejlv/loora/tree/main/skills/loora-design-guide
For an agent

Add the endpoint once, then work the documented order: listDesigns → getDesignContext → setTokens before you draw anything → createPage and insertNodes → patchNodes to refine → getScreenshot to actually look at what you made → exportCode. Install the loora-design-guide skill alongside the server, because the tools tell you what you can do and not how to design. Two traps: a 401 means the OAuth token lapsed, so re-run the client's login step rather than editing config, and export is one-way — code you change afterwards never returns to the canvas, so branch inside Loora for anything speculative instead of regenerating.

Why it is here. It answers the real complaint about prompting an agent for React — regenerated files have no stable identity for their parts — by giving both you and the agent addressable nodes in one document, with branches and history around it.

Install command, framework, licence and component list.
Notable for
  • Remote MCP server, OAuth 2.1, no API key
  • About 30 typed canvas tools including getScreenshot
  • Branches, merge and version history on designs
  • Exports HTML, React TSX, JSX, Tailwind, JSON, PNG
  • AGPL-3.0 source, self-hostable
  • Ships its own design-guide agent skill
Provenance

Verified 2026-08-15. HTTP 200. https://loora.design/ (WebFetch + raw HTML via curl), https://loora.design/mcp (raw HTML, full tool list), https://github.com/lassejlv/loora. docs.loora.design does not resolve.

Related resourcesAgent Design Tooling