Loading image...Kiro

Product

  • About Kiro
  • IDE
  • CLI
  • Web
  • Mobile
  • Crew
  • Pricing
  • Downloads

For

  • Enterprise
  • Startups
  • Students

Community

  • Overview
  • Ambassadors
  • Discord
  • Events
  • Powers
  • Shop
  • Showcase

Resources

  • Docs
  • Blog
  • Changelog
  • FAQs
  • Report a bug
  • Suggest an idea
  • Billing support

Social

Site TermsLicenseResponsible AI PolicyLegalPrivacy PolicyCookie Preferences
Loading image...Kiro
  • Enterprise
  • Pricing
  • Docs
SIGN INDOWNLOADS
Loading image...Kiro

Get Started

InstallationAuthenticationYour first project

Models

OverviewAvailable modelsReasoning effort

Features

How Kiro works
Specs
Steering
Hooks
MCP
Permissions
Custom agents
Agent Skills
Powers
CompactionKiroignoreCheckpoints and rewind
Built-in tools
Configuration scopes

IDE 1.x

What's new in 1.0
Setup & First Run
Editor
Chat
Experimental
Troubleshooting0.x reference

CLI

What's new in 3.0
Setup & First Run
Terminal UI
Chat
Headless modeACPAuto complete
Experimental
2.x reference

Crew

Quick startInstallationRunning 24/7
Chat
Sessions
Message controls
Prompt optimizer
Voice
Rich output & widgets
Agent Capabilities
Features
Interfaces
Apps
ConfigurationSecurityTroubleshooting

Web - Preview

Setup & First RunIdentity Center
Connect your repositories
Working with the agent
Autonomous modeAutomations
Sandbox

Mobile - Preview

Overview

Commands and Reference

CLI commandsSlash commandsBuilt-in toolsExit codesSettingsIDE keyboard shortcuts

Billing

OverviewManaging your subscriptionUpgrading your planDowngrading your planCancelling your planPurchasing add-on creditsManaging your paymentsManaging usage notificationsManaging your taxesContacting billing supportDeleting your accountRelated questions

Enterprise

ConceptsOnboarding quickstart
Connecting your identity provider
Subscribe your teamManage subscriptions
Governance
Monitor and track
SettingsManaged updatesBillingIAMSupported regions

Privacy and Security

OverviewData protectionCode referencesCompliance validationInfrastructure securityIAM permissionsFirewalls, proxies, and data perimetersVPC endpoints (AWS PrivateLink)

Guides

Overview
Language support
Learn by playing

Migration

Migrating from Q DeveloperMigrating from VSCodeUpgrading from Q CLI
  1. Docs
  2. Crew
  3. Chat
  4. Rich output & widgets

Rich output & widgets


Not everything the agent produces is plain text. When Crew builds something visual — a UI prototype, a status dashboard, a configuration form — it renders as a widget directly inside the chat message. You interact with it in place, and your actions feed back to the agent.

Widgets in chat

A widget is embedded HTML inside a chat message. It renders inline in an iframe with Tailwind CSS, theme variables, and a sandboxed execution environment. The key difference from a static code block: widgets are interactive and can send events back to the agent.

What it looks like

When the agent produces a widget, you see it rendered in your chat flow — a live mini-app inside the conversation. Examples:

  • A button that triggers a deploy
  • A form where you fill in config values and submit
  • A status dashboard with live data
  • A file explorer that lets you pick what to work on next

Interacting with widgets

Click buttons, fill forms, select options — your interactions fire events back to the agent session. The agent receives a [Widget action event] with your payload and can:

  • Respond with another message
  • Update the widget
  • Trigger tool calls based on your selection
  • Spawn subagents based on your choice

This makes widgets more than previews — they're a way to have structured, form-like interactions without leaving the chat.

Widget capabilities

  • Tailwind CSS — available for styling
  • Theme variables — var(--bg), var(--text), var(--accent) follow your dashboard theme
  • Sandboxed — no access to parent origin state, cookies, or storage
  • Bidirectional — events flow both ways (agent → widget HTML, widget actions → agent)

Common widget patterns

PatternWhat it does
Approval UI"Deploy to prod?" with structured Yes/No buttons
Configuration builderForm fields the agent applies on submit
Data explorerFilter/drill-down interface that requests more data
Progress dashboardReal-time status of a running task
Option selectorMultiple-choice cards the agent acts on

Artifacts — persistent output

When the agent creates something you want to keep — a webapp, a document, a code file — it becomes an artifact. Artifacts persist beyond the chat session in a dedicated library with version history, folders, and comments.

Artifacts are a full feature with their own lifecycle: create, iterate, version, deploy, revert. For the complete guide on managing artifacts, deploying webapps, and working with the artifacts library, see Artifacts & deploy.

Quick context for chat

When you're chatting and want to save something, ask "save this as an artifact" — the agent creates a persistent artifact in your library. You can iterate on it with "update the artifact," and webapp artifacts get a live local preview right on their card. The Artifacts panel in the dashboard is where you browse, organize, and manage everything the agent has produced.

Page updated: August 4, 2026
Voice
Agent Capabilities