@termcn

A shadcn/ui-compatible registry of terminal-style UI components for React, built on Ink and OpenTUI for full terminal rendering. Components span charts and data (bar charts, line charts, gauges, heat maps), AI/chat (chat messages, tool approvals, streaming text, thinking blocks), and navigation (command palettes, tabs, menus, sidebars, pagination). Shares the same registry format and CLI as shadcn/ui. Theme-aware, zero-config, free and open source (MIT). Use for: building terminal UIs, CLI tools with rich visual output, or embedding terminal-aesthetic widgets inside web apps that need streaming AI output or chart visualizations.

60 components react shadcn-cli MIT

website ↗ github ↗ registry ↗

Install this registry

shadcn (npm) npx shadcn@latest add https://termcn.vercel.app/r/registry.json

pnpm pnpm dlx shadcn@latest add https://termcn.vercel.app/r/registry.json

bun bunx shadcn@latest add https://termcn.vercel.app/r/registry.json

fetch registry curl -s https://termcn.vercel.app/r/registry.json

Components

60 total

Types file

Shared terminal theme and provider types.

npx shadcn@latest add https://termcn.vercel.app/r/ink/types.json

Alert ui

Alert box with success/error/warning/info variants

npx shadcn@latest add https://termcn.vercel.app/r/ink/alert.json

App Shell ui

Full-screen TUI layout with header, tip bar, full-width input, scrollable content, and hints footer

npx shadcn@latest add https://termcn.vercel.app/r/ink/app-shell.json

Aspect Ratio ui

Constrains children to a given aspect ratio

npx shadcn@latest add https://termcn.vercel.app/r/ink/aspect-ratio.json

Badge ui

Semantic status indicator badge (success/error/warning/info)

npx shadcn@latest add https://termcn.vercel.app/r/ink/badge.json

Banner ui

Full-width announcement banner

npx shadcn@latest add https://termcn.vercel.app/r/ink/banner.json

Bar Chart ui

Horizontal and vertical bar chart with labels

npx shadcn@latest add https://termcn.vercel.app/r/ink/bar-chart.json

Big Text ui

Figlet-style large ASCII art text

npx shadcn@latest add https://termcn.vercel.app/r/ink/big-text.json

Box ui

Enhanced flexbox container with theme-aware borders

npx shadcn@latest add https://termcn.vercel.app/r/ink/box.json

Breadcrumb ui

Breadcrumb navigation trail

npx shadcn@latest add https://termcn.vercel.app/r/ink/breadcrumb.json

Bullet List ui

Nested structured content with ●/└/□ bullet prefixes

npx shadcn@latest add https://termcn.vercel.app/r/ink/bullet-list.json

Card ui

Card with header, body, and footer slots

npx shadcn@latest add https://termcn.vercel.app/r/ink/card.json

Center ui

Centers children horizontally and vertically

npx shadcn@latest add https://termcn.vercel.app/r/ink/center.json

Chat Message ui

Chat message bubble with role label, streaming indicator, and collapsible content

npx shadcn@latest add https://termcn.vercel.app/r/ink/chat-message.json

Chat Thread ui

Scrollable container for stacking ChatMessage components in a conversation thread

npx shadcn@latest add https://termcn.vercel.app/r/ink/chat-thread.json

Checkbox ui

Checkbox with indeterminate state

npx shadcn@latest add https://termcn.vercel.app/r/ink/checkbox.json

Checkbox Group ui

Checkbox group with min/max selection

npx shadcn@latest add https://termcn.vercel.app/r/ink/checkbox-group.json

Clipboard ui

Copy-to-clipboard button with success feedback

npx shadcn@latest add https://termcn.vercel.app/r/ink/clipboard.json

Clock ui

Real-time clock display with 12h/24h and date

npx shadcn@latest add https://termcn.vercel.app/r/ink/clock.json

Code ui

Syntax-highlighted code block (50+ languages)

npx shadcn@latest add https://termcn.vercel.app/r/ink/code.json

Color Picker ui

Color picker with palette, hex, and RGB input

npx shadcn@latest add https://termcn.vercel.app/r/ink/color-picker.json

Columns ui

Multi-column layout with configurable widths

npx shadcn@latest add https://termcn.vercel.app/r/ink/columns.json

Command Palette ui

VS Code–style command palette with fuzzy search

npx shadcn@latest add https://termcn.vercel.app/r/ink/command-palette.json

Confirm ui

Yes/No confirmation prompt

npx shadcn@latest add https://termcn.vercel.app/r/ink/confirm.json

Conversation History ui

Arrow-key scrollable stack for long assistant threads with optional hint

npx shadcn@latest add https://termcn.vercel.app/r/ink/conversation-history.json

Data Grid ui

Advanced data grid with sorting, filtering, pagination, and cell editing

npx shadcn@latest add https://termcn.vercel.app/r/ink/data-grid.json

Date Picker ui

Calendar date picker with keyboard navigation

npx shadcn@latest add https://termcn.vercel.app/r/ink/date-picker.json

Definition ui

Term–description definition list

npx shadcn@latest add https://termcn.vercel.app/r/ink/definition.json

Dialog ui

Confirmation dialog with OK/Cancel actions

npx shadcn@latest add https://termcn.vercel.app/r/ink/dialog.json

Diff View ui

Unified, split, and inline diff viewer with LCS-based diff algorithm and line numbers

npx shadcn@latest add https://termcn.vercel.app/r/ink/diff-view.json

Digits ui

Box-drawing character numerals

npx shadcn@latest add https://termcn.vercel.app/r/ink/digits.json

Directory Tree ui

Filesystem browser with expand/collapse

npx shadcn@latest add https://termcn.vercel.app/r/ink/directory-tree.json

Divider ui

Horizontal or vertical divider / rule

npx shadcn@latest add https://termcn.vercel.app/r/ink/divider.json

Drawer ui

Slide-in panel from any edge

npx shadcn@latest add https://termcn.vercel.app/r/ink/drawer.json

Email Input ui

Email input with validation and domain suggestions

npx shadcn@latest add https://termcn.vercel.app/r/ink/email-input.json

Embedded Terminal ui

Embedded PTY terminal panel (requires node-pty peer)

npx shadcn@latest add https://termcn.vercel.app/r/ink/embedded-terminal.json

Error Boundary ui

React error boundary with graceful terminal display

npx shadcn@latest add https://termcn.vercel.app/r/ink/error-boundary.json

Error Retry ui

Inline error panel with retry, dismiss, and max-retry guard

npx shadcn@latest add https://termcn.vercel.app/r/ink/error-retry.json

File Change ui

Interactive file-change review list with diff expansion, per-file accept/reject actions, and accept-all shortcut

npx shadcn@latest add https://termcn.vercel.app/r/ink/file-change.json

File Picker ui

Interactive file browser and picker

npx shadcn@latest add https://termcn.vercel.app/r/ink/file-picker.json

Form ui

Form container with validation, Ctrl+S submit, and dirty tracking

npx shadcn@latest add https://termcn.vercel.app/r/ink/form.json

Form Field ui

Form field wrapper with label, hint, and error

npx shadcn@latest add https://termcn.vercel.app/r/ink/form-field.json

Gauge ui

Arc/speedometer gauge meter

npx shadcn@latest add https://termcn.vercel.app/r/ink/gauge.json

Git Status ui

Git status display (branch, staged, modified, ahead/behind)

npx shadcn@latest add https://termcn.vercel.app/r/ink/git-status.json

Gradient ui

Color gradient text

npx shadcn@latest add https://termcn.vercel.app/r/ink/gradient.json

Grid ui

Rows × columns grid layout

npx shadcn@latest add https://termcn.vercel.app/r/ink/grid.json

Heading ui

h1–h4 styled headings with optional figlet ASCII art

npx shadcn@latest add https://termcn.vercel.app/r/ink/heading.json

Heat Map ui

Grid heatmap with color intensity scale

npx shadcn@latest add https://termcn.vercel.app/r/ink/heat-map.json

Help ui

Auto-generated help panel from a keymap

npx shadcn@latest add https://termcn.vercel.app/r/ink/help.json

Help Screen ui

Figlet banner + tagline + aligned Options/Commands help sections

npx shadcn@latest add https://termcn.vercel.app/r/ink/help-screen.json

Image ui

Image renderer with iTerm2/Kitty protocol and ASCII fallback

npx shadcn@latest add https://termcn.vercel.app/r/ink/image.json

Info Box ui

Bordered info panel with header, key-value rows, and tree-prefix rows

npx shadcn@latest add https://termcn.vercel.app/r/ink/info-box.json

JSON ui

Pretty-printed JSON with collapsible nodes

npx shadcn@latest add https://termcn.vercel.app/r/ink/json.json

Key Value ui

Aligned key–value pairs

npx shadcn@latest add https://termcn.vercel.app/r/ink/key-value.json

Keyboard Shortcuts ui

Formatted keyboard shortcut reference table

npx shadcn@latest add https://termcn.vercel.app/r/ink/keyboard-shortcuts.json

Line Chart ui

ASCII line chart with axes and multi-series support

npx shadcn@latest add https://termcn.vercel.app/r/ink/line-chart.json

Link ui

OSC 8 clickable hyperlink

npx shadcn@latest add https://termcn.vercel.app/r/ink/link.json

List ui

Navigable list with optional filtering

npx shadcn@latest add https://termcn.vercel.app/r/ink/list.json

Log ui

Scrolling log viewer with severity levels and filtering

npx shadcn@latest add https://termcn.vercel.app/r/ink/log.json

Full-page onboarding/login screen with announcement banner, big ASCII title, description, and numbered select

npx shadcn@latest add https://termcn.vercel.app/r/ink/login-flow.json