How to Build Hybrid Agent UIs With A2UI v0.9 and MCP

Google’s new architectural framework allows developers to merge standard web technologies with native declarative components for agent-driven user interfaces. Introduced in the recent A2UI and MCP Apps announcement, the patterns reconcile the limitations of pure iframe deployments with the strict boundaries of host-rendered component libraries. You can now build hybrid interfaces that leverage both standard Model Context Protocol (MCP) tooling and the A2UI framework to control how agents render dynamic responses.

The Trade-off Between A2UI and MCP

Developers building generative user interfaces must choose how the agent interacts with the frontend. A2UI relies on a declarative, JSON-based framework where the agent defines its intent, such as rendering a specific booking card or data table. The host application then parses this payload and renders it using its own native components. This pattern is highly secure and performant. It ensures the agent’s output exactly matches the host’s design system. The major limitation is flexibility. You are strictly confined to the existing component library implemented by the host.

Conversely, MCP applications utilize standard web technologies. They render HTML and JavaScript within an isolated iframe via a ui:// URI. This provides maximum flexibility for custom visuals. The agent can construct complex, stateful widgets on the fly. The drawback is a fragmented user experience. Standalone iframes frequently introduce mismatched styling, nested scrollbars, and significant performance overhead. They also require complex cross-origin security boundaries.

Implementing Hybrid Architecture Patterns

The June 2026 release details three distinct implementation patterns to combine these protocols. These patterns shift the developer focus from static page design to dynamic capability assembly.

A2UI Over MCP Servers

This pattern allows you to serve native-feeling A2UI views directly through an MCP tool connection. The MCP server handles the backend logic, data retrieval, and complex processing, while transmitting a standard A2UI payload back to the client. The host application receives this payload and renders it natively, bypassing the need for an iframe entirely. This maintains the security and aesthetic consistency of native rendering while utilizing MCP for robust backend resource routing.

MCP Apps Embedded in A2UI

You can embed a complex, stateful MCP App iframe directly inside a declarative A2UI view. The host renders the outer structure using its native components, ensuring standard navigation and layout constraints remain intact. The agent then dynamically injects an iframe for specialized visualization canvases, such as a custom 3D model viewer or an interactive financial chart. This solves the limitation of the host’s component library without compromising the entire layout.

A2UI Payloads in MCP Apps

For legacy web applications, you can inject dynamic generative UI components by hosting an MCP App that renders incoming A2UI payloads. The legacy system acts as the iframe host, while the MCP App parses the JSON intent and translates it into standard HTML elements inside the boundary. This provides a migration path for adding generative capabilities to older applications.

Protocol Versions and Tooling

These patterns rely on A2UI v0.9. This version is hardened specifically for framework-agnostic rendering. It supports native integration with React, Flutter, Angular, and Lit environments. The release also includes the A2UI Agent SDK to handle payload generation and state management on the backend.

Google is formally considering an MCP extension for A2UI. This extension aims to standardize these three hybrid patterns across the ecosystem, streamlining implementation for developers who manage complex multi-agent orchestration.

Agentic Resource Discovery (ARD)

To manage the expanding network of specialized MCP servers and UI payloads, Google published the ARD specification under an Apache 2.0 license. ARD provides an open standard for agents to discover and verify external tools, UI skills, and remote servers across a decentralized network.

Agents locate these resources by parsing ai-catalog.json files hosted by the tool providers. The standard relies on globally unique URNs to establish a verified chain of trust between the agent and the required capability. For large-scale organizational deployments, these discovery protocols are now integrated directly into the Gemini Enterprise Agent Platform. Administrators can govern which agents access specific UI components using the platform’s Agent Registry, while securing all outbound interactions with MCP servers through Model Armor policies.

The push for unified standards is currently supported by major industry contributors, including Anthropic and Block, through the Linux Foundation’s Agentic AI Foundation. To implement these UI patterns in your own architecture, review the official documentation for the A2UI Agent SDK to understand the required JSON schema structures and routing logic.