@kibo-ui
Kibo UI is a composable, accessible, open-source shadcn/ui companion registry providing 41 components and 28 blocks across 1,101 patterns. Notable components include Color Picker, Image Zoom, QR Code, Code Block, Dropzone, and AI chat primitives, going beyond Radix-based shadcn primitives by wrapping more complex headless libraries. Built with React, TypeScript, Tailwind CSS, Lucide, and Radix UI; fully compatible with shadcn/ui CSS variable theming. Free and open source (3.8k GitHub stars). Use for: extending an existing shadcn/ui project with production-ready, higher-order components — especially file handling, data display, and AI chat UI — without rewriting boilerplate.
Install this registry
npx shadcn@latest add https://www.kibo-ui.com/r/registry.json pnpm dlx shadcn@latest add https://www.kibo-ui.com/r/registry.json bunx shadcn@latest add https://www.kibo-ui.com/r/registry.json curl -s https://www.kibo-ui.com/r/registry.json Components
41 totalA compound badge designed to display an announcement.
npx shadcn@latest add https://www.kibo-ui.com/r/announcement.json Avatar Stack is a component that allows you to stack and overlap avatars.
npx shadcn@latest add https://www.kibo-ui.com/r/avatar-stack.json A banner is a full-width component that can be used to show a message and action to the user.
npx shadcn@latest add https://www.kibo-ui.com/r/banner.json The calendar view displays features on a grid calendar. Specifically it shows the end date of each feature, and groups features by day.
npx shadcn@latest add https://www.kibo-ui.com/r/calendar.json Choiceboxes are a great way to show radio or checkbox options with a card style.
npx shadcn@latest add https://www.kibo-ui.com/r/choicebox.json Provides syntax highlighting, line numbers, and copy to clipboard functionality for code blocks.
npx shadcn@latest add https://www.kibo-ui.com/r/code-block.json Allows users to select a color. Modeled after the color picker in Figma.
npx shadcn@latest add https://www.kibo-ui.com/r/color-picker.json Autocomplete input and command palette with a list of suggestions.
npx shadcn@latest add https://www.kibo-ui.com/r/combobox.json A slider-based component for comparing two items in an overlay.
npx shadcn@latest add https://www.kibo-ui.com/r/comparison.json A GitHub-style contribution graph component that displays activity levels over time.
npx shadcn@latest add https://www.kibo-ui.com/r/contribution-graph.json Credit card components for displaying and validating credit card information.
npx shadcn@latest add https://www.kibo-ui.com/r/credit-card.json A cursor component, great for realtime interactive applications.
npx shadcn@latest add https://www.kibo-ui.com/r/cursor.json A Tinder-like swipeable card stack component with smooth animations.
npx shadcn@latest add https://www.kibo-ui.com/r/deck.json Composable stacked dialogs, useful for creating a wizard, nested form or multi-step process. It provides a consistent layout and styling for each dialog, and i…
npx shadcn@latest add https://www.kibo-ui.com/r/dialog-stack.json Allows users to drag-and-drop files into a container to upload or process them.
npx shadcn@latest add https://www.kibo-ui.com/r/dropzone.json The Editor component is a powerful and flexible text editor that allows you to create and edit rich text content.
npx shadcn@latest add https://www.kibo-ui.com/r/editor.json The Gantt chart is a powerful tool for visualizing project schedules and tracking the progress of tasks. It provides a clear, hierarchical view of tasks, allow…
npx shadcn@latest add https://www.kibo-ui.com/r/gantt.json A component that shows a preview of a URL when hovering over a link.
npx shadcn@latest add https://www.kibo-ui.com/r/glimpse.json Helps you crop images to a specific size or aspect ratio.
npx shadcn@latest add https://www.kibo-ui.com/r/image-crop.json Image zoom is a component that allows you to zoom in on an image.
npx shadcn@latest add https://www.kibo-ui.com/r/image-zoom.json A kanban board is a visual tool that helps you manage and visualize your work. It is a board with columns, and each column represents a status, e.g. "Backlog",…
npx shadcn@latest add https://www.kibo-ui.com/r/kanban.json List views are a great way to show a list of tasks grouped by status and ranked by priority.
npx shadcn@latest add https://www.kibo-ui.com/r/list.json Marquees are a great way to show a list of items in a horizontal scrolling motion.
npx shadcn@latest add https://www.kibo-ui.com/r/marquee.json A composable mini calendar component for picking dates close to today.
npx shadcn@latest add https://www.kibo-ui.com/r/mini-calendar.json A flexible badge component designed for a variety of use cases.
npx shadcn@latest add https://www.kibo-ui.com/r/pill.json QR Code is a component that generates a QR code from a string.
npx shadcn@latest add https://www.kibo-ui.com/r/qr-code.json A star rating component with keyboard navigation and hover effects.
npx shadcn@latest add https://www.kibo-ui.com/r/rating.json A composable Reel component that looks like Instagram Stories - a full-height, 9:16 aspect ratio container with video playback and progress indicators.
npx shadcn@latest add https://www.kibo-ui.com/r/reel.json A component that displays time in various timezones.
npx shadcn@latest add https://www.kibo-ui.com/r/relative-time.json The sandbox component allows you to preview and test components in a sandboxed environment.
npx shadcn@latest add https://www.kibo-ui.com/r/sandbox.json Snippet is a component that allows you to display and copy code in a tabbed interface.
npx shadcn@latest add https://www.kibo-ui.com/r/snippet.json A spinner is a visual indicator that shows progress or activity.
npx shadcn@latest add https://www.kibo-ui.com/r/spinner.json Status components are used to display the uptime of a service.
npx shadcn@latest add https://www.kibo-ui.com/r/status.json A composable Stories component - a carousel of individual video cards like you'd see on Facebook.
npx shadcn@latest add https://www.kibo-ui.com/r/stories.json Table views are used to display data in a tabular format. They are useful for displaying large amounts of data in a structured way.
npx shadcn@latest add https://www.kibo-ui.com/r/table.json Tags are a way to apply multiple labels to an item.
npx shadcn@latest add https://www.kibo-ui.com/r/tags.json A component to switch between light, dark and system theme.
npx shadcn@latest add https://www.kibo-ui.com/r/theme-switcher.json A composable finance ticker for displaying symbols, prices and changes.
npx shadcn@latest add https://www.kibo-ui.com/r/ticker.json A composable tree component with animated expand/collapse and customizable nodes.
npx shadcn@latest add https://www.kibo-ui.com/r/tree.json A typography component designed to display text with a consistent style.
npx shadcn@latest add https://www.kibo-ui.com/r/typography.json A composable, shadcn/ui styled video player component that uses the media-chrome library.
npx shadcn@latest add https://www.kibo-ui.com/r/video-player.json