Loading video...

Video Failed to Load

Go Home

Anthropic's most viral feature is now open-source! Until now, Anthropic's Generative UI capabilities only existed inside its own products. CopilotKit🪁 just shipped Open Generative UI, an open-source implementation of Claude Artifacts that works in any app. The agent generates HTML/SVG at runtime, and CopilotKit streams it token-by-token into a...

akshay_pachaar's profile picture

Akshay 🚀

281,813 subscribers

86,515 views • 3 months ago •via X (Twitter)

EducationScience & Technology
LIVE

Anya Rossi• Live Now

Private livecam show

0 Comments

No comments available

Comments from the original post will appear here

Related Videos

Anthropic's in trouble, again! They spent years building what's now fully open-source. What made Claude feel different from a normal app is that the agent could act inside the interface instead of only talking in a chat box. For instance, Claude Artifacts let an agent render real UI, charts, dashboards, and interactive components that assemble live inside the response. Every major AI product tried to replicate it. But the problem was that unlike reasoning, planning, tool-calling, etc., none of it shipped natively with LangGraph, CrewAI, or Google ADK. So teams started building an owned version that required engineering the entire interface layer from scratch. Most teams, however, just settled for shipping the agent as a backend API in a chat box since rendering the UI is only one piece of it. To actually make it work, the interface layer also needed real-time streaming, state kept in sync between agent and UI, conversations that persist across sessions, and reconnection when a user refreshes mid-run. CopilotKit🪁 is now the only open-source framework that actually lets you build your own full-stack Claude-like apps. It decouples the agent from the interface, talking over AG-UI (an open protocol for agent-to-user communication). Being a standard protocol, the frontend never needs to know whether it is talking to a LangGraph or a CrewAI agent. You can change the backend anytime and the UI will never notice. In practice, CopilotKit's interface layer gives several pre-implemented React building blocks that wire the agent directly into the app, like: - generative UI, so the agent renders real components instead of text - chat windows, sidebars, and popups, or a fully headless setup - shared state, so the agent and app stay in sync - human-in-the-loop approvals, where the agent waits before acting - persistent threads that store the whole session, including the agent-user interactions and generated UI, not just text And because that full history is captured, those interactions can feed a self-learning layer that also improves the agent from real usage over time. The interface layer that Anthropic spent years engineering in-house is now literally available to any developer/team. CopilotKit is open-source with 30k+ GitHub stars, and AG-UI, the protocol underneath, is already supported across every major agent framework: LangGraph, CrewAI, Mastra, Google ADK, and more. CopilotKit GitHub repo → (don't forget to star it ⭐ ) If you want to go deeper, I found a detailed breakdown by Shubham Saboo recently on the three Generative UI patterns, with implementation. Read it below.
0:23

Anthropic's in trouble, again! They spent years building what's now fully open-source. What made Claude feel different from a normal app is that the agent could act inside the interface instead of only talking in a chat box. For instance, Claude Artifacts let an agent render real UI, charts, dashboards, and interactive components that assemble live inside the response. Every major AI product tried to replicate it. But the problem was that unlike reasoning, planning, tool-calling, etc., none of it shipped natively with LangGraph, CrewAI, or Google ADK. So teams started building an owned version that required engineering the entire interface layer from scratch. Most teams, however, just settled for shipping the agent as a backend API in a chat box since rendering the UI is only one piece of it. To actually make it work, the interface layer also needed real-time streaming, state kept in sync between agent and UI, conversations that persist across sessions, and reconnection when a user refreshes mid-run. CopilotKit🪁 is now the only open-source framework that actually lets you build your own full-stack Claude-like apps. It decouples the agent from the interface, talking over AG-UI (an open protocol for agent-to-user communication). Being a standard protocol, the frontend never needs to know whether it is talking to a LangGraph or a CrewAI agent. You can change the backend anytime and the UI will never notice. In practice, CopilotKit's interface layer gives several pre-implemented React building blocks that wire the agent directly into the app, like: - generative UI, so the agent renders real components instead of text - chat windows, sidebars, and popups, or a fully headless setup - shared state, so the agent and app stay in sync - human-in-the-loop approvals, where the agent waits before acting - persistent threads that store the whole session, including the agent-user interactions and generated UI, not just text And because that full history is captured, those interactions can feed a self-learning layer that also improves the agent from real usage over time. The interface layer that Anthropic spent years engineering in-house is now literally available to any developer/team. CopilotKit is open-source with 30k+ GitHub stars, and AG-UI, the protocol underneath, is already supported across every major agent framework: LangGraph, CrewAI, Mastra, Google ADK, and more. CopilotKit GitHub repo → (don't forget to star it ⭐ ) If you want to go deeper, I found a detailed breakdown by Shubham Saboo recently on the three Generative UI patterns, with implementation. Read it below.

Avi Chawla

457,881 views • 2 months ago

Introducing the Generative UI Research Canvas ✨ Every agent needs a powerful UI Combine LangChain, Tavily, Tako and CopilotKit🪁 and you get a LangChain-based research agent with a Generative UI-driven frontend. When agents can explore the underlying data, research becomes more trustworthy and useful. How does this work? - LangChain manages the agent workflow and tool orchestration. - Tako converts retrieved data into structured, visual components - Tavily provides agentic search - CopilotKit renders those components in the UI and keeps the user in the loop while the agent is working So instead of a boring and static report, the output is an interactive research canvas that evolves as the agent runs. 2026 is the year where users want to see the output, not read it... Generative UI makes this possible for agentic applications. Tutorial: Open-Source Repo: Docs:
0:36

Introducing the Generative UI Research Canvas ✨ Every agent needs a powerful UI Combine LangChain, Tavily, Tako and CopilotKit🪁 and you get a LangChain-based research agent with a Generative UI-driven frontend. When agents can explore the underlying data, research becomes more trustworthy and useful. How does this work? - LangChain manages the agent workflow and tool orchestration. - Tako converts retrieved data into structured, visual components - Tavily provides agentic search - CopilotKit renders those components in the UI and keeps the user in the loop while the agent is working So instead of a boring and static report, the output is an interactive research canvas that evolves as the agent runs. 2026 is the year where users want to see the output, not read it... Generative UI makes this possible for agentic applications. Tutorial: Open-Source Repo: Docs:

Atai Barkai

11,997 views • 6 months ago

We are witnessing a fundamental shift in how software is built. Over the decades, UI was static and predictable. But AI is changing the fundamental nature of the interface. We are moving away from fixed UI and toward a new standard: Generative UI. Generative UI lets agents participate in the UI, not just the conversation. It’s a dynamic participant in the user experience. Depending on the complexity of your app, Generative UI generally falls into three categories: 1. Static (AG-UI): UI is chosen from a fixed set of hand-built components 2. Open-Ended (MCP Apps): agent sends arbitrary content like raw HTML or iframes for total flexibility. 3. Declarative (A2UI): agent and frontend communicate via a structured UI spec for dynamic widgets and forms. The AG-UI Protocol by CopilotKit is the real breakthrough. AG-UI acts as the universal transport layer. It provides the integrations and middleware for every Gen-UI spec, making it trivial to bring dynamic components into your existing app. CopilotKit provides the go-to ecosystem for building agentic applications and is the React client of AG-UI. It is designed to be deeply integrated, allowing developers to bring their own frameworks or protocols to the table. Play around with different types of Generative UI here → Check out the video attached to see Generative UI in action. Appreciate the CopilotKit team for collaborating with me on this deep dive.
0:33

We are witnessing a fundamental shift in how software is built. Over the decades, UI was static and predictable. But AI is changing the fundamental nature of the interface. We are moving away from fixed UI and toward a new standard: Generative UI. Generative UI lets agents participate in the UI, not just the conversation. It’s a dynamic participant in the user experience. Depending on the complexity of your app, Generative UI generally falls into three categories: 1. Static (AG-UI): UI is chosen from a fixed set of hand-built components 2. Open-Ended (MCP Apps): agent sends arbitrary content like raw HTML or iframes for total flexibility. 3. Declarative (A2UI): agent and frontend communicate via a structured UI spec for dynamic widgets and forms. The AG-UI Protocol by CopilotKit is the real breakthrough. AG-UI acts as the universal transport layer. It provides the integrations and middleware for every Gen-UI spec, making it trivial to bring dynamic components into your existing app. CopilotKit provides the go-to ecosystem for building agentic applications and is the React client of AG-UI. It is designed to be deeply integrated, allowing developers to bring their own frameworks or protocols to the table. Play around with different types of Generative UI here → Check out the video attached to see Generative UI in action. Appreciate the CopilotKit team for collaborating with me on this deep dive.

Pratham

33,920 views • 6 months ago

Here is how simple it is to build a UI front-end for an AI agent (assuming you are using . The video here is 90 seconds and will show you everything you need to connect an agent to a web app: 1. Set up CopilotKit🪁 in your app 1. Copy the agent's localhost URL from LangGraph Studio 2. Paste that URL into a CopilotKit🪁 remote endpoint That's all you need to get a front-end to interact with the agent! The secret sauce here is CoAgents, an open-source library. You can use CoAgents to integrate any agent with your web application. Here is what you get: • Human-in-the-loop to steer and correct the agent • Stream intermediate agent state • Real-time state sharing between the agent and the application • Agentic generative UI to build trust that the agent is on the right path Watch the attached demo so you see it in action.
1:32

Here is how simple it is to build a UI front-end for an AI agent (assuming you are using . The video here is 90 seconds and will show you everything you need to connect an agent to a web app: 1. Set up CopilotKit🪁 in your app 1. Copy the agent's localhost URL from LangGraph Studio 2. Paste that URL into a CopilotKit🪁 remote endpoint That's all you need to get a front-end to interact with the agent! The secret sauce here is CoAgents, an open-source library. You can use CoAgents to integrate any agent with your web application. Here is what you get: • Human-in-the-loop to steer and correct the agent • Stream intermediate agent state • Real-time state sharing between the agent and the application • Agentic generative UI to build trust that the agent is on the right path Watch the attached demo so you see it in action.

Santiago

46,109 views • 1 year ago

Microsoft Teams just got Generative UI But this is just the tip of the iceberg. AG-UI is the protocol connecting any agent to any user on any app, topped with Generative UI. That means your agent can render: - forms - buttons - charts - approval flows Right inside the chat, on the fly. But it's not limited to in-app copilots. What's special is that you can work with any agent using the same system and bring them into any surface, including Slack, WhatsApp, Discord and more. This is exactly why Hermes and OpenClaw took off. As users of these agents, we don't like walls of text, and it's a pain to get when you can have way better UX. CopilotKit🪁 + AG-UI handle that interaction layer. If you want to try out Agentic UI in Microsoft Teams, you can get early access here:
0:55

Microsoft Teams just got Generative UI But this is just the tip of the iceberg. AG-UI is the protocol connecting any agent to any user on any app, topped with Generative UI. That means your agent can render: - forms - buttons - charts - approval flows Right inside the chat, on the fly. But it's not limited to in-app copilots. What's special is that you can work with any agent using the same system and bring them into any surface, including Slack, WhatsApp, Discord and more. This is exactly why Hermes and OpenClaw took off. As users of these agents, we don't like walls of text, and it's a pain to get when you can have way better UX. CopilotKit🪁 + AG-UI handle that interaction layer. If you want to try out Agentic UI in Microsoft Teams, you can get early access here:

Atai Barkai

24,595 views • 1 month ago

Another blow to Anthropic! They spent months building what's now fully open-source. Anthropic recently put Claude inside Slack, where you can tag it in a channel. It reads the thread, breaks the task into steps, and posts the result back. The problem is that it only runs Claude and only in the channels Anthropic supports. Running your own agent there is harder. The reasoning, tool calls, and state management are mostly handled by the framework. Connecting that agent to a messaging platform is not. Moreover, each platform has a different integration: - Slack renders messages with Block Kit - Teams uses Adaptive Cards - and each has its own SDK, auth flow, and delivery model. If an agent needs to run on three platforms, one must write three separate integrations against the same agent logic. That overhead explains why most custom agents never get deployed to Slack, and why the ones that do are usually a single vendor's hosted assistant. The alternative is to keep the agent in one place and add a per-platform adapter that translates its output into each platform's native format. The agent is written once, and each channel requires just another output target instead of a separate build. CopilotKit open-sourced this full implementation in the Channels SDK. Essentially, any agent that implements AG-UI can run in a messaging platform in a few lines of code, like Slack, Teams, Discord, WhatsApp, and many more. Because the agent runs inside the thread, it has that conversation's context, so it can summarize the discussion, open a ticket, or route to the right person. It works with any backend, so LangGraph, CrewAI, Mastra, Google ADK, or a plain HTTP agent can connect through an existing endpoint. The same message can render as a Block Kit in Slack and as Adaptive Cards in Teams. In practice, the model and orchestration stay the same; it requires no migration or rewrite. It also handles human-in-the-loop approvals, persistence, and transcripts that carry state across platforms, so a thread started in Teams can continue in Slack. CopilotKit is open-source, and AG-UI is supported across every major agent framework, including LangGraph, CrewAI, Mastra, and Google ADK. Here's the repo: (don't forget to star it ⭐) The agent running in Slack no longer has to be a vendor's. It can be the one you already built. The video below shows this in action. Thanks to CopilotKit for working with me on this launch.
0:30

Another blow to Anthropic! They spent months building what's now fully open-source. Anthropic recently put Claude inside Slack, where you can tag it in a channel. It reads the thread, breaks the task into steps, and posts the result back. The problem is that it only runs Claude and only in the channels Anthropic supports. Running your own agent there is harder. The reasoning, tool calls, and state management are mostly handled by the framework. Connecting that agent to a messaging platform is not. Moreover, each platform has a different integration: - Slack renders messages with Block Kit - Teams uses Adaptive Cards - and each has its own SDK, auth flow, and delivery model. If an agent needs to run on three platforms, one must write three separate integrations against the same agent logic. That overhead explains why most custom agents never get deployed to Slack, and why the ones that do are usually a single vendor's hosted assistant. The alternative is to keep the agent in one place and add a per-platform adapter that translates its output into each platform's native format. The agent is written once, and each channel requires just another output target instead of a separate build. CopilotKit open-sourced this full implementation in the Channels SDK. Essentially, any agent that implements AG-UI can run in a messaging platform in a few lines of code, like Slack, Teams, Discord, WhatsApp, and many more. Because the agent runs inside the thread, it has that conversation's context, so it can summarize the discussion, open a ticket, or route to the right person. It works with any backend, so LangGraph, CrewAI, Mastra, Google ADK, or a plain HTTP agent can connect through an existing endpoint. The same message can render as a Block Kit in Slack and as Adaptive Cards in Teams. In practice, the model and orchestration stay the same; it requires no migration or rewrite. It also handles human-in-the-loop approvals, persistence, and transcripts that carry state across platforms, so a thread started in Teams can continue in Slack. CopilotKit is open-source, and AG-UI is supported across every major agent framework, including LangGraph, CrewAI, Mastra, and Google ADK. Here's the repo: (don't forget to star it ⭐) The agent running in Slack no longer has to be a vendor's. It can be the one you already built. The video below shows this in action. Thanks to CopilotKit for working with me on this launch.

Akshay 🚀

217,319 views • 2 days ago

AG-UI makes building agentic applications dramatically easier. Here's how it works. This is a model for a simple chatbot: User → LLM → Response But interactive agents that render UI, pause for approvals, and ask users for input need a much more complex model. When building these agents, a response from the LLM will include a series of state changes as the agent runs: • Agent started a task • Agent called a tool • Agent updated its state • Agent streams these tokens • Agent is waiting on a human • Agent is resuming the task The Agent-User Interaction Protocol (AG-UI) treats the LLM response as a stream of events rather than a text endpoint. In practice, here is what you get as an agent runs: 1. Lifecycle events so your UI knows where the agent is. 2. Text messages that stream tokens. 3. Tool calls so your UI can prefill a form with any required arguments. 4. State updates that keep your UI in sync with the agent. 5. Special events for human approvals, rich media, and custom needs. All of these events travel over standard transports (SSE, WebSockets, or plain HTTP) as JSON. As a result, you can build a frontend that stays in sync with the agent's progress without having to invent a custom process to make this happen. For example, building a human-in-the-loop workflow becomes an off-the-shelf component you can integrate rather than build from scratch. CopilotKit🪁 is the creator of AG-UI, and you can use it when building frontend applications pretty much anywhere: • React • Angular • Vue • React Native • Slack • Teams • Discord • WhatsApp • Telegram Here is the link for you to check it out: Thanks to the CopilotKit team for partnering with me on this post.
0:22

AG-UI makes building agentic applications dramatically easier. Here's how it works. This is a model for a simple chatbot: User → LLM → Response But interactive agents that render UI, pause for approvals, and ask users for input need a much more complex model. When building these agents, a response from the LLM will include a series of state changes as the agent runs: • Agent started a task • Agent called a tool • Agent updated its state • Agent streams these tokens • Agent is waiting on a human • Agent is resuming the task The Agent-User Interaction Protocol (AG-UI) treats the LLM response as a stream of events rather than a text endpoint. In practice, here is what you get as an agent runs: 1. Lifecycle events so your UI knows where the agent is. 2. Text messages that stream tokens. 3. Tool calls so your UI can prefill a form with any required arguments. 4. State updates that keep your UI in sync with the agent. 5. Special events for human approvals, rich media, and custom needs. All of these events travel over standard transports (SSE, WebSockets, or plain HTTP) as JSON. As a result, you can build a frontend that stays in sync with the agent's progress without having to invent a custom process to make this happen. For example, building a human-in-the-loop workflow becomes an off-the-shelf component you can integrate rather than build from scratch. CopilotKit🪁 is the creator of AG-UI, and you can use it when building frontend applications pretty much anywhere: • React • Angular • Vue • React Native • Slack • Teams • Discord • WhatsApp • Telegram Here is the link for you to check it out: Thanks to the CopilotKit team for partnering with me on this post.

Santiago

17,438 views • 1 month ago

Introducing Open MCP Client 🪁 Chat with any MCP server in your own app, just grab a URL from . The team and I vibe coded with Cursor this weekend and built: 1. The first web-based MCP client (link👇) 2. An open-source client you can add into any app How it's built It uses CopilotKit🪁 for the client and interactivity layer, and connects to a 40 line LangGraph ReAct agent that coordinates MCP calls. Hosted on Vercel. Kudos to Suhas Deshpande and Tyler Slaton for hacking and thanks to Harrison Chase for pointers!
1:00

Introducing Open MCP Client 🪁 Chat with any MCP server in your own app, just grab a URL from . The team and I vibe coded with Cursor this weekend and built: 1. The first web-based MCP client (link👇) 2. An open-source client you can add into any app How it's built It uses CopilotKit🪁 for the client and interactivity layer, and connects to a 40 line LangGraph ReAct agent that coordinates MCP calls. Hosted on Vercel. Kudos to Suhas Deshpande and Tyler Slaton for hacking and thanks to Harrison Chase for pointers!

Atai Barkai

299,711 views • 1 year ago

Introducing the A2UI Widget Builder ⚙️ An interactive demo and template to build A2UI Widgets and bring them into your application. Powered by CopilotKit & Google's new A2UI spec Includes... - Widget Gallery: premade UI widgets you can use & modify - Material Icons: 100 of the most commonly used icons - UI Components: common components preview, usage and props - Source code and data on any widget/icon/component - Built with CopilotKit- so you get chat UI, generative UI, etc. Try it out: Tutorial of how to get started: Repo:
0:30

Introducing the A2UI Widget Builder ⚙️ An interactive demo and template to build A2UI Widgets and bring them into your application. Powered by CopilotKit & Google's new A2UI spec Includes... - Widget Gallery: premade UI widgets you can use & modify - Material Icons: 100 of the most commonly used icons - UI Components: common components preview, usage and props - Source code and data on any widget/icon/component - Built with CopilotKit- so you get chat UI, generative UI, etc. Try it out: Tutorial of how to get started: Repo:

CopilotKit🪁

18,510 views • 7 months ago

Microsoft 🤝 AG-UI Protocol Microsoft Agent Framework is now AG-UI compatible! 🎉 Connect your MS Agent Framework .NET agents into fullstack applications with Python coming soon 👀 MS Agent Framework takes care of the agentic backend, AG-UI connects your agents to the frontend. Features include: - Chat UI - Generative UI - State synchronization - Human-in-the-loop - Frontend Tool Calls All the building blocks you need to take your agents from the backend and into a fullstack agentic application. Available in React & Angular via CopilotKit, and Rust, Kotlin, Rust, Java and .NET via community SDKs Big shoutout to the Microsoft & CopilotKit teams, who shipped this highly requested integration at breakneck speeds. More coming soon 👀 🙏 Javier Nelson, Joonseok Oh, Daniel Roth, Evan Mattson, Tyler Slaton, Brandon McConnell, Markus Ecker Read more about our collaboration: Get started: Check out the Dojo:
1:13

Microsoft 🤝 AG-UI Protocol Microsoft Agent Framework is now AG-UI compatible! 🎉 Connect your MS Agent Framework .NET agents into fullstack applications with Python coming soon 👀 MS Agent Framework takes care of the agentic backend, AG-UI connects your agents to the frontend. Features include: - Chat UI - Generative UI - State synchronization - Human-in-the-loop - Frontend Tool Calls All the building blocks you need to take your agents from the backend and into a fullstack agentic application. Available in React & Angular via CopilotKit, and Rust, Kotlin, Rust, Java and .NET via community SDKs Big shoutout to the Microsoft & CopilotKit teams, who shipped this highly requested integration at breakneck speeds. More coming soon 👀 🙏 Javier Nelson, Joonseok Oh, Daniel Roth, Evan Mattson, Tyler Slaton, Brandon McConnell, Markus Ecker Read more about our collaboration: Get started: Check out the Dojo:

CopilotKit🪁

40,531 views • 8 months ago

Finally, a proper chat UI for Hermes Agent (open-source)! Hermes ships an official dashboard, but it's primarily built for management, and its chat is just a terminal piped into a browser tab. Hermes Web UI is an open-source chat-first alternative. It's self-hosted and points at your existing ~/.hermes state, so there's nothing new to configure. - It's a native web chat, not a terminal in a tab - Sessions group by date with a context ring - Kanban renders the agent's task board - Spaces manages your workspaces - Skills panel lists the full catalog - Tasks panel shows cron jobs - Insights show usage and activity - Memory shows MEMORY and SOUL files - Logs tails the agent, gateway, and error logs The whole setup runs 100% locally, binds to localhost by default, and you reach it over an SSH tunnel or Tailscale from your phone. I have shared the Hermes Web UI GitHub repo in the replies. Do note that it's a community project, not official, so expect occasional rough edges (concurrent profile runs are blocked for now). To dive deeper into Hermes Agent, my co-founder wrote a full masterclass about it, covering the learning loop, the memory tiers, self-evolving skills, GEPA, and running multiple isolated agents. Read it below.
0:23

Finally, a proper chat UI for Hermes Agent (open-source)! Hermes ships an official dashboard, but it's primarily built for management, and its chat is just a terminal piped into a browser tab. Hermes Web UI is an open-source chat-first alternative. It's self-hosted and points at your existing ~/.hermes state, so there's nothing new to configure. - It's a native web chat, not a terminal in a tab - Sessions group by date with a context ring - Kanban renders the agent's task board - Spaces manages your workspaces - Skills panel lists the full catalog - Tasks panel shows cron jobs - Insights show usage and activity - Memory shows MEMORY and SOUL files - Logs tails the agent, gateway, and error logs The whole setup runs 100% locally, binds to localhost by default, and you reach it over an SSH tunnel or Tailscale from your phone. I have shared the Hermes Web UI GitHub repo in the replies. Do note that it's a community project, not official, so expect occasional rough edges (concurrent profile runs are blocked for now). To dive deeper into Hermes Agent, my co-founder wrote a full masterclass about it, covering the learning loop, the memory tiers, self-evolving skills, GEPA, and running multiple isolated agents. Read it below.

Avi Chawla

77,513 views • 2 months ago

Don't just learn how to build AI agents. Instead, learn how to build... ...full-stack AI agents that actually work inside apps. Yet, the main challenge is transitioning them from local setups to user-facing apps. Here are some key factors to consider: - How do you embed a seamless UI? - How do you enable user control when necessary? - How do you unify the agent’s state and actions with the app? CoAgents by CopilotKit🪁 solves this. It is the only framework that offers all the essential Agentic front-end building blocks to set up full-stack agentic apps. And most recently, they have extended full-stack development support to Agents built with CrewAI ✨. This includes both regular Agentic Crews and Flows. Check their GitHub repo it's 100% open-source, I have shared link in the next tweet! With this update, here's what you can do with Agents built using CrewAI: ↳ Chat: Add chat components for interaction. ↳ Human-in-the-loop: Real-time human approvals. ↳ Predictive state updates: Preview upcoming changes. ↳ Agentic UI: Agents generate UI components dynamically. This way, you can give your CrewAI Agents a frontend brain—so they don’t just work behind the scenes, they become an integral part of the user experience. The video below showcases a full-stack CrewAI Agent built in 20 minutes using CoAgents. Impressive, right?
0:25

Don't just learn how to build AI agents. Instead, learn how to build... ...full-stack AI agents that actually work inside apps. Yet, the main challenge is transitioning them from local setups to user-facing apps. Here are some key factors to consider: - How do you embed a seamless UI? - How do you enable user control when necessary? - How do you unify the agent’s state and actions with the app? CoAgents by CopilotKit🪁 solves this. It is the only framework that offers all the essential Agentic front-end building blocks to set up full-stack agentic apps. And most recently, they have extended full-stack development support to Agents built with CrewAI ✨. This includes both regular Agentic Crews and Flows. Check their GitHub repo it's 100% open-source, I have shared link in the next tweet! With this update, here's what you can do with Agents built using CrewAI: ↳ Chat: Add chat components for interaction. ↳ Human-in-the-loop: Real-time human approvals. ↳ Predictive state updates: Preview upcoming changes. ↳ Agentic UI: Agents generate UI components dynamically. This way, you can give your CrewAI Agents a frontend brain—so they don’t just work behind the scenes, they become an integral part of the user experience. The video below showcases a full-stack CrewAI Agent built in 20 minutes using CoAgents. Impressive, right?

Akshay 🚀

27,153 views • 1 year ago

Today ReUI Pro goes live! 🔥 Design-forward shadcn/ui platform with MCP fluency for agents. AI made UI generation instant. It didn't make it production-ready. You still spend hours picking blocks, adjusting details, and fine-tuning the last mile. We spent six months building the agent-ready layer for shadcn/ui that closes the gap. Inside: ☑️ Free Hosted MCP with Agent Skills. ☑️ 1,019 open-source shadcn/ui components, free forever. ☑️ 17 open-source ReUI primitives(Data Grid, Filters,File Upload, Stepper and more). ☑️ 485 Pro blocks across over 50 categories. ☑️ 562 hand-crafted interactive icons in 4 styles. ☑️ Default Base UI and legacy Radix by WorkOS versions. Real credit to shadcn for the ecosystem! The registry model changed how we all build and ship UI, and ReUI stands on that foundation. Below is a thread on the 10 things we're most proud of👇
3:17

Today ReUI Pro goes live! 🔥 Design-forward shadcn/ui platform with MCP fluency for agents. AI made UI generation instant. It didn't make it production-ready. You still spend hours picking blocks, adjusting details, and fine-tuning the last mile. We spent six months building the agent-ready layer for shadcn/ui that closes the gap. Inside: ☑️ Free Hosted MCP with Agent Skills. ☑️ 1,019 open-source shadcn/ui components, free forever. ☑️ 17 open-source ReUI primitives(Data Grid, Filters,File Upload, Stepper and more). ☑️ 485 Pro blocks across over 50 categories. ☑️ 562 hand-crafted interactive icons in 4 styles. ☑️ Default Base UI and legacy Radix by WorkOS versions. Real credit to shadcn for the ecosystem! The registry model changed how we all build and ship UI, and ReUI stands on that foundation. Below is a thread on the 10 things we're most proud of👇

ReUI

42,182 views • 28 days ago

THIS GUY ADDED A LIVE BROWSER TO CLAUDE CODE SO YOU CAN CLICK ANY ELEMENT AND EDIT IT INSTANTLY biggest issue with vibe coding UI is that you have to describe what you want to change. if you prompt it the wrong selector or wrong component, Claude can't find it. now you just click it. your app runs in an embedded browser with Claude Code. you can click any button, any text, any div. Claude instantly knows exactly what you're pointing at. click. instruct. done. no more "change the button in the top right corner of the second card component." all you have to do now is just click the button. AND its open source
0:40

THIS GUY ADDED A LIVE BROWSER TO CLAUDE CODE SO YOU CAN CLICK ANY ELEMENT AND EDIT IT INSTANTLY biggest issue with vibe coding UI is that you have to describe what you want to change. if you prompt it the wrong selector or wrong component, Claude can't find it. now you just click it. your app runs in an embedded browser with Claude Code. you can click any button, any text, any div. Claude instantly knows exactly what you're pointing at. click. instruct. done. no more "change the button in the top right corner of the second card component." all you have to do now is just click the button. AND its open source

Om Patel

152,845 views • 4 months ago

New generative UI experiences in the Google Gemini and AI Mode in Search use Gemini 3’s multimodal understanding capabilities to make entire user interfaces for you from scratch — dynamically delivering what you need in a visual and interactive way. Google Research software engineer Yaniv Leviathan shares more about the process of building generative UI (hint: so much fun that the team couldn't stop playing with it) and how he's been using it so far.
1:53

New generative UI experiences in the Google Gemini and AI Mode in Search use Gemini 3’s multimodal understanding capabilities to make entire user interfaces for you from scratch — dynamically delivering what you need in a visual and interactive way. Google Research software engineer Yaniv Leviathan shares more about the process of building generative UI (hint: so much fun that the team couldn't stop playing with it) and how he's been using it so far.

Google

138,435 views • 8 months ago

My agent is now paying for its own data. No API key. No account. No credit card. Check the video I recorded. This uses the x402 open protocol built by Coinbase, along with a simple skill. This is an open protocol governed by the Linux Foundation. To complete a goal, an agent can now search for an actor on the Apify Store, pay for it, and use it without any human intervention. The way it works is pretty simple: 1. Your agent finds an Actor it wants to use 2. It sends a request 3. The Actor sends back an HTTP 402 "Payment Required" response 4. Agent authorizes payment from a wallet in USDC on Base 5. The Actor runs 6. User receives the result The model is pay-as-you-go: the agent authorizes a spending ceiling, pays only for usage, and the remaining balance is automatically settled. This brings an entire marketplace of AI tools into the agentic economy. Here is the skill you need. Add it to your agent, and it will take care of everything for you: If you want to know how this works, including what you can do with $1, read this post: Thanks to the Apify team for partnering with me on this post.
5:56

My agent is now paying for its own data. No API key. No account. No credit card. Check the video I recorded. This uses the x402 open protocol built by Coinbase, along with a simple skill. This is an open protocol governed by the Linux Foundation. To complete a goal, an agent can now search for an actor on the Apify Store, pay for it, and use it without any human intervention. The way it works is pretty simple: 1. Your agent finds an Actor it wants to use 2. It sends a request 3. The Actor sends back an HTTP 402 "Payment Required" response 4. Agent authorizes payment from a wallet in USDC on Base 5. The Actor runs 6. User receives the result The model is pay-as-you-go: the agent authorizes a spending ceiling, pays only for usage, and the remaining balance is automatically settled. This brings an entire marketplace of AI tools into the agentic economy. Here is the skill you need. Add it to your agent, and it will take care of everything for you: If you want to know how this works, including what you can do with $1, read this post: Thanks to the Apify team for partnering with me on this post.

Santiago

26,589 views • 1 month ago

A 100% open-source alternative to n8n! Sim is a drag-and-drop open-source platform to build and deploy Agentic workflows. - Runs 100% locally - Works with any local LLM I used it to build a finance assistance app & connected it to Telegram in minutes. The workflow is simple: - You ask a finance question through Telegram - An Intent Classifier figures out if it's finance-related - If not, you get a polite redirect - If yes, the Finance Agent kicks in Here's what's happening under the hood: The Finance Agent uses Firecrawl for web searches and accesses stock data via Alpha Vantage's API through MCP servers. A Response Agent compiles the info and delivers it. In Sim, every tool or agent you need is available as a block. Just drag them onto the canvas and connect them. Sim agents also support integration with MCP, which is exactly what we did to connect our agent with Alpha Vantage's API. And it's simple to extend. If you want to track crypto or need portfolio analysis, you can just add another Agent. Sim allows easy feature additions without disrupting existing functionality. I have shared the link to Sim's official, open-source GitHub repo in the replies!
0:33

A 100% open-source alternative to n8n! Sim is a drag-and-drop open-source platform to build and deploy Agentic workflows. - Runs 100% locally - Works with any local LLM I used it to build a finance assistance app & connected it to Telegram in minutes. The workflow is simple: - You ask a finance question through Telegram - An Intent Classifier figures out if it's finance-related - If not, you get a polite redirect - If yes, the Finance Agent kicks in Here's what's happening under the hood: The Finance Agent uses Firecrawl for web searches and accesses stock data via Alpha Vantage's API through MCP servers. A Response Agent compiles the info and delivers it. In Sim, every tool or agent you need is available as a block. Just drag them onto the canvas and connect them. Sim agents also support integration with MCP, which is exactly what we did to connect our agent with Alpha Vantage's API. And it's simple to extend. If you want to track crypto or need portfolio analysis, you can just add another Agent. Sim allows easy feature additions without disrupting existing functionality. I have shared the link to Sim's official, open-source GitHub repo in the replies!

Avi Chawla

115,578 views • 10 months ago

Smart money used to mean knowing the right people, being in the right rooms. Now it means having the right agents. For years, building one took five tools, four logins, and a painful month of work. Today, it takes just a single prompt. BNB Agent Studio is live on BNB Smart Chain. Open Cursor or Claude Code, describe the agent you want, and it ships to the chain with its own onchain identity, its own wallet, and a way to pay its own bills. The whole thing runs on Amazon Web Services's Bedrock AgentCore, so your agent stays online long after you've closed your laptop. This is the start of the Smart Money Era. Capital that works for you instead of waiting for you to move it. Agents that monitor markets while you sleep, rebalance positions you'd never get to in time, and hunt yield without checking dashboards. Try BNB Agent Studio for free for a limited time with GitHub login only, with no AWS account or credit card needed. Read the full breakdown in our blog 👇
0:55

Smart money used to mean knowing the right people, being in the right rooms. Now it means having the right agents. For years, building one took five tools, four logins, and a painful month of work. Today, it takes just a single prompt. BNB Agent Studio is live on BNB Smart Chain. Open Cursor or Claude Code, describe the agent you want, and it ships to the chain with its own onchain identity, its own wallet, and a way to pay its own bills. The whole thing runs on Amazon Web Services's Bedrock AgentCore, so your agent stays online long after you've closed your laptop. This is the start of the Smart Money Era. Capital that works for you instead of waiting for you to move it. Agents that monitor markets while you sleep, rebalance positions you'd never get to in time, and hunt yield without checking dashboards. Try BNB Agent Studio for free for a limited time with GitHub login only, with no AWS account or credit card needed. Read the full breakdown in our blog 👇

BNB Chain

281,499 views • 1 month ago

i just built a 4-agent software team. everything runs from Telegram and gets managed on a kanban board. a project manager who plans the work, a backend developer, a frontend developer, and a tester. the PM reads a goal, breaks it into linked tasks, and assigns each to the right agent. the thing that makes them a team instead of four strangers is a shared kanban board. every task is a row that survives crashes, and when an agent finishes, it writes a summary of what it built and what the next agent needs to know. the next agent reads that summary before it starts. so the frontend developer never has to guess the API shape, and the tester knows exactly what to verify. the hardest part was not the coordination. it was building an agent that could actually act like a backend engineer. a backend engineer stands up a database, wires auth, manages storage, deploys functions, and keeps all of it consistent while the rest of the team builds on top. an agent doing this from scratch drowns. it burns its context window remembering which tables exist and which endpoint it created three steps ago, and the work degrades fast. so the backend agent needs a backend built for agents, not for humans clicking through a dashboard. that is where InsForge came in. it is an open-source, agent-native backend, and i added it to my backend developer agent as a skill. a skill is a step-by-step guide that teaches the agent how to do a specific kind of work. with InsForge installed, the agent stopped improvising infrastructure and followed a reliable path: create the project, define the database, set up auth, deploy functions. to test the whole team, i had them build a working Google Docs clone, AI features included. the backend agent spun up the full service on its own. database tables, user auth, document handling, and edge functions running real TypeScript, all in one dashboard. the frontend agent read that summary and built the UI on top of it, and the tester closed the loop. the result was a backend an agent could reason about end to end, instead of one it kept getting lost inside. if you are building an AI backend engineer, InsForge is worth a look, it's 100% open-source. InsForge GitHub: (don't forget to star 🌟) the full article on Hermes Kanban: Mission Control for your Agents is quoted below.
0:22

i just built a 4-agent software team. everything runs from Telegram and gets managed on a kanban board. a project manager who plans the work, a backend developer, a frontend developer, and a tester. the PM reads a goal, breaks it into linked tasks, and assigns each to the right agent. the thing that makes them a team instead of four strangers is a shared kanban board. every task is a row that survives crashes, and when an agent finishes, it writes a summary of what it built and what the next agent needs to know. the next agent reads that summary before it starts. so the frontend developer never has to guess the API shape, and the tester knows exactly what to verify. the hardest part was not the coordination. it was building an agent that could actually act like a backend engineer. a backend engineer stands up a database, wires auth, manages storage, deploys functions, and keeps all of it consistent while the rest of the team builds on top. an agent doing this from scratch drowns. it burns its context window remembering which tables exist and which endpoint it created three steps ago, and the work degrades fast. so the backend agent needs a backend built for agents, not for humans clicking through a dashboard. that is where InsForge came in. it is an open-source, agent-native backend, and i added it to my backend developer agent as a skill. a skill is a step-by-step guide that teaches the agent how to do a specific kind of work. with InsForge installed, the agent stopped improvising infrastructure and followed a reliable path: create the project, define the database, set up auth, deploy functions. to test the whole team, i had them build a working Google Docs clone, AI features included. the backend agent spun up the full service on its own. database tables, user auth, document handling, and edge functions running real TypeScript, all in one dashboard. the frontend agent read that summary and built the UI on top of it, and the tester closed the loop. the result was a backend an agent could reason about end to end, instead of one it kept getting lost inside. if you are building an AI backend engineer, InsForge is worth a look, it's 100% open-source. InsForge GitHub: (don't forget to star 🌟) the full article on Hermes Kanban: Mission Control for your Agents is quoted below.

Akshay 🚀

118,124 views • 2 months ago

🚀Launching CoAgents Public Beta 🪁: Everything you need to build Agent-Native applications, powered by LangGraph & CopilotKit. CoAgents enables in-app agents with: - Agenetic generative UI ✨ - Shared state (between agent application) - Streaming intermediate agent state - Human-in-the-Loop (Human approval & planning) 👨‍🦰 - Frontend Actions 💪 --- We’ve recently seen the emergence of Agent-Native applications that actually work: powered by vertical AI agents + agentic UX + deep in-app integration. (Apps like the Replit AI Agent, OpenAI Canvas, etc, but for any domain) With CoAgents + LangGraph, you can build this next generation of agent apps, for any vertical, with a clean and easy to use infrastructure (in hours). 💻Get started: 🗞️Blog: 🕹️Demo: 🗓️Webinar (Build an Agent-Native Apps with CoAgents & LangGraph): CC: Atai Barkai, , Harrison Chase
1:46

🚀Launching CoAgents Public Beta 🪁: Everything you need to build Agent-Native applications, powered by LangGraph & CopilotKit. CoAgents enables in-app agents with: - Agenetic generative UI ✨ - Shared state (between agent application) - Streaming intermediate agent state - Human-in-the-Loop (Human approval & planning) 👨‍🦰 - Frontend Actions 💪 --- We’ve recently seen the emergence of Agent-Native applications that actually work: powered by vertical AI agents + agentic UX + deep in-app integration. (Apps like the Replit AI Agent, OpenAI Canvas, etc, but for any domain) With CoAgents + LangGraph, you can build this next generation of agent apps, for any vertical, with a clean and easy to use infrastructure (in hours). 💻Get started: 🗞️Blog: 🕹️Demo: 🗓️Webinar (Build an Agent-Native Apps with CoAgents & LangGraph): CC: Atai Barkai, , Harrison Chase

CopilotKit🪁

51,662 views • 1 year ago