React + Zod + MCP

Generative UI for AI Agents
That Run Locally

Schema-validated React components for LLM outputs. Works in Electron, React Native, and anywhere React runs. No Next.js required.

View on GitHub Documentation
# Install
bun add harness-ui

# Start MCP server
npx harness-ui-mcp

Client-Side vs Server-Side Rendering

Server-Side (Vercel AI SDK) RSC Only

Agent calls tool
    |
    v
Server executes render()
    |
    v
Streams RSC payload (~500+ bytes)
    |
    v
Client hydrates component

Requires: Next.js, network, server

Client-Side (harness-ui) Universal

Agent outputs JSON
    |
    v
{ component: "email_card", props }
    |
    v
Client validates + renders (~50 bytes)
    |
    v
React component from registry

Works: Electron, React Native, offline

Why harness-ui?

Schema Validation

Zod schemas validate LLM output before rendering. Malformed data gets rejected with actionable error messages.

MCP Auto-Discovery

Components auto-expose as MCP tools. LLMs discover available UIs without configuration.

Works Offline

Components are local code, not streamed from servers. Perfect for desktop and mobile agents.

Framework Agnostic

Not locked to Next.js. Works with Vite, Electron, React Native, or any React environment.

Action Handling

Components emit typed actions. Wire user interactions back to your agent seamlessly.

Premium Design

40+ production-ready components with macOS-native aesthetic. Ship beautiful UIs instantly.

Built For

Desktop Agents

Electron, Tauri apps with rich native UIs

Mobile Agents

React Native apps with agent interfaces

Offline-First

Local LLMs without network dependencies

Multi-Runtime

LangChain, Claude Code, custom agents

51+ Components

email_card
metric_card
chart_card
table_card
event_card
contact_card
video_player
places_map
input_form
rich_text_editor
twitter_thread
markdown_content
patient_card

Plus healthcare, legal, animation primitives, and more.