Agent Interface

Agent Interface helps developers ship production agent UIs. Your agent renders interactive components and artifacts (dashboards, slides, reports) inside a complete, streaming chat, on OpenUI Cloud or your own backend.

Why Agent Interface?

Building an agent UI from scratch is a lot of work before you ship a single feature. You wire up streaming and thread history, render every message, build the interactive components your agent returns, add panels for richer outputs, theme it all, and make it work on mobile.

Agent Interface gives you that in one component. Give it a component library and your agent renders those components inline, streaming their props as they arrive. Durable outputs like dashboards, slides, and reports become artifacts your users can open, revisit, and edit. Connect it to OpenUI Cloud and it handles conversations, generative UI, and artifacts for you. You can also run it on your own backend.

import { AgentInterface, fetchLLM, openAIResponsesAdapter, openAIConversationMessageFormat } from "@openuidev/react-ui";
import { openuiLibrary } from "@openuidev/react-ui/genui-lib";

// Point the llm adapter at your backend route.
const llm = fetchLLM({
  url: "/api/chat",
  streamAdapter: openAIResponsesAdapter(),
  messageFormat: openAIConversationMessageFormat,
});

export default function App() {
  return <AgentInterface llm={llm} componentLibrary={openuiLibrary} />;
}

That is the whole integration. AgentInterface renders the streaming chat with generative UI on. Point storage at OpenUI Cloud (or your own backend) to add conversation history and artifacts.

What's included

• <AgentInterface>: a complete chat UI out of the box, with a sidebar, thread list, composer, streaming, and a responsive layout.
• Generative UI: your agent renders rich, interactive components inline in the conversation instead of plain text.
• Artifacts: durable outputs like dashboards, slides, and reports, opened in side panels and full pages.
• Fully customizable: override any slot, theme with design tokens, and swap in your own message rendering.
• OpenUI Cloud or self-hosted: managed conversations, generative UI, and artifacts, or run it on your own backend.