Herald UI
Composable blocks for building a coherent, beautiful AI OS. Free, open source, built to drop into any shadcn/ui project.
$ npx shadcn add @herald-ui/dashboard
Get StartedMorning — how's the fleet?
Reasoning
query_fleet
Fleet is healthy — 4 of 5 online, p95 down 12% overnight…
Notifications2
Atlas finished a deploy2m
Ava requested your review14m
Sentinel flagged a spike1h
run_querydone
SELECT * FROM agents WHERE status = 'online'
4 rows · 12ms
AAtlasclaude-opus-4Online
NNovagpt-4oOnline
SSolllama-3.1-70bIdle
EEchogemini-2.0-flashOnline
Type a command…⌘K
New chatC
Search everything/
Open fleetF
BoardB
GalleryG
Appearance
Deploy fleetDry run
--brand-hue: 20
renderherov2concept
Agents
Atlas
Nova
Providers
GPT-4o
Claude Sonnet
Gemini 2.0 Flash
Summarize today's agent activity and draft the standup note
Atlas
Wire gateway heartbeatsOPS-27
Roundtable turn-runnerOPS-31
Nightly digest cronOPS-24
Model failover policyOPS-33
Morning — how's the fleet?
Reasoning
query_fleet
Fleet is healthy — 4 of 5 online, p95 down 12% overnight…
Notifications2
Atlas finished a deploy2m
Ava requested your review14m
Sentinel flagged a spike1h
run_querydone
SELECT * FROM agents WHERE status = 'online'
4 rows · 12ms
AAtlasclaude-opus-4Online
NNovagpt-4oOnline
SSolllama-3.1-70bIdle
EEchogemini-2.0-flashOnline
Type a command…⌘K
New chatC
Search everything/
Open fleetF
BoardB
GalleryG
Appearance
Deploy fleetDry run
--brand-hue: 20
renderherov2concept
Agents
Atlas
Nova
Providers
GPT-4o
Claude Sonnet
Gemini 2.0 Flash
Summarize today's agent activity and draft the standup note
Atlas
Wire gateway heartbeatsOPS-27
Roundtable turn-runnerOPS-31
Nightly digest cronOPS-24
Model failover policyOPS-33
You've seen the vibe-coded AI dashboards — a chat pane here, a mismatched settings screen there, a fleet view fighting the sidebar. Herald is the fix: blocks that already speak one language, so your cockpit feels like one product.
01 · Chat
A typed parts[] message model — text, reasoning, tool calls — with hooks that turn any SSE endpoint into a live thread. This one is replaying right now.
Chat PanelMorning — how's the fleet?
02 · Theming
OKLCH tokens, parametric: three CSS variables re-theme every component, ring, and chart. This card obeys the picker — the rest of the page doesn't.
InstallationAccent
oklch(0.64 0.244 27)Hue27°
Intensity81%
Livev1.0
Atlas
Nova
Sol
Ask Atlas anything…
Atlas
03 · Surfaces
Notification bells, model pickers, command bars, agent status — small surfaces with the same typed contracts as the big blocks. These are live; click them.
All componentsNotifications
Model
Type a command…⌘K
New chatC
Open fleetF
BoardB
AT
onlineAtlasOnline
claude-opus-4
Orchestrates the research fleet.
Tasks1,284
Uptime99.9%
04 · Agents
Most people don't hand-build their AI OS — their agents do. Herald ships llms.txt, an Agent Skill, and a registry an agent can drive end to end.
Agents guide you → your agent
> build me a dashboard for my agents — chat, fleet view, and a task board. use herald.
✓ read herald-ui.vercel.app/llms.txt · 101 items
$ npx shadcn add @herald-ui/app-shell @herald-ui/chat-panel @herald-ui/dashboard
✓ 24 files written · deps resolved · wired to your gateway
llms.txt
The catalog in one file.
Agent Skill
Install once, build forever.
Registry
One namespace, deps resolve.
Scale
Buttons and badges, sure — but also the dashboard, the chat surface, and the board. Blocks share typed contracts, so they snap together instead of fighting.
69
components
20
blocks
5
hooks
1
command to install