# Agentic UI

> React components and full app screens for agentic products: agent fleets, plans, hand-offs, approvals, chat and the moments an agent needs a person. Built on shadcn/ui and Tailwind CSS, installed with the shadcn CLI, so the code lands in your project.

Every link below is a Markdown page written for coding agents. Start with the setup guide, then fetch only the pages for the components you need. Each component page has its install command, import, props and a working example.

## Getting started

- [Setup prompt](https://agentic-ui.effectivelabs.io/docs/setup.md): Everything to add the @agentic-ui registry and theme to a shadcn project and install components, as one set of instructions. Start here.
- [Introduction](https://agentic-ui.effectivelabs.io/docs/introduction.md): What Agentic UI is, why agentic products need their own components, and how it is built.
- [Installation](https://agentic-ui.effectivelabs.io/docs/installation.md): Add the registry and theme to a shadcn/ui project, then install components.
- [Use with AI agents](https://agentic-ui.effectivelabs.io/docs/agents.md): Hand setup to a coding agent and point it at Markdown docs for every component.
- [MCP server](https://agentic-ui.effectivelabs.io/docs/mcp.md): Let your agent browse and install Agentic UI through the shadcn MCP server.
- [Theming](https://agentic-ui.effectivelabs.io/docs/theming.md): The tokens behind done and needs-you states, the status vocabulary and how to customise them.
- [Themes](https://agentic-ui.effectivelabs.io/docs/themes.md): Six colour themes, from Linear-calm to Stripe-polished, each restyling every component at once.
- [Dark mode](https://agentic-ui.effectivelabs.io/docs/dark-mode.md): Every component is tuned for light and dark. Here is how to switch.

## Screens

- [Agent Chat](https://agentic-ui.effectivelabs.io/components/agent-chat.md): Chat with an orchestrating agent while you watch its agents work and fill in the brief beside the conversation.
- [Agent Run](https://agentic-ui.effectivelabs.io/components/agent-run.md): One autonomous agent run: its plan ticking through, the tool calls, an approval it waits on and the draft it produced.
- [Analytics](https://agentic-ui.effectivelabs.io/components/analytics.md): A revenue dashboard: headline figures, revenue by channel, a breakdown, top products and weekly trends.
- [App Shell Flat](https://agentic-ui.effectivelabs.io/components/app-shell-flat.md): The workspace frame laid flat: a tinted sidebar, an edge-to-edge page and the work area, divided by hairlines.
- [App Shell Inset](https://agentic-ui.effectivelabs.io/components/app-shell-inset.md): The workspace frame with the page raised on an inset card, and a resizable work area for tools, a browser and suggested sources.
- [Assistant Home](https://agentic-ui.effectivelabs.io/components/assistant-home.md): An assistant's start page: a greeting, a prompt box with tools and model choice, connected apps and suggested starting points.
- [CRM](https://agentic-ui.effectivelabs.io/components/crm.md): Companies in pipelines, saved views as tabs and an editable table of accounts.
- [Evals](https://agentic-ui.effectivelabs.io/components/evals.md): Prompt evaluations: pass rate by version, prompt changes to review and test cases you can re-run.
- [Folder](https://agentic-ui.effectivelabs.io/components/folder.md): Inside one folder: breadcrumbs, file cards with previews, and a helpful empty state.
- [Folders](https://agentic-ui.effectivelabs.io/components/folders.md): Every folder at a glance, with tabs, search, sorting, a grid or list view and templates to start a new file from.
- [Integrations](https://agentic-ui.effectivelabs.io/components/integrations.md): An app directory with a sticky header, categories, search and clear connect, connecting and connected states.
- [Onboarding](https://agentic-ui.effectivelabs.io/components/onboarding.md): An AI workspace's first run: set up the workspace, connect tools, invite the team and start a first agent, with a getting-started checklist.
- [Settings & Billing](https://agentic-ui.effectivelabs.io/components/settings-billing.md): Workspace settings in tabs: general, members, API keys, and billing with plan, usage, payment method, plan comparison and invoices.

## Agents

- [Agent Checkpoints](https://agentic-ui.effectivelabs.io/components/agent-checkpoints.md): An agent run drawn as a rail of saved checkpoints, where rewinding to any of them starts a new attempt on its own lane and earlier attempts stay visible but faded.
- [Agent Cursors](https://agentic-ui.effectivelabs.io/components/agent-cursors.md): A shared document where agents show up as live pointers with flags, carets, selections, inline suggestions you accept or reject, held images and comment pins.
- [Agent Findings](https://agentic-ui.effectivelabs.io/components/agent-findings.md): Follow a group of agents checking something in parallel, with one progress row per agent and a short live feed of what they find, newest first.
- [Agent Fleet](https://agentic-ui.effectivelabs.io/components/agent-fleet.md): Several agents side by side. Each card sums up its sub-agents; opening one draws its tree beside the column, with answers for sub-agents that need you.
- [Agent Graph](https://agentic-ui.effectivelabs.io/components/agent-graph.md): A live map of agents and the tools and people they call, with a pulse along each link for every call, links that thicken with traffic, and a card per node showing its status, latest calls and cost.
- [Agent Handoff](https://agentic-ui.effectivelabs.io/components/agent-handoff.md): A relay of agents that shows, at every handoff, what went along to the next agent and what got lost, and lets people pass a task further down the line.
- [Agent Inbox](https://agentic-ui.effectivelabs.io/components/agent-inbox.md): A calm board of background agent tasks sorted into Needs you, Running and Done, with live clocks and cards that open in place to their last steps and the next action.
- [Agent Lanes](https://agentic-ui.effectivelabs.io/components/agent-lanes.md): A live timeline with one lane per agent, where tasks grow into now, hand-offs curve between agents and waiting tasks take their decision right on the block.
- [Agent Ledger](https://agentic-ui.effectivelabs.io/components/agent-ledger.md): An audit trail of every change an agent made in your systems, with before and after per row and an honest undo that shows what goes with it and what can never be taken back.
- [Agent Monitor](https://agentic-ui.effectivelabs.io/components/agent-monitor.md): A single agent's run as a card with its current step and clock, the cost so far, a time strip and a record of finished steps, an Allow or Decline prompt showing the exact command, and a compact folded bar.
- [Agent Plan](https://agentic-ui.effectivelabs.io/components/agent-plan.md): A plan an agent proposes before it runs, where people rename, reorder, remove and add steps, then follow each step live with timers and retry from the one that failed.
- [Agent Queue](https://agentic-ui.effectivelabs.io/components/agent-queue.md): A live job queue for agent work that shows what waits, which worker runs what, what finished or failed, and how the backlog grows and drains over time.
- [Agent Recap](https://agentic-ui.effectivelabs.io/components/agent-recap.md): A catch-up for when you come back to agents that kept working: the time away drawn as a small chart with a peak per event, above three lanes (needs you, failed, done) whose cards you can act on, undo and redo where they sit.
- [Agent Steering](https://agentic-ui.effectivelabs.io/components/agent-steering.md): A live plan for a running agent with a note field, so people can queue a correction for the next step or apply it right away and see which step took it in.
- [Agent Tree](https://agentic-ui.effectivelabs.io/components/agent-tree.md): A live tree of an orchestrator and the sub-agents it started, with status, cost and time on every card, branch costs rolled up, foldable branches and a window to answer agents that need you or failed.
- [Approval Card](https://agentic-ui.effectivelabs.io/components/approval-card.md): A consent card where an agent asks before a risky action, with a preview, Approve and Deny shortcuts, an optional pausing countdown and a compact resolved row once decided.
- [Autonomy Dial](https://agentic-ui.effectivelabs.io/components/autonomy-dial.md): A three-level dial that sets how much an agent may do on its own, sorting its real actions into what runs alone and what asks first, with per-action locks.
- [Conflict Radar](https://agentic-ui.effectivelabs.io/components/conflict-radar.md): A file-by-agent grid that shows where parallel agents changed the same lines, lets you keep one agent's approach per conflict, and enables Merge once everything is settled and every agent is done.
- [Context Map](https://agentic-ui.effectivelabs.io/components/context-map.md): An ordered treemap of everything in an agent's context window, with dashed free space, pinnable detail cards and a Before | After view of the last compaction.
- [Context Window](https://agentic-ui.effectivelabs.io/components/context-window.md): A card that shows what fills a model's context as a field of cells, with removable files and a Compact action for the conversation.
- [Decision Tree](https://agentic-ui.effectivelabs.io/components/decision-tree.md): Shows an agent's open decision as a tree of options and their consequences, with the agent's preferred option marked, so a person can pick a branch or write their own instruction.
- [Delegate Board](https://agentic-ui.effectivelabs.io/components/delegate-board.md): A board for handing tasks to a team of agents by drag, keyboard or Auto, where each agent previews its new busy-until time and the cost of taking the task.
- [Fallback Chain](https://agentic-ui.effectivelabs.io/components/fallback-chain.md): Shows one request working down its list of fallback models, with a live light on the model being tried, broken branches for the ones that failed and the answering model joined to the response.
- [Fan-out Grid](https://agentic-ui.effectivelabs.io/components/fan-out-grid.md): A live grid of one cell per task that an agent hands out to many workers, with progress, spend, time left, per-state filters, retry for failures and task details on hover or keyboard.
- [Inline Diff](https://agentic-ui.effectivelabs.io/components/inline-diff.md): Shows an AI rewrite of prose in place as struck and added words that people accept or reject one by one, by key, popover or in bulk, with undo.
- [Memory Panel](https://agentic-ui.effectivelabs.io/components/memory-panel.md): A panel that lists what an assistant remembers about someone, grouped by category, with a master switch, filters, search and in-place edit, pause and forget with Undo.
- [Parallel Attempts](https://agentic-ui.effectivelabs.io/components/parallel-attempts.md): Races several attempts at the same task side by side, scores the finished ones, tags the best and lets you choose which result to use.
- [Permission Request](https://agentic-ui.effectivelabs.io/components/permission-request.md): A card in which an agent asks for one specific right, shows who is asking, why and exactly what will happen, lets you allow it once, for a set time or always, and then folds into a single line with the time left and a way to take the answer back.
- [Plan vs Actual](https://agentic-ui.effectivelabs.io/components/plan-vs-actual.md): Lays an agent run's real step timings over its dashed plan, shows overruns in amber, slides dependent steps later and tracks the expected finish against the planned one.
- [Review Center](https://agentic-ui.effectivelabs.io/components/review-center.md): A keyboard-first workspace where a person works through what agents want to do, one item at a time, with the queue sorted by risk and the agent's uncertain spans marked in place.
- [Scheduled Runs](https://agentic-ui.effectivelabs.io/components/scheduled-runs.md): A week of usage-limited agent sessions that sorts a stack of tasks into the gaps, splits big ones across sessions and lets people drag or keyboard-move each card.
- [Tool Call Card](https://agentic-ui.effectivelabs.io/components/tool-call-card.md): A single agent tool call on one line with a live timer and status, folding open to highlighted arguments and result with copy and retry, plus a group that sums up a turn's calls.
- [Trace Waterfall](https://agentic-ui.effectivelabs.io/components/trace-waterfall.md): A live timeline of an agent run that shows every LLM call, tool call and sub-agent as a bar, with its own time, tokens and cost, plus a details window for each span.

## Chat

- [AI Answer](https://agentic-ui.effectivelabs.io/components/ai-answer.md): A streamed assistant answer that shows the sources it read, cites them with chips that preview each source, and offers copy, regenerate, feedback and follow-up questions.
- [Chat Composer](https://agentic-ui.effectivelabs.io/components/chat-composer.md): An agent prompt box with a model picker, dictation, attachments, app connections and a request for wider access before the agent runs.
- [Cited Answer](https://agentic-ui.effectivelabs.io/components/cited-answer.md): A finished answer whose numbered citations light up the sentences and source chips they belong to and unfold the quoted passage with the matching words marked.
- [Comment Thread](https://agentic-ui.effectivelabs.io/components/comment-thread.md): A single comment and its replies, pinned to a cell or selection, where people can @mention an assistant that answers with a status line you can fold open to see what it changed.
- [Comments Panel](https://agentic-ui.effectivelabs.io/components/comments-panel.md): A comments sidebar with open, resolved and all tabs, a sort menu, resolve toggles, a composer, and /edit comments the agent can run in place.
- [Message Actions](https://agentic-ui.effectivelabs.io/components/message-actions.md): A quiet action bar under an assistant message with copy, regenerate with a version switcher, thumbs feedback with reasons, and read aloud.
- [Model Picker](https://agentic-ui.effectivelabs.io/components/model-picker.md): A composer model switch that compares speed, quality and cost per model, toggles extended thinking with an effort level and web search, and previews first-token time and price before you send.
- [Thinking Loader](https://agentic-ui.effectivelabs.io/components/thinking-loader.md): A compact working indicator that rolls through what the model is doing and settles on a check with how long it took.
- [Thinking State](https://agentic-ui.effectivelabs.io/components/thinking-state.md): A live trail of an assistant's work: a ticking timer, the sources it searched and each thinking step as it lands, ending in a collapsible summary.
- [Writing Assistant](https://agentic-ui.effectivelabs.io/components/writing-assistant.md): A compact writing helper card with suggestion chips, word-by-word streamed replies and live voice dictation over a softly drifting glow.

## Assistant

- [Composer](https://agentic-ui.effectivelabs.io/components/composer.md): assistant-ui's composer bar with attachments, slash commands, mentions, model choice and voice, restyled to the Agentic UI standard.
- [Thread](https://agentic-ui.effectivelabs.io/components/thread.md): assistant-ui's chat thread: messages, actions, branches, attachments and a built-in composer, restyled to the Agentic UI standard.

## Inputs

- [Billing Schedule](https://agentic-ui.effectivelabs.io/components/billing-schedule.md): An editable billing phase with a start date, a duration, catalogue products that bill once or on repeat, an optional discount and minimum commitment, and phase totals that update as you edit.
- [Combobox](https://agentic-ui.effectivelabs.io/components/combobox.md): A searchable, grouped picker for one or many values, with avatar chips, highlighted matches, a create row and full keyboard support.
- [Date Range Picker](https://agentic-ui.effectivelabs.io/components/date-range-picker.md): A range picker with presets, two months, a hover preview of the band and an optional comparison with the previous period or year, applied only when you press Apply.
- [Dropzone](https://agentic-ui.effectivelabs.io/components/dropzone.md): A drop area for several files that shows each upload as a row with a type badge, a progress bar with time left, and Retry for failures.
- [Filter Menu](https://agentic-ui.effectivelabs.io/components/filter-menu.md): A card of collapsible filter groups with checkbox options, removable chips for every active filter, a Clear all action and a single roving tab stop for keyboard use.
- [Integration Settings](https://agentic-ui.effectivelabs.io/components/integration-settings.md): A settings card for one connected service with an on/off switch, API key actions, a validated site address, a time zone picker and a save bar for pending edits.
- [OTP Input](https://agentic-ui.effectivelabs.io/components/otp-input.md): A one-time code field built on a single native input, with a gliding focus ring, paste and SMS autofill, a shake-and-clear error, a Verified pill on success and a resend countdown.
- [Prompt Library](https://agentic-ui.effectivelabs.io/components/prompt-library.md): A searchable list of saved prompt templates where you fill the blanks inline in the sentence, watch the finished prompt build in a tray, and copy or use it once every blank is filled.
- [Stepper Form](https://agentic-ui.effectivelabs.io/components/stepper-form.md): A step-by-step setup form with a checklist of steps, per-step validation, chip and choice-card fields, a review summary and a success state.

## Data display

- [Breakdown Chart](https://agentic-ui.effectivelabs.io/components/breakdown-chart.md): Horizontal stacked bars that split flat records by a chosen measure, slice and segment, with a legend that turns into the hovered bar's breakdown and a linked table repeating every number.
- [Change Summary](https://agentic-ui.effectivelabs.io/components/change-summary.md): A compact card that tells, in words, how each key metric moved over a period, with a small good, bad or neutral trend mark per row.
- [Compact Breakdown](https://agentic-ui.effectivelabs.io/components/compact-breakdown.md): A small card that splits one total into its ranked parts, with a period switch, rolling numbers and a stacked bar that highlights the part you point at.
- [Data Table](https://agentic-ui.effectivelabs.io/components/data-table.md): A small spreadsheet in a card where people pick cells and ranges, edit in place, paste to and from Excel or Google Sheets, sort, check rows and undo every change.
- [Experiment Card](https://agentic-ui.effectivelabs.io/components/experiment-card.md): A compact card for an A/B test that unfolds into variant rows measured against the control, with a metric switch and a winner you can pick and ship.
- [KPI Chart](https://agentic-ui.effectivelabs.io/components/kpi-chart.md): A headline metric card with a signed change and a small multi-line chart whose guide and tooltip follow the pointer or the arrow keys.
- [Usage Meter](https://agentic-ui.effectivelabs.io/components/usage-meter.md): A billing-cycle card that splits credits used by category on one stacked bar, with a daily sparkline, thin meters for plan limits and an upgrade button that turns into a top-up prompt as credits run low.

## Feedback

- [Decision Inbox](https://agentic-ui.effectivelabs.io/components/decision-inbox.md): A tray of the yes-or-no questions your agents are waiting on, where each answer confirms in green and folds away while the count goes down.
- [Notification Stack](https://agentic-ui.effectivelabs.io/components/notification-stack.md): A small pile of dismissible notices where only the front card is readable and the next one rises into place when it is closed.
- [Progress Tracker](https://agentic-ui.effectivelabs.io/components/progress-tracker.md): A short onboarding checklist under a thin progress bar, where ticking a step fills the bar, strikes the label through and can play itself until someone takes over.
- [Setup Guide](https://agentic-ui.effectivelabs.io/components/setup-guide.md): An onboarding panel with an overall progress bar and folding groups of tasks that unlock one after another and strike through when finished.
- [Toaster](https://agentic-ui.effectivelabs.io/components/toaster.md): A stack of short notifications you can raise from anywhere with toast(), which fans out on hover or F8, pauses its timers while you read, and turns promise toasts from a spinner into a check or cross.

## Navigation

- [App Shell](https://agentic-ui.effectivelabs.io/components/app-shell.md): The frame of an AI workspace: a collapsible sidebar with workspace, search, navigation, projects and account, the page, and a resizable work area beside it. Inset or flat.
- [Command Menu](https://agentic-ui.effectivelabs.io/components/command-menu.md): A single search field that finds and runs tool actions and everyday commands, with numbered shortcuts for suggestions and an assistant fallback for anything that doesn't match.
- [Integration Picker](https://agentic-ui.effectivelabs.io/components/integration-picker.md): A command-menu page for finding a service, seeing what it lets agents do and switching its connection on or off without leaving the menu.
- [Profile Menu](https://agentic-ui.effectivelabs.io/components/profile-menu.md): An account card showing the signed-in person, a keyboard-navigable list of account actions and optional profile setup progress with a shortcut to the next step.
- [Segmented Control](https://agentic-ui.effectivelabs.io/components/segmented-control.md): A row of two to six always-visible options with a gliding pill or underline that you can click, drag or arrow through, working as a radiogroup or a tablist.

## Cards

- [Email Draft](https://agentic-ui.effectivelabs.io/components/email-draft.md): A review card for an email an agent wrote: switch the recipient and tone, edit the text in place, drop the attachment, then send or discard with undo.
- [Project Card](https://agentic-ui.effectivelabs.io/components/project-card.md): A compact project summary with a per-subtask progress ring that unfolds in place to tick subtasks, filter by person and change status.
- [Smart Recommendation](https://agentic-ui.effectivelabs.io/components/smart-recommendation.md): A card that puts forward the agent's preferred next step with a written-out confidence signal, a menu of alternatives to switch to, and an accept action you can undo.
- [Tips Panel](https://agentic-ui.effectivelabs.io/components/tips-panel.md): A card of short feature tips, each with a single action that turns the tip into a done state and moves a progress counter.

## Buttons

- [Action Button](https://agentic-ui.effectivelabs.io/components/action-button.md): An action button in primary, secondary, ghost and destructive styles with icons, three sizes and a loading state that keeps the label readable while it sweeps.
- [Reaction Bar](https://agentic-ui.effectivelabs.io/components/reaction-bar.md): A hairline pill of like, comment, repost and share toggles whose icons spring and fill on press while their counts roll to the new number.

## Icons

- [Brand Icon](https://agentic-ui.effectivelabs.io/components/brand-icon.md): Official marks for AI models, providers and coding agents (Claude, Codex, OpenAI, Cursor, Gemini and more), with a helper that finds the brand behind a model name.

## Primitives

The shadcn/ui components, for everything the components above do not cover. Those marked restyled are Agentic UI drop-ins with the same API (`shadcn@latest add @agentic-ui/<name>`); the rest install from shadcn unchanged (`shadcn@latest add <name>`) and take the look from the theme. Each page has the exact command.

- [Accordion](https://agentic-ui.effectivelabs.io/components/accordion.md): Stacked headings that each reveal a section of content.
- [Alert](https://agentic-ui.effectivelabs.io/components/alert.md): A callout that draws attention to a message, with an optional icon.
- [Alert Dialog](https://agentic-ui.effectivelabs.io/components/alert-dialog.md): A modal that interrupts to confirm a consequential action.
- [Aspect Ratio](https://agentic-ui.effectivelabs.io/components/aspect-ratio.md): Keeps media at a fixed width-to-height ratio.
- [Avatar](https://agentic-ui.effectivelabs.io/components/avatar.md): A person's or agent's image, with initials as a fallback.
- [Badge](https://agentic-ui.effectivelabs.io/components/badge.md): A small label for status, counts or categories.
- [Breadcrumb](https://agentic-ui.effectivelabs.io/components/breadcrumb.md): The path to the current page through the hierarchy.
- [Button](https://agentic-ui.effectivelabs.io/components/button.md): The base button in default, secondary, outline, ghost, destructive and link variants. Restyled.
- [Button Group](https://agentic-ui.effectivelabs.io/components/button-group.md): Related buttons joined into one control.
- [Calendar](https://agentic-ui.effectivelabs.io/components/calendar.md): A month grid for picking a date or a range.
- [Card](https://agentic-ui.effectivelabs.io/components/card.md): A bordered surface with header, content and footer slots. Restyled.
- [Carousel](https://agentic-ui.effectivelabs.io/components/carousel.md): Slides you swipe or step through, built on Embla.
- [Chart](https://agentic-ui.effectivelabs.io/components/chart.md): Recharts wrapped with themed colours, tooltips and legends.
- [Checkbox](https://agentic-ui.effectivelabs.io/components/checkbox.md): A box that toggles between checked and unchecked.
- [Collapsible](https://agentic-ui.effectivelabs.io/components/collapsible.md): A panel that expands and collapses.
- [Command](https://agentic-ui.effectivelabs.io/components/command.md): A searchable list of commands, the base of command palettes.
- [Context Menu](https://agentic-ui.effectivelabs.io/components/context-menu.md): A menu that opens on right-click or long-press.
- [Dialog](https://agentic-ui.effectivelabs.io/components/dialog.md): A modal window over the page. Restyled.
- [Drawer](https://agentic-ui.effectivelabs.io/components/drawer.md): A panel that slides up from the bottom edge, made for touch.
- [Dropdown Menu](https://agentic-ui.effectivelabs.io/components/dropdown-menu.md): A menu of actions opened from a button.
- [Empty](https://agentic-ui.effectivelabs.io/components/empty.md): An empty state with an icon, a message and next actions.
- [Field](https://agentic-ui.effectivelabs.io/components/field.md): Label, control, description and error for form fields, with any form library.
- [Hover Card](https://agentic-ui.effectivelabs.io/components/hover-card.md): A preview card shown on hover.
- [Input](https://agentic-ui.effectivelabs.io/components/input.md): A single-line text field. Restyled.
- [Input Group](https://agentic-ui.effectivelabs.io/components/input-group.md): An input with icons, text or buttons attached.
- [Input OTP](https://agentic-ui.effectivelabs.io/components/input-otp.md): Separate boxes for a one-time code.
- [Item](https://agentic-ui.effectivelabs.io/components/item.md): A flexible row with media, title, description and actions.
- [Kbd](https://agentic-ui.effectivelabs.io/components/kbd.md): A keyboard key or shortcut.
- [Label](https://agentic-ui.effectivelabs.io/components/label.md): An accessible label for a form control.
- [Menubar](https://agentic-ui.effectivelabs.io/components/menubar.md): A desktop-style bar of menus.
- [Native Select](https://agentic-ui.effectivelabs.io/components/native-select.md): The browser's own select, styled to match.
- [Navigation Menu](https://agentic-ui.effectivelabs.io/components/navigation-menu.md): Site navigation with dropdown panels.
- [Pagination](https://agentic-ui.effectivelabs.io/components/pagination.md): Links between pages of results.
- [Popover](https://agentic-ui.effectivelabs.io/components/popover.md): Rich content in a floating panel, opened by a button.
- [Progress](https://agentic-ui.effectivelabs.io/components/progress.md): A bar showing how far a task has got.
- [Radio Group](https://agentic-ui.effectivelabs.io/components/radio-group.md): A set of options where one can be chosen.
- [Resizable](https://agentic-ui.effectivelabs.io/components/resizable.md): Panels separated by handles you can drag.
- [Scroll Area](https://agentic-ui.effectivelabs.io/components/scroll-area.md): A scrolling region with styled scrollbars.
- [Select](https://agentic-ui.effectivelabs.io/components/select.md): A list of options in a popover, one of which is chosen. Restyled.
- [Separator](https://agentic-ui.effectivelabs.io/components/separator.md): A thin line between content.
- [Sheet](https://agentic-ui.effectivelabs.io/components/sheet.md): A panel that slides in from an edge of the screen.
- [Sidebar](https://agentic-ui.effectivelabs.io/components/sidebar.md): A composable, collapsible app sidebar.
- [Skeleton](https://agentic-ui.effectivelabs.io/components/skeleton.md): A placeholder shape while content loads.
- [Slider](https://agentic-ui.effectivelabs.io/components/slider.md): Pick a value or range by dragging.
- [Sonner](https://agentic-ui.effectivelabs.io/components/sonner.md): Toast notifications.
- [Spinner](https://agentic-ui.effectivelabs.io/components/spinner.md): An indicator for work in progress.
- [Switch](https://agentic-ui.effectivelabs.io/components/switch.md): A toggle between on and off.
- [Table](https://agentic-ui.effectivelabs.io/components/table.md): Rows and columns of data.
- [Tabs](https://agentic-ui.effectivelabs.io/components/tabs.md): Views of content, one shown at a time. Restyled.
- [Textarea](https://agentic-ui.effectivelabs.io/components/textarea.md): A multi-line text field.
- [Toggle](https://agentic-ui.effectivelabs.io/components/toggle.md): A button that is either on or off.
- [Toggle Group](https://agentic-ui.effectivelabs.io/components/toggle-group.md): A set of toggles, one or many of which can be on.
- [Tooltip](https://agentic-ui.effectivelabs.io/components/tooltip.md): A short label shown on hover or focus.

## Optional

- [Registry index](https://agentic-ui.effectivelabs.io/r/registry.json): The raw shadcn registry; the CLI and the MCP server read it for you.
- Any page as Markdown: add `.md` to a component URL, or send `Accept: text/markdown`.