sh4dcn
Registries
ActiveFeaturedComponent library (general)51

@roiui

Component library (general) · data updated 2026-07-28

Roi UI (named after the Greek word for flow) is an open-source component library built on Base UI primitives, styled with both CSS Modules and Tailwind CSS, with tasteful Motion (Framer Motion) animations. Components (40+): Accordion, Alert, AlertDialog, Autocomplete, Avatar, Badge, Button, Card, Carousel, Charts, Checkbox, CheckboxGroup, Collapsible, Combobox, Command, ContextMenu, CopyButton, Dialog, Drawer, DropdownMenu, ExpandableCard, Field, Fieldset, Form, Input, Kbd, Menubar, Meter, NavigationMenu, NumberField, OTP Field, Popover, PreviewCard, Progress, Radio, ScrollArea, Select, Separator, Slider, Switch, Table, Tabs, Toast, Toggle, ToggleGroup, Toolbar, Tooltip. Also includes layout Blocks. Fully free and open-source (MIT). Use for: projects preferring Base UI over Radix UI that want subtle, well-crafted animations and a choice of CSS Modules or Tailwind styling.

WebsiteDocsGitHubComponents folderAgent brief (.md)
aestheticaianimationauthbackgroundsblocksbuttonscardschartscomponentsdashboarddesign-systemformshooksloadersmedianavigationoverlaystablestheming

Install

npx shadcn@latest add https://roiui.com/r/registry.json

Health

StatusActive
Last commit3 weeks ago
License—
Open issues0
ArchivedNo
Stars51

Components (124)

utilsutils-tailwindaccordionalert-dialogautocompletealertavatarbackgroundbadgebuttoncardcalendarcarouselcheckboxcheckbox-groupcollapsiblecomboboxcommandcontext-menucopy-buttondialogdrawerdropdown-menuexpandable-cardexpandable-card-carouselfieldfieldsetforminputlike-buttonkbdmenubarmeternavigation-menuotp-fieldpopoverradioscroll-areaselectseparatorsliderswitchtabstabletoasttoggletoggle-grouptoolbartooltipchartprogressprop-tablenumber-fieldslidercard-logincard-taskcard-trafficcard-image-sectionai-chatcard-progress
Components: utils, utils-tailwind, accordion, alert-dialog, autocomplete, alert, avatar, background, badge, button, card, calendar, carousel, checkbox, checkbox-group, collapsible, combobox, command, context-menu, copy-button, dialog, drawer, dropdown-menu, expandable-card, expandable-card-carousel, field, fieldset, form, input, like-button, kbd, menubar, meter, navigation-menu, otp-field, popover, radio, scroll-area, select, separator, slider, switch, tabs, table, toast, toggle, toggle-group, toolbar, tooltip, chart, progress, prop-table, number-field, slider, card-login, card-task, card-traffic, card-image-section, ai-chat, card-progress, pricing-section, kanban-board, accordion-tailwind, alert-tailwind, alert-dialog-tailwind, autocomplete-tailwind, avatar-tailwind, background-tailwind, badge-tailwind, button-tailwind, card-tailwind, calendar-tailwind, carousel-tailwind, checkbox-tailwind, checkbox-group-tailwind, collapsible-tailwind, combobox-tailwind, command-tailwind, context-menu-tailwind, copy-button-tailwind, dialog-tailwind, drawer-tailwind, dropdown-menu-tailwind, field-tailwind, fieldset-tailwind, form-tailwind, input-tailwind, like-button-tailwind, kbd-tailwind, menubar-tailwind, meter-tailwind, navigation-menu-tailwind, otp-field-tailwind, number-field-tailwind, popover-tailwind, preview-card-tailwind, progress-tailwind, prop-table-tailwind, radio-tailwind, scroll-area-tailwind, select-tailwind, separator-tailwind, slider-tailwind, switch-tailwind, tabs-tailwind, table-tailwind, toast-tailwind, toggle-tailwind, toggle-group-tailwind, tooltip-tailwind, toolbar-tailwind, chart-tailwind, ai-chat-tailwind, card-progress-tailwind, card-image-section-tailwind, card-login-tailwind, card-task-tailwind, card-traffic-tailwind, expandable-card-tailwind, expandable-card-carousel-tailwind, pricing-section-tailwind, kanban-board-tailwind, expandable-card-spread, expandable-card-spread-tailwind

Preview

Live sandbox previews render component source client-side. Where a component can’t be rendered standalone, sh4dcn falls back to its source and install command.

@roiui · utils

npx shadcn@latest add https://roiui.com/r/utils.json
View source