I built a browser-based chat UI for Kiro CLI and it complete how I use AI agents
I love the Kiro CLI TUI. I love the ACP integration in JetBrains. But for research, analysis, and exploring hypotheses, I wanted a web chat experience so I built one.
I've been living inside Kiro CLI for months now. The ACP integration in my JetBrains IntelliJ IDEA is fantastic for coding sessions : I get the full agentic power of Kiro right where my code lives. And the new Terminal UI with its syntax-highlighted markdown, collapsible tool outputs, and crew monitor is genuinely impressive and I love it.
But here's the thing. Not everything I do with an AI agent is coding. Sometimes I'm researching an architecture pattern. Sometimes I'm exploring a hypothesis about a system design. Sometimes I'm doing deep analysis on a technical decision and I want to see tool calls, and streaming responses in a comfortable visual layout, the kind of experience you get on claude.ai or ChatGPT. A web chat, basically. Except one that talks to Kiro's full agentic capabilities instead of a vanilla LLM.
So I built one with the AI-Driven Development Lifecycle (AI-DLC) methodology and Kiro CLI as my usual coding partner, I created Kiro UI , a self-hosted, browser-based chat interface that connects to Kiro CLI via the Agent Client Protocol.
How it works. At its core, the architecture is simple: your browser (React 19 + Vite) connects via WebSocket to an Express server, which spawns and manages
kiro-cli acp processes over stdio. Each browser tab gets its own independent agent process with its own context. The communication uses the ACP protocol.What you get in the browser is a proper agentic chat experience: real-time streaming with markdown rendering and syntax highlighting, side-by-side diffs when the agent modifies files, collapsible tool call blocks with raw I/O inspection, an MCP server panel with live status indicators, permission management with auto-approve policies, slash command autocomplete, image and file attachments, a context usage meter showing how much of the context window you've consumed, ...
Let me show you how to get started.
Step 1: Clone the repository and install dependencies.
1
2
3
git clone https://github.com/guyon-it-consulting/kiro-ui.git
cd kiro-ui
npm installStep 2: Make sure Kiro CLI is installed and authenticated. You need
kiro-cli in your PATH.1
2
3
# Verify kiro-cli is available
which kiro-cli
# Should output something like: ~/.local/bin/kiro-cliStep 3: A single command builds the frontend and starts the server:
1
2
npm start
# Open http://localhost:3000Et voilà! You have a full-featured chat interface to Kiro's agentic capabilities running locally in your browser.
Step 4 (optional): If you prefer a desktop app experience, Kiro UI packages as an Electron app:
1
2
npm run electron:dev # Dev mode
npm run electron:build:mac # macOS → DMG + ZIP (universal)Things to know:
- Self-hosted and private : Everything runs on localhost. No data leaves your machine.
- Multi-tab sessions : Each tab spawns its own
kiro-cli acpprocess. They're fully independent, different contexts, different conversations, different working directories. - Protocol-first design : Every feature is driven by ACP. The UI adapts to what the agent supports, including Kiro-specific extensions (
_kiro.dev/*) for MCP servers, slash commands, and context compaction. - Configuration : Settings live in
~/.kiro-ui/withsettings.jsonfor preferences andtrust.jsonfor persistent tool permission rules. - License : Apache 2.0. Use it, fork it, extend it.
Give it a try: https://github.com/guyon-it-consulting/kiro-ui. I'd love to hear how you use it and what features you'd want next.
— Jérôme
Enjoyed reading this content? Let the author know!
Your likes, comments, shares, and saves help creators reach more builders.
Loading recommendations
Loading article