What Is Agentic UI?

Agentic UI, a new interface paradigm for AI agents, must show progress, tool use, direction, and control, according to a developer's guide. The guide lists seven UI styles, including chat, copilot, canvas, dashboard, collaborative, workflow, and terminal interfaces, and names ChatGPT, VS Code Copilot, Claude Artifacts, Grafana, Cumora, ComfyUI, Claude Code, Cursor, Codex, and Aider as examples. It also details 15 UI components and highlights Vercel's AI SDK as a leading framework for building such interfaces.

What Is Agentic UI? You already know ChatGPT’s style, but it moved away from the old chat interface some time ago. A chat interface works like ping-pong: one message bubble, then another. Agentic UI does not work that way, because it often runs a long process behind the scenes. Between your prompt and the agent’s reply, many details happen. The interface must show you these details. Here is what I believe agentic UI must give you: Progress. Show you where the agent stands in the task, not just that it is working. Tool use. Show you which tools ran and what input each one used. Direction. Show you if the reasoning is still on track. Control. If it is not on track, let you stop, redirect, or undo the action. UI styles Here lists a few agentic UI styles. Chat interface. Chat bubbles, streaming responses, expandable tool-call sections, and “thinking” indicators. Example: ChatGPT https://chatgpt.com . Copilot interface. A sidebar you can show or hide, instead of a full conversational app — a good fit as you evolve an app from non-agentic to agentic. Example: VS Code https://github.com/microsoft/vscode Copilot. Canvas interface. Chat on one side, a canvas or file explorer on the other. Must persist artifacts, support versioning, and let you edit them. Examples: ChatGPT Canvas https://chatgpt.com , Claude Artifacts https://claude.ai . Dashboard interface. Built for observability — real-time status, resource usage, queue status, warnings — so you can monitor and steer long-running agents. You can start by building a Grafana https://github.com/grafana/grafana dashboard. Collaborative interface. A chat variant that treats humans and agents as peers, with collaborator badges and multiple roles in one thread. Example: Cumora https://github.com/yetone/cumora . Workflow interface. Node-based graphs, common in creative tools. Example: ComfyUI https://github.com/Comfy-Org/ComfyUI . Terminal interface TUI . Runs fully in the terminal, common for coding agents. Examples: Claude Code https://claude.com/claude-code , Cursor https://cursor.com , Codex https://github.com/openai/codex , Aider https://github.com/Aider-AI/aider . UI components Regardless of style, most agentic UIs draw from the same set of primitive components: Agent status indicator. Shows the agent’s current state, such as Thinking, Searching, Coding, or Waiting. Streaming response. Exposes output incrementally as it’s generated. Reasoning display. A dedicated area for the model’s reasoning, like <think ...</think output. Tool use visualization. Shows which tool ran and what input it used. Approval gate. Pauses for human approval before a risky action runs — human-in-the-loop control. Scheduled-task card. Asks whether to create a background task that tracks an event. Compaction. Shown when the conversation nears the context window’s limit. Completion. Reports what got done, such as “Done: 13 sites checked, 4 options found.” Error. Handles failures gracefully: tool errors, hallucinations, an aborted plan, or a max-turn limit reached. Questionnaire. Pops up a short question list when the agent is uncertain, so you can fill in the gaps. Generative UI. The agent picks a native component, such as a stock quote, weather card, or data chart. Input. More than a textarea: file select, thinking-level control, model switch, dictation, and send/steer/pause buttons. Sources drawer. Collects the evidence the agent consulted. MCP/tool list. Lists the tools and MCP servers available to the agent. This list will keep growing as people discover fun, engaging agentic UX. I’ll update it every now and then. :P UI frameworks A few frameworks stand out for building agentic UI today: The most widely used framework for production web-based agent UIs. It gives you good low-level control, and I use it in my own work. Its generative UI feature is neat. Vercel ai-sdk https://github.com/vercel/ai .Getting popular too. It is built around a protocol called CopilotKit https://github.com/CopilotKit/CopilotKit . ag-ui https://github.com/ag-ui-protocol/ag-ui .It supports multiple backends, such as ai-sdk, ag-ui, and LangChain. assistant-ui https://github.com/assistant-ui/assistant-ui .Popular for building AI and ML prototypes quickly. You will see lots of Gradio apps on Hugging Face Spaces. Gradio https://github.com/gradio-app/gradio .Popular for building data dashboards. It has a simple mental model, but it is hard to extend and cannot expose an API. Streamlit https://github.com/streamlit/streamlit .It has native LangChain support, an out-of-the-box experience, and little boilerplate. Chainlit https://github.com/Chainlit/chainlit .