# Introducing the Universal Agent: your guide to AgentOS

## AG2 + AG-UI Protocol

Connect your AG2 agents to any frontend with the AG-UI Protocol. Build rich user interfaces that bring your multi-agent systems to life.

### Documentation & Tutorials

#### AG2 + AG-UI Integration

Official AG2 documentation for integrating the AG-UI protocol with your multi-agent systems. Documentation coming soon.

\
\
Tutorial\
**Add a Frontend to Any AG2 Agent** \
Step-by-step tutorial on building user interfaces for your AG2 agents using the AG-UI protocol.\
View tutorial](https://www.copilotkit.ai/blog/how-to-add-a-frontend-to-any-ag2-agent-using-ag-ui-protocol)

## Why Use AG2 with AG-UI

AG2's multi-agent framework is powerful for building complex AI workflows, but agents need user interfaces to be truly useful. The AG-UI protocol bridges this gap, providing a universal standard for connecting AG2 agents to frontend applications.

With AG-UI, your AG2 agents can stream responses in real-time, display tool calls and reasoning steps, and enable human-in-the-loop workflows—all through a standardized protocol that works with any frontend framework.

Whether you're building a chatbot, a copilot assistant, or a complex multi-agent dashboard, AG-UI provides the building blocks to create polished, production-ready user experiences for your AG2 agents.

### AG2 Capabilities

## What You Can Build

AG-UI unlocks rich user experiences for your AG2 multi-agent systems.

### Universal Agent Frontend

AG2 agents can connect to any frontend framework—React, Vue, Angular, or vanilla JavaScript—through the AG-UI protocol.

### Real-Time Streaming

Stream AG2 agent responses to your UI in real-time, providing responsive user experiences with token-by-token updates.

### Tool Call Visualization

Display AG2 agent tool calls and their results in your UI, giving users visibility into agent reasoning and actions.

### Multi-Agent Chat UIs

Build chat interfaces that show conversations between multiple AG2 agents, with clear attribution and turn-taking.

### Human-in-the-Loop Interfaces

Create approval workflows where users can review and approve AG2 agent actions before execution.

### Customizable Components

Use pre-built UI components or create custom ones that match your application's design system.

## Get Started

Ready to add user interfaces to your AG2 agents? Check out the tutorial to get started with AG-UI.

[Start Building](https://www.copilotkit.ai/blog/how-to-add-a-frontend-to-any-ag2-agent-using-ag-ui-protocol)