Build better
agent interfaces.
Chat, voice, tools, approvals, and results people can work with. Built in React. Yours to copy and change.
Blocks.so prompt input + Border Beam · Interactive preview
Using v0.1? Your collection is still available.
New in v0.3
Interfaces for voice agents.
37 new entries for conversations people can hear, follow, and control.
- LiveKit
- 15 entries for call controls, transcripts, complete sessions, and popups.
- ElevenLabs
- 17 families for voice input, playback, waveforms, and voice selection.
- OrbKit
- Four animated shader styles: Hydrogen, Ion, Dither, and Nimbus.
Build with the kit
Start with a complete app.
Voice
Voice and chat
Talk and type in the same conversation, with one composer and shared context.
Try the app and get the prompt
Chat
Fieldwork conversation
Start with a question or source note, then switch to voice without losing your draft.
Try the app and get the prompt
Coding
Coding workspace
An agent proposes a patch, you review it, and the checks explain the result.
Try the app and get the promptGenerated results
Results you can work with.
Audio
Harbour after rain
Fieldwork tapes · Demo track
Focus
Sketching sprint
Paused18:00
Flight
Flight
Workshop itineraryLIS
Lisbon
CPH
Copenhagen
Departure
Arrival
Fictional Fieldwork examples with AI-generated imagery. Connect each component to your own model and tools.
From prompt to useful result
The pieces you need, together.
Show what is happening
Thinking states, tool activity, progress, and source citations keep people oriented while an agent works.
Explore activity componentsAsk before making changes
Review proposed changes, compare options, request approval, and return to a checkpoint with explicit actions.
Explore decision componentsMake results easy to use
Sixteen result types cover documents, comparisons, checklists, media, inboxes, and more. Ready, loading, and error states are part of the component.
Try the result workflowsSource you can own
Fits your existing app.
Copy a component into your React project. Supply its data and connect its callbacks to your own tools, persistence, and model provider.
Read the integration guidenpx shadcn@latest add https://agents-ui.github.io/agents-kit/c/agent-generative-surface.jsonReact · TypeScript · Tailwind CSS · Explicit source licenses
Built with public open-source work.
Agents Kit adapts and extends these libraries. Their authors deserve the credit; their source and license notices stay with the components.