Generative UI project showcase with full source code
Anmol Baranwal rounds up impressive open-source Generative UI projects — from a Claude-inspired HTML visualizer to a macOS terminal agent with native Swift widgets — each shipping complete source code and live demos.
Score breakdown
Developers building agentic applications can use these fully open-sourced projects as production-ready starting points for streaming interactive UI components directly inside chat, bypassing the need to pre-build every screen.
- 01OpenGenerativeUI is an open-source generative UI agent using LangGraph Deep Agents that streams live HTML into a sandboxed iframe and ships a standalone MCP server for Claude Desktop and Cursor.
- 02Pi Generative UI reverse-engineered Claude's generative UI from exported JSON conversations and tool call payloads, rebuilding it for a macOS terminal agent.
- 03Pi's native macOS widgets open in under 50ms via a Swift binary called `Glimpse` wrapping a `WKWebView`, with no Electron dependency.
Anmol Baranwal's Dev.to post presents five open-source Generative UI projects, each demonstrating a different pattern for agents that return interactive components instead of plain text. The central premise is that chat alone is insufficient for complex tasks — a flight-booking agent, for instance, should surface a bookable UI, not a paragraph of text. The article frames four distinct patterns for how much control an agent should have over the interface it generates.
The standout project, OpenGenerativeUI, is described as an open-source equivalent of Claude's chat visualization feature.
The standout project, OpenGenerativeUI, is described as an open-source equivalent of Claude's chat visualization feature. It uses LangGraph Deep Agents to decide whether a given prompt calls for a flowchart, a 3D WebGL animation, a math plotter, or plain text, then streams the result as live HTML inside a sandboxed iframe. It also ships a standalone MCP server compatible with Claude Desktop and Cursor. Shadify, built by the CopilotKit team in four hours, takes natural-language UI descriptions and streams back real ShadCN components using CopilotKit, Hashbrown, LangGraph, and Tavily for web search.
Pi Generative UI took a more forensic approach — its author reverse-engineered Claude's generative UI by exporting conversations as JSON and extracting design guidelines from tool call payloads, then rebuilt the system for a macOS terminal coding agent called `pi`. Interactive widgets open in a native macOS window via a small Swift binary called `Glimpse` wrapping a `WKWebView`, updating token by token through `morphdom` diffing, with widgets able to send data back to the agent via `window.glimpse.send()`. Chart.js, D3, and Three.js are available via CDN. The remaining two projects — Open MCP Apps Builder (using a Mastra agent and E2B sandbox) and Excalidraw Studio (built on a modified Excalidraw MCP server with persistent workspaces and five diagram modes) — further illustrate how Generative UI is expanding beyond chat into full interactive tooling environments.
Key facts
- 01OpenGenerativeUI is an open-source generative UI agent using LangGraph Deep Agents that streams live HTML into a sandboxed iframe and ships a standalone MCP server for Claude Desktop and Cursor.
- 02Pi Generative UI reverse-engineered Claude's generative UI from exported JSON conversations and tool call payloads, rebuilding it for a macOS terminal agent.
- 03Pi's native macOS widgets open in under 50ms via a Swift binary called `Glimpse` wrapping a `WKWebView`, with no Electron dependency.
- 04Widgets in Pi Generative UI update token by token via `morphdom` diffing and can send data back to the agent using `window.glimpse.send()`.