# Build agent-powered interfaces

Docs, live demos, and code for every major agent framework. Find your integration and start building.

⌕

### 📖 Quickstart

Get running in 5 minutes with any framework

### 🔌 By Framework

LangGraph, Mastra, CrewAI, and 23 more

### 🎯 Live Demos

Try features hands-on before you build

### 📊 Feature Matrix

Compare 46 features across all integrations

LangGraph Mastra CrewAI PydanticAI Google ADK AWS Strands Claude SDK +19 more
46 features 26 integrations 575 doc pages 9 live demos

# Generative UI

Let your agent generate interactive React components on the fly. Tool-based, controlled, or fully agent-driven — choose the pattern that fits your use case.

▶ Try Live Demo

## Overview

Generative UI allows your agent to render custom React components in the chat. Instead of plain text responses, the agent can produce interactive charts, forms, cards, and any component you define.

There are three approaches, each suited to different use cases:

page.tsx

    import { useFrontendTool } from "@copilotkit/react-core/v2";
    import { z } from "zod";

    useFrontendTool({
      name: "render_chart",
      description: "Render a data visualization",
      parameters: z.object({
        data: z.array(z.object({ label: z.string(), value: z.number() })),
        type: z.enum(["bar", "pie", "line"]),
      }),
      handler: async ({ data, type }) => {
        // The agent calls this tool and the UI renders the chart
        return { rendered: true };
      },
    });

## Approaches

Tool-Based Generative UI — The agent calls a frontend tool that renders a component. Best for structured, predictable UI patterns like charts and forms. Try the demo →

Agentic Generative UI — The agent orchestrates long-running tasks and renders progress UI. Best for multi-step workflows. Try the demo →

Open Generative UI — The agent generates arbitrary HTML/components. Maximum flexibility, less control.

## API Reference

Key hooks: `useFrontendTool`, `useRenderTool`, `useComponent`. See full reference →

← Generative UI Guide Tool-Based Generative UI ● Live
💬

Live demo loads here via iframe

langgraph-python.onrender.com/demos/gen-ui-tool-based

← Back to Generative UI guide

# Feature Matrix

46 features across 26 integrations. Click any checkmark to try the live demo.

Integration | Chat | Gen UI | HITL | State | Streaming | Sub-Agents | MCP | Voice
--- | --- | --- | --- | --- | --- | --- | --- | ---
LangGraph (Python) Agent Framework | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | — | —
Mastra Agent Framework | ○ | ○ | ○ | — | — | — | — | —
Google ADK Enterprise | ○ | ○ | ○ | — | — | — | — | —
CrewAI Agent Framework | ○ | — | ○ | — | — | — | — | —

View