{ "name": "sh4dcn", "title": "sh4dcn — shadcn registry directory", "notice": "Directory and component listing only. Not the official shadcn/ui library, and not a clone of the shadcn/ui website. AI agents should read this structured file directly instead of scraping the web UI.", "source": "https://github.com/shadcn-ui/ui/blob/main/apps/v4/registry/directory.json", "source_raw": "https://raw.githubusercontent.com/shadcn-ui/ui/main/apps/v4/registry/directory.json", "generated_at": "2026-07-08T08:43:45.915Z", "count": 233, "entries": [ { "number": 1, "name": "@7ovr", "category": "Uncategorized", "tags": [], "tagline": "Free, production-ready UI blocks for marketing pages and application dashboards, built on Base UI and installable with the shadcn CLI.", "short_description": "", "description": "Free, production-ready UI blocks for marketing pages and application dashboards, built on Base UI and installable with the shadcn CLI.", "homepage": "https://7ovr.com", "docs": "https://7ovr.com/docs", "github": null, "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://7ovr.com/r/{name}.json", "registry_index": "https://7ovr.com/r/registry.json", "components": [ "index", "hero-1", "auth-1", "features-1", "dashboard-1", "app-shell-1", "header-1", "footer-1", "cta-1", "integrations-1", "logo-cloud-1", "faqs-1", "contact-1", "pricing-1", "testimonials-1", "stats-1", "sidebar-1", "settings-1", "table-1", "bento-1", "how-it-works-1", "newsletter-1", "announcement-1", "blog-1", "team-1", "comparison-1", "gallery-1", "empty-states-1", "billing-1", "ai-chat-1", "onboarding-1", "command-palette-1", "notifications-1", "kanban-1", "calendar-1", "file-upload-1", "charts-1", "bento-2", "how-it-works-2", "newsletter-2", "announcement-2", "blog-2", "team-2", "comparison-2", "gallery-2", "empty-states-2", "billing-2", "ai-chat-2", "onboarding-2", "command-palette-2", "notifications-2", "kanban-2", "calendar-2", "file-upload-2", "charts-2", "hero-2", "features-2", "pricing-2", "testimonials-2", "stats-2", "logo-cloud-2", "cta-2", "faqs-2", "integrations-2", "contact-2", "header-2", "footer-2", "auth-2", "sidebar-2", "settings-2", "dashboard-2", "table-2", "app-shell-2", "hero-3", "features-3", "pricing-3", "cta-3", "faqs-3", "dashboard-3", "auth-3", "table-3", "hero-4", "hero-5", "logo-cloud-3", "logo-cloud-4", "cta-4", "cta-5", "faqs-4", "faqs-5", "footer-3", "footer-4", "newsletter-3", "newsletter-4", "announcement-3", "announcement-4", "auth-4", "auth-5", "empty-states-3", "empty-states-4", "integrations-3" ], "component_items": [ { "name": "index", "type": "registry:style", "title": null, "description": null }, { "name": "hero-1", "type": "registry:block", "title": null, "description": "A hero section with a headline, subheadline, and primary call-to-action." }, { "name": "auth-1", "type": "registry:block", "title": null, "description": "A centered sign-in card with email, password, and social login." }, { "name": "features-1", "type": "registry:block", "title": null, "description": "A feature grid highlighting product capabilities with icons." }, { "name": "dashboard-1", "type": "registry:block", "title": null, "description": "An analytics dashboard with stat cards and a bar chart." }, { "name": "app-shell-1", "type": "registry:block", "title": null, "description": "An application shell with a sidebar, top bar, and content area." }, { "name": "header-1", "type": "registry:block", "title": null, "description": "A full-width site header with logo, navigation links, a call-to-action, and a mobile menu sheet." }, { "name": "footer-1", "type": "registry:block", "title": null, "description": "A site footer with link columns, a brand blurb, and social links." }, { "name": "cta-1", "type": "registry:block", "title": null, "description": "A centered call-to-action band with a heading and buttons." }, { "name": "integrations-1", "type": "registry:block", "title": null, "description": "An integrations grid of connectable services with icons." }, { "name": "logo-cloud-1", "type": "registry:block", "title": null, "description": "A logo cloud of companies that trust the product." }, { "name": "faqs-1", "type": "registry:block", "title": null, "description": "A frequently-asked-questions accordion section." }, { "name": "contact-1", "type": "registry:block", "title": null, "description": "A contact section with contact details and a message form." }, { "name": "pricing-1", "type": "registry:block", "title": null, "description": "A pricing section with three tiers and a highlighted plan." }, { "name": "testimonials-1", "type": "registry:block", "title": null, "description": "A testimonials section with customer quote cards." }, { "name": "stats-1", "type": "registry:block", "title": null, "description": "A stats band highlighting key product metrics." }, { "name": "sidebar-1", "type": "registry:block", "title": null, "description": "An application layout with a navigable left sidebar." }, { "name": "settings-1", "type": "registry:block", "title": null, "description": "A settings page with grouped preference rows and toggles." }, { "name": "table-1", "type": "registry:block", "title": null, "description": "A data table with a toolbar, status cells, and pagination." }, { "name": "bento-1", "type": "registry:block", "title": null, "description": "A bento grid of mixed-size tiles, each with an icon, title, and short description." }, { "name": "how-it-works-1", "type": "registry:block", "title": null, "description": "A three-step 'how it works' row with numbered, iconed steps." }, { "name": "newsletter-1", "type": "registry:block", "title": null, "description": "A centered newsletter signup with an email field and subscribe button." }, { "name": "announcement-1", "type": "registry:block", "title": null, "description": "A dismissible top announcement bar with a message and an inline link." }, { "name": "blog-1", "type": "registry:block", "title": null, "description": "A three-card blog post grid with cover, title, excerpt, and author." }, { "name": "team-1", "type": "registry:block", "title": null, "description": "A team grid of member cards with avatar, name, role, and socials." }, { "name": "comparison-1", "type": "registry:block", "title": null, "description": "A three-column plan comparison table with check and cross marks." }, { "name": "gallery-1", "type": "registry:block", "title": null, "description": "A responsive image gallery grid of evenly sized tiles." }, { "name": "empty-states-1", "type": "registry:block", "title": null, "description": "An inbox-zero empty state for an empty notifications list, with an icon, title, description, and an action." }, { "name": "billing-1", "type": "registry:block", "title": null, "description": "A current-plan billing summary card with price, renewal, and usage." }, { "name": "ai-chat-1", "type": "registry:block", "title": null, "description": "An AI assistant chat thread built on the Message, Bubble, and MessageScroller components, with user and assistant bubbles, avatars, timestamps, auto-follow scr…" }, { "name": "onboarding-1", "type": "registry:block", "title": null, "description": "A welcome onboarding card with a step indicator and a checklist." }, { "name": "command-palette-1", "type": "registry:block", "title": null, "description": "A command palette card with search and grouped command rows." }, { "name": "notifications-1", "type": "registry:block", "title": null, "description": "A notifications panel with read/unread rows and timestamps." }, { "name": "kanban-1", "type": "registry:block", "title": null, "description": "A three-column kanban board with task cards." }, { "name": "calendar-1", "type": "registry:block", "title": null, "description": "A month calendar grid with month navigation, a Today shortcut, selectable days, and a detail panel for the selected day's event." }, { "name": "file-upload-1", "type": "registry:block", "title": null, "description": "A file upload card with a drag-and-drop dropzone and an Attachment list that shows each file with a spinner while uploading and a check when done." }, { "name": "charts-1", "type": "registry:block", "title": null, "description": "An analytics card with a bar chart built on the chart component." }, { "name": "bento-2", "type": "registry:block", "title": null, "description": "A 2x2 equal-tile bento grid with centered heading, where each tile has a square icon, a badge category label, a title, and a one-line description. All four til…" }, { "name": "how-it-works-2", "type": "registry:block", "title": null, "description": "A vertical left-rail timeline that stacks four numbered steps down the page, each with a bordered icon circle, a connecting line to the next step, a monospaced…" }, { "name": "newsletter-2", "type": "registry:block", "title": null, "description": "A full-width horizontal band on a bg-muted panel with branding label, heading, and subtext on the left, and an inline email input plus subscribe button with a …" }, { "name": "announcement-2", "type": "registry:block", "title": null, "description": "A centered card-style product-update callout featuring a \"New\" badge with version label, a bold feature headline, a supporting detail sentence, release metadat…" }, { "name": "blog-2", "type": "registry:block", "title": null, "description": "A minimal blog post list showing five articles as divider-separated rows, each with category badge, date, title, excerpt, author avatar with name, and a ghost …" }, { "name": "team-2", "type": "registry:block", "title": null, "description": "A centered single row of five team members, each showing a large avatar with name and role stacked beneath, under a heading and badge. No cards or bios." }, { "name": "comparison-2", "type": "registry:block", "title": null, "description": "A two-column \"Us vs. Them\" layout with two side-by-side cards. The Acme card lists check rows of product advantages with a primary CTA, while the Others card l…" }, { "name": "gallery-2", "type": "registry:block", "title": null, "description": "A single large browser-framed product screenshot placeholder with a version badge and descriptive caption, plus a five-thumbnail strip beneath it for secondary…" }, { "name": "empty-states-2", "type": "registry:block", "title": null, "description": "An empty inbox state centered in a solid-bordered card panel, featuring a muted illustration placeholder with a decorative box grid and inbox icon, a title and…" }, { "name": "billing-2", "type": "registry:block", "title": null, "description": "A billing invoices card displaying a table of past invoices with invoice number, date, amount, a status badge, and a per-row download link." }, { "name": "ai-chat-2", "type": "registry:block", "title": null, "description": "An AI chat that opens on a suggested-prompt empty state, then switches to a Message and Bubble thread on MessageScroller once a prompt is sent, with a multi-li…" }, { "name": "onboarding-2", "type": "registry:block", "title": null, "description": "A three-card horizontal setup grid where each card presents a numbered onboarding step with an icon, title, short description, and a toggleable action button t…" }, { "name": "command-palette-2", "type": "registry:block", "title": null, "description": "A command palette panel with a search input, a Recent section showing timestamped file/page rows with hover-reveal arrows, and a Results section of icon-label-…" }, { "name": "notifications-2", "type": "registry:block", "title": null, "description": "A compact notifications dropdown panel showing a bell trigger button with an unread badge, a small header with count, four notification rows each with an avata…" }, { "name": "kanban-2", "type": "registry:block", "title": null, "description": "A single \"In Progress\" kanban column rendered as a vertical list of rich task cards, each showing a title, two-line description, priority badge with icon, labe…" }, { "name": "calendar-2", "type": "registry:block", "title": null, "description": "A weekly agenda view showing Mon–Sun with time-slotted event rows, color-coded status borders and dots, and prev/today/next navigation." }, { "name": "file-upload-2", "type": "registry:block", "title": null, "description": "A compact inline file-upload form field with a bordered row and a \"Choose file\" label-trigger, plus an Attachment showing the selected file with its name, size…" }, { "name": "charts-2", "type": "registry:block", "title": null, "description": "An analytics card with a gradient-filled area chart showing a monthly active users trend, topped by a three-KPI summary row (total, peak month, peak count) and…" }, { "name": "hero-2", "type": "registry:block", "title": null, "description": "A split two-column hero with headline, subheadline, and two CTAs on the left, and a framed product-screenshot placeholder (stat cards, bar chart, table) on the…" }, { "name": "features-2", "type": "registry:block", "title": null, "description": "An alternating left/right features layout with three rows, each pairing a copy block (eyebrow, title, body paragraph, and a four-item bullet list) with a decor…" }, { "name": "pricing-2", "type": "registry:block", "title": null, "description": "A two-tier pricing layout with a side-by-side split panel: a filled Pro tier on the left and a plain Starter tier on the right, each showing a price, feature c…" }, { "name": "testimonials-2", "type": "registry:block", "title": null, "description": "A single featured testimonial with a large centered quote, oversized avatar, name and role, and a company logo placeholder. No cards or grid, just a focused sp…" }, { "name": "stats-2", "type": "registry:block", "title": null, "description": "A minimal four-up stat band with oversized numbers and short labels evenly spaced under a single short heading, with no badges, dividers, or secondary copy." } ], "component_count": 174, "components_truncated": true, "component_types": { "registry:style": 1, "registry:block": 173 }, "has_logo": true, "enrichment_errors": [ "github_unresolved" ], "featured": false }, { "number": 1, "name": "@8bitcn", "category": "Animated components", "tags": [ "saas", "dashboard", "aesthetic" ], "tagline": "A set of 8-bit styled retro components. Works with your favorite frameworks. Open Source. Open Code.", "short_description": "A set of 8-bit styled retro components. Works with your favorite frameworks. Open Source. Open Code.", "description": "Open-source retro/8-bit styled React component library with ~35+ components (accordion, alert, avatar, badge, breadcrumb, button, calendar, card, carousel, chart, checkbox, collapsible, combo-box, command, context-menu, date-picker, dialog, drawer, dropdown-menu, enemy-health-display, and more) plus a blocks section. Built on shadcn/ui conventions with Tailwind CSS; install individual pieces via the shadcn CLI. Fully free, MIT-licensed, ~1.9k GitHub stars. Use for: landing pages, game-themed projects, or any app that wants a deliberate pixelated/retro aesthetic without building custom pixel-art CSS from scratch.", "homepage": "https://www.8bitcn.com", "docs": "https://www.8bitcn.com/docs", "github": "https://github.com/TheOrcDev/8bitcn-ui", "components_github": "https://github.com/TheOrcDev/8bitcn-ui/tree/main/components", "github_default_branch": "main", "github_stars": 1936, "last_commit": "2026-07-05T12:08:26Z", "archived": false, "license": "MIT", "open_issues": 16, "registry_template": "https://www.8bitcn.com/r/{name}.json", "registry_index": "https://www.8bitcn.com/r/registry.json", "components": [ "chapter-intro", "button", "input", "toast", "input-otp", "badge", "textarea", "calendar", "date-picker", "card", "carousel", "dialog", "dropdown-menu", "hover-card", "popover", "resizable", "select", "sheet", "label", "checkbox", "scroll-area", "switch", "alert", "alert-dialog", "tooltip", "avatar", "skeleton", "breadcrumb", "collapsible", "progress", "enemy-health-display", "health-bar", "mana-bar", "xp-bar", "game-progress", "dialogue", "profile-card", "slider", "context-menu", "menubar", "toggle", "table", "tabs", "combo-box", "command", "separator", "radio-group", "pagination", "friend-list", "login-form", "login-form-2", "login-form-with-image", "login-page", "chart", "chart-bar", "chart-area-step", "main-menu", "pause-menu", "game-over", "audio-settings", "toggle-group", "sidebar", "accordion", "drawer", "navigation-menu", "difficulty-select", "leaderboard", "player-profile-card", "quest-log", "save-slots", "dashboard-01", "theme-selector", "spinner", "kbd", "retro-mode-switcher", "empty", "item", "character-sheet", "victory-screen", "loading-screen", "hero1", "hero2", "feature1", "hero3", "feature2", "feature3", "pricing1", "pricing2", "faq1", "faq2", "faq3", "social-proof1", "social-proof2", "social-proof3", "timeline1", "timeline2", "timeline3", "cta1", "cta2", "footer1" ], "component_items": [ { "name": "chapter-intro", "type": "registry:block", "title": "8-bit Chapter Intro", "description": "A cinematic chapter/level intro with pixel art background." }, { "name": "button", "type": "registry:component", "title": "8-bit Button", "description": "A simple 8-bit button component" }, { "name": "input", "type": "registry:component", "title": "8-bit Input", "description": "A simple 8-bit input component" }, { "name": "toast", "type": "registry:component", "title": "8-bit Toast", "description": "A simple 8-bit toast component" }, { "name": "input-otp", "type": "registry:component", "title": "8-bit Input-OTP", "description": "A simple 8-bit input-otp component" }, { "name": "badge", "type": "registry:component", "title": "8-bit Badge", "description": "A simple 8-bit badge component" }, { "name": "textarea", "type": "registry:component", "title": "8-bit Textarea", "description": "A simple 8-bit textarea component" }, { "name": "calendar", "type": "registry:component", "title": "8-bit Calendar", "description": "A simple 8-bit calendar component" }, { "name": "date-picker", "type": "registry:component", "title": "8-bit Date Picker", "description": "A simple 8-bit date picker component" }, { "name": "card", "type": "registry:component", "title": "8-bit Card", "description": "A simple 8-bit card component" }, { "name": "carousel", "type": "registry:component", "title": "8-bit Card", "description": "A simple 8-bit carousel component" }, { "name": "dialog", "type": "registry:component", "title": "8-bit Dialog", "description": "A simple 8-bit dialog component" }, { "name": "dropdown-menu", "type": "registry:component", "title": "8-bit Dropdown Menu", "description": "A simple 8-bit dropdown-menu component" }, { "name": "hover-card", "type": "registry:component", "title": "8-bit Hover Card", "description": "A simple 8-bit hover card component" }, { "name": "popover", "type": "registry:component", "title": "8-bit Popover", "description": "A simple 8-bit popover component" }, { "name": "resizable", "type": "registry:component", "title": "8-bit Resizable Panel", "description": "Accessible resizable panel groups and layouts with keyboard support." }, { "name": "select", "type": "registry:component", "title": "8-bit Select", "description": "A simple 8-bit select component" }, { "name": "sheet", "type": "registry:component", "title": "8-bit sheet", "description": "A simple 8-bit sheet component" }, { "name": "label", "type": "registry:component", "title": "8-bit Label", "description": "A simple 8-bit label component" }, { "name": "checkbox", "type": "registry:component", "title": "8-bit Checkbox", "description": "A simple 8-bit checkbox component" }, { "name": "scroll-area", "type": "registry:component", "title": "8-bit Scroll Area", "description": "A simple 8-bit Scroll Area component" }, { "name": "switch", "type": "registry:component", "title": "8-bit Switch", "description": "A simple 8-bit switch component" }, { "name": "alert", "type": "registry:component", "title": "8-bit Alert", "description": "A simple 8-bit switch component" }, { "name": "alert-dialog", "type": "registry:component", "title": "8-bit Alert Dialog", "description": "A simple 8-bit Alert Dialog component" }, { "name": "tooltip", "type": "registry:component", "title": "8-bit Tooltip", "description": "A simple 8-bit tooltip component" }, { "name": "avatar", "type": "registry:component", "title": "8-bit Avatar", "description": "A simple 8-bit avatar component" }, { "name": "skeleton", "type": "registry:component", "title": "8-bit Skeleton", "description": "A simple 8-bit skeleton component" }, { "name": "breadcrumb", "type": "registry:component", "title": "8-bit Breadcrumb", "description": "A simple 8-bit breadcrumb component" }, { "name": "collapsible", "type": "registry:component", "title": "8-bit Collapsible", "description": "A simple 8-bit collapsible component" }, { "name": "progress", "type": "registry:component", "title": "8-bit Progress", "description": "A simple 8-bit progress component" }, { "name": "enemy-health-display", "type": "registry:component", "title": "8-bit Enemy Health Display", "description": "A retro-styled enemy health display component with health bar, name, and level" }, { "name": "health-bar", "type": "registry:component", "title": "8-bit Health Bar", "description": "A simple 8-bit health bar component" }, { "name": "mana-bar", "type": "registry:component", "title": "8-bit Mana Bar", "description": "A simple 8-bit mana bar component" }, { "name": "xp-bar", "type": "registry:component", "title": "8-bit XP Bar", "description": "A simple 8-bit XP bar component with level up animation" }, { "name": "game-progress", "type": "registry:block", "title": "8-bit Game Progress", "description": "A simple 8-bit game progress component" }, { "name": "dialogue", "type": "registry:block", "title": "8-bit Dialogue", "description": "A simple 8-bit dialogue component" }, { "name": "profile-card", "type": "registry:component", "title": "8-bit Profile Card", "description": "A simple 8-bit profile card component" }, { "name": "slider", "type": "registry:component", "title": "8-bit Slider", "description": "A simple 8-bit slider component" }, { "name": "context-menu", "type": "registry:component", "title": "8-bit Context Menu", "description": "A simple 8-bit context menu component" }, { "name": "menubar", "type": "registry:component", "title": "8-bit Menu Bar", "description": "A simple 8-bit menu bar component" }, { "name": "toggle", "type": "registry:component", "title": "8-bit Toggle", "description": "A simple 8-bit toggle component" }, { "name": "table", "type": "registry:component", "title": "8-bit Table", "description": "A simple 8-bit table component" }, { "name": "tabs", "type": "registry:component", "title": "8-bit Tabs", "description": "A simple 8-bit tabs component" }, { "name": "combo-box", "type": "registry:component", "title": "8-bit Combo Box", "description": "A simple 8-bit combo box component" }, { "name": "command", "type": "registry:component", "title": "8-bit Command", "description": "A simple 8-bit command component" }, { "name": "separator", "type": "registry:component", "title": "8-bit Separator", "description": "A simple 8-bit separator component" }, { "name": "radio-group", "type": "registry:component", "title": "8-bit Radio Group", "description": "A simple 8-bit radio group component" }, { "name": "pagination", "type": "registry:component", "title": "8-bit Pagination", "description": "A simple 8-bit pagination component" }, { "name": "friend-list", "type": "registry:block", "title": "8-bit Friend List", "description": "A simple 8-bit friend list component" }, { "name": "login-form", "type": "registry:block", "title": "8-bit Login Form", "description": "A simple 8-bit login form component" }, { "name": "login-form-2", "type": "registry:block", "title": "8-bit Login Form 2", "description": "A simple 8-bit login form component" }, { "name": "login-form-with-image", "type": "registry:block", "title": "8-bit Login Form with Image", "description": "A simple 8-bit login form component with image" }, { "name": "login-page", "type": "registry:page", "title": "8-bit Login Page", "description": "A simple 8-bit login page component" }, { "name": "chart", "type": "registry:block", "title": "8-bit Chart", "description": "A simple 8-bit chart component" }, { "name": "chart-bar", "type": "registry:block", "title": "8-bit Chart Bar", "description": "A simple 8-bit chart bar component" }, { "name": "chart-area-step", "type": "registry:block", "title": "8-bit Chart Area Step", "description": "A simple 8-bit chart area step component" }, { "name": "main-menu", "type": "registry:block", "title": "8-bit Main Menu", "description": "A simple 8-bit main menu component" }, { "name": "pause-menu", "type": "registry:block", "title": "8-bit Pause Menu", "description": "A simple 8-bit pause menu component" }, { "name": "game-over", "type": "registry:block", "title": "8-bit Game Over", "description": "A simple 8-bit game over component" }, { "name": "audio-settings", "type": "registry:block", "title": "8-bit Audio Settings", "description": "A simple 8-bit audio settings component" } ], "component_count": 118, "components_truncated": true, "component_types": { "registry:block": 61, "registry:component": 55, "registry:page": 2 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 2, "name": "@8starlabs-ui", "category": "Niche/single-purpose", "tags": [ "ai", "dashboard", "aesthetic" ], "tagline": "A set of beautifully designed components designed for developers who want niche, high-utility UI elements that you won't find in standard libraries.", "short_description": "A set of beautifully designed components designed for developers who want niche, high-utility UI elements that you won't find in standard libraries.", "description": "Small shadcn-compatible library (10 components) focused on high-utility UI elements absent from standard kits: Button, Flip Clock, Heatmap, JSON Viewer, Marquee, Partition Bar, Scroll Fade, Status Indicator, System Banner, Timeline, and Transport Badge. Targets Next.js + shadcn/ui projects with Tailwind CSS; ships an MCP server for AI-assisted installation. Free, MIT-licensed. Use for: dashboards or admin interfaces that need niche data-display widgets like heatmaps, partition bars, or animated flip clocks without writing them from scratch.", "homepage": "https://ui.8starlabs.com", "docs": "https://ui.8starlabs.com/docs", "github": "https://github.com/8starlabs/ui", "components_github": "https://github.com/8starlabs/ui/tree/main/registry", "github_default_branch": "main", "github_stars": 117, "last_commit": "2026-07-08T08:20:41Z", "archived": false, "license": "MIT", "open_issues": 7, "registry_template": "https://ui.8starlabs.com/r/{name}.json", "registry_index": "https://ui.8starlabs.com/r/registry.json", "components": [ "button", "button-demo", "heatmap", "heatmap-demo", "heatmap-interpolate-demo", "heatmap-display-style-demo", "heatmap-days-of-week-demo", "heatmap-size-demo", "heatmap-custom-colors-demo", "heatmap-custom-display-demo", "partition-bar", "partition-bar-demo", "partition-bar-size-demo", "partition-bar-alignment-demo", "partition-bar-width-demo", "partition-bar-custom-colours-demo", "partition-bar-variants-demo", "flip-clock", "flip-clock-demo", "flip-clock-size-demo", "flip-clock-variants-demo", "flip-clock-countdown-demo", "flip-clock-showdays-demo", "status-indicator", "transport-badge", "system-banner", "status-indicator-demo", "transport-badge-demo-multi-station", "transport-badge-demo-single-station", "transport-badge-demo-sizes", "transport-badge-demo-station-name", "transport-badge-demo", "timeline", "timeline-demo", "timeline-hollow-demo", "timeline-nocards-demo", "timeline-not-alternating-demo", "timeline-vertical-demo", "transport-badge-demo-hk", "scroll-fade", "scroll-fade-demo", "marquee", "marquee-demo", "marquee-grayscale-demo", "marquee-reverse-demo", "json-viewer", "json-viewer-demo", "json-viewer-features-demo", "video-player", "video-player-demo", "video-player-minimal-controls-demo", "video-player-fit-demo", "video-player-sizing-demo", "video-player-repeat-demo", "video-player-auto-demo", "video-player-visible-controls-demo", "video-player-hide-center-controls-demo", "shake", "shake-demo" ], "component_items": [ { "name": "button", "type": "registry:ui", "title": "Button", "description": "A shadcn-compatible button with an optional Stripe-style arrow animation" }, { "name": "button-demo", "type": "registry:example", "title": "Button", "description": "A button demo component" }, { "name": "heatmap", "type": "registry:ui", "title": "Heatmap", "description": "A heatmap component" }, { "name": "heatmap-demo", "type": "registry:example", "title": "Heatmap", "description": "A heatmap demo component" }, { "name": "heatmap-interpolate-demo", "type": "registry:example", "title": "Heatmap", "description": "A heatmap demo component" }, { "name": "heatmap-display-style-demo", "type": "registry:example", "title": "Heatmap", "description": "A heatmap demo component" }, { "name": "heatmap-days-of-week-demo", "type": "registry:example", "title": "Heatmap", "description": "A heatmap demo component" }, { "name": "heatmap-size-demo", "type": "registry:example", "title": "Heatmap", "description": "A heatmap demo component" }, { "name": "heatmap-custom-colors-demo", "type": "registry:example", "title": "Heatmap", "description": "A heatmap demo component" }, { "name": "heatmap-custom-display-demo", "type": "registry:example", "title": "Heatmap", "description": "A heatmap demo component" }, { "name": "partition-bar", "type": "registry:ui", "title": "Partition Bar", "description": "A partition bar component" }, { "name": "partition-bar-demo", "type": "registry:example", "title": "Partition Bar", "description": "A partition bar demo component" }, { "name": "partition-bar-size-demo", "type": "registry:example", "title": "Partition Bar", "description": "A partition bar demo component" }, { "name": "partition-bar-alignment-demo", "type": "registry:example", "title": "Partition Bar", "description": "A partition bar demo component" }, { "name": "partition-bar-width-demo", "type": "registry:example", "title": "Partition Bar", "description": "A partition bar demo component" }, { "name": "partition-bar-custom-colours-demo", "type": "registry:example", "title": "Partition Bar", "description": "A partition bar demo component" }, { "name": "partition-bar-variants-demo", "type": "registry:example", "title": "Partition Bar", "description": "A partition bar demo component" }, { "name": "flip-clock", "type": "registry:ui", "title": "Flip clock", "description": "A flip clock component" }, { "name": "flip-clock-demo", "type": "registry:example", "title": "Flip clock", "description": "A flip clock demo component" }, { "name": "flip-clock-size-demo", "type": "registry:example", "title": "Flip clock", "description": "A flip clock demo component" }, { "name": "flip-clock-variants-demo", "type": "registry:example", "title": "Flip clock", "description": "A flip clock demo component" }, { "name": "flip-clock-countdown-demo", "type": "registry:example", "title": "Flip clock", "description": "A flip clock demo component" }, { "name": "flip-clock-showdays-demo", "type": "registry:example", "title": "Flip clock", "description": "A flip clock demo component" }, { "name": "status-indicator", "type": "registry:ui", "title": "Status indicator", "description": "A status indicator component" }, { "name": "transport-badge", "type": "registry:ui", "title": "Transport badge", "description": "A transport badge component" }, { "name": "system-banner", "type": "registry:ui", "title": "System banner", "description": "A system banner component" }, { "name": "status-indicator-demo", "type": "registry:example", "title": "Status indicator demo", "description": "A status indicator demo component" }, { "name": "transport-badge-demo-multi-station", "type": "registry:example", "title": "Transport badge demo multi station", "description": "A transport badge demo multi station component" }, { "name": "transport-badge-demo-single-station", "type": "registry:example", "title": "Transport badge demo single station", "description": "A transport badge demo single station component" }, { "name": "transport-badge-demo-sizes", "type": "registry:example", "title": "Transport badge demo sizes", "description": "A transport badge demo sizes component" }, { "name": "transport-badge-demo-station-name", "type": "registry:example", "title": "Transport badge demo station name", "description": "A transport badge demo station name component" }, { "name": "transport-badge-demo", "type": "registry:example", "title": "Transport badge demo", "description": "A transport badge demo component" }, { "name": "timeline", "type": "registry:ui", "title": "Timeline component", "description": "A timeline component" }, { "name": "timeline-demo", "type": "registry:example", "title": "Timeline demo", "description": "A timeline demo component" }, { "name": "timeline-hollow-demo", "type": "registry:example", "title": "Timeline hollow demo", "description": "A timeline hollow demo component" }, { "name": "timeline-nocards-demo", "type": "registry:example", "title": "Timeline no cards demo", "description": "A timeline no cards demo component" }, { "name": "timeline-not-alternating-demo", "type": "registry:example", "title": "Timeline not alternating demo", "description": "A timeline not alternating demo component" }, { "name": "timeline-vertical-demo", "type": "registry:example", "title": "Timeline vertical demo", "description": "A timeline vertical demo component" }, { "name": "transport-badge-demo-hk", "type": "registry:example", "title": "Transport Badge Demo HK", "description": "A transport badge demo for Hong Kong MTR" }, { "name": "scroll-fade", "type": "registry:ui", "title": "Scroll Fade component", "description": "A scroll fade component" }, { "name": "scroll-fade-demo", "type": "registry:example", "title": "Scroll Fade Demo", "description": "A scroll fade demo component" }, { "name": "marquee", "type": "registry:ui", "title": "Marquee component", "description": "A marquee component" }, { "name": "marquee-demo", "type": "registry:example", "title": "Marquee Demo", "description": "A marquee demo component" }, { "name": "marquee-grayscale-demo", "type": "registry:example", "title": "Marquee Grayscale Demo", "description": "A marquee grayscale demo component" }, { "name": "marquee-reverse-demo", "type": "registry:example", "title": "Marquee Reverse Demo", "description": "A marquee reverse demo component" }, { "name": "json-viewer", "type": "registry:ui", "title": "JSON Viewer", "description": "A JSON viewer component" }, { "name": "json-viewer-demo", "type": "registry:example", "title": "JSON Viewer", "description": "A JSON viewer demo component" }, { "name": "json-viewer-features-demo", "type": "registry:example", "title": "JSON Viewer Features", "description": "A JSON viewer demo showcasing features like line numbers, color indentation, and truncation" }, { "name": "video-player", "type": "registry:ui", "title": "Video Player", "description": "A video player component" }, { "name": "video-player-demo", "type": "registry:example", "title": "Video Player", "description": "A video player demo component" }, { "name": "video-player-minimal-controls-demo", "type": "registry:example", "title": "Video Player Minimal Controls", "description": "A video player demo component with minimal controls" }, { "name": "video-player-fit-demo", "type": "registry:example", "title": "Video Player Fit", "description": "A video player demo showing fit behavior" }, { "name": "video-player-sizing-demo", "type": "registry:example", "title": "Video Player Sizing", "description": "A video player demo showing viewport sizing" }, { "name": "video-player-repeat-demo", "type": "registry:example", "title": "Video Player Repeat", "description": "A video player demo showing repeat playback" }, { "name": "video-player-auto-demo", "type": "registry:example", "title": "Video Player Autoplay", "description": "A video player demo showing autoplay" }, { "name": "video-player-visible-controls-demo", "type": "registry:example", "title": "Video Player Visible Controls", "description": "A video player demo showing always-visible controls" }, { "name": "video-player-hide-center-controls-demo", "type": "registry:example", "title": "Video Player Hidden Center Controls", "description": "A video player demo without center controls." }, { "name": "shake", "type": "registry:ui", "title": "Shake", "description": "A Stripe-style perspective error shake for form fields, with a declarative wrapper and an imperative hook" }, { "name": "shake-demo", "type": "registry:example", "title": "Shake Demo", "description": "A shake demo component" } ], "component_count": 59, "components_truncated": false, "component_types": { "registry:ui": 13, "registry:example": 46 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 3, "name": "@abstract", "category": "Crypto/web3", "tags": [ "ai" ], "tagline": "A collection of React components for the most common crypto patterns", "short_description": "A collection of React components for the most common crypto patterns", "description": "Official AGW Reusables registry from Abstract Foundation for building on the Abstract Global Wallet (AGW) chain. Components cover: AGWProvider (session setup), ConnectWalletButton, SIWEButton (Sign-In with Ethereum), OnboardingDialog, CreateSessionKeyButton, AbstractProfile, AbstractAppVoting, and config utilities for abstract contracts and AI rule files. Built on shadcn/ui + Next.js; requires the @abstract-foundation/agw-react SDK. Free, open-source. Use for: any Abstract-chain dApp front-end that needs wallet connection, SIWE auth, and session-key management UI out of the box.", "homepage": "https://build.abs.xyz", "docs": "https://build.abs.xyz/docs", "github": "https://github.com/Abstract-Foundation/agw-reusables", "components_github": "https://github.com/Abstract-Foundation/agw-reusables/tree/main/registry", "github_default_branch": "main", "github_stars": 14, "last_commit": "2025-12-12T03:33:49Z", "archived": false, "license": null, "open_issues": 1, "registry_template": "https://build.abs.xyz/r/{name}/json", "registry_index": "https://build.abs.xyz/registry.json", "components": [ "connect-wallet-button", "abstract-profile", "agw-provider", "siwe-button", "session-keys", "onboarding-dialog", "portfolio-chart", "use-optimistic-write-contract", "abstract-contracts", "abstract-app-voting", "nft-card", "cursor-ai-config", "claude-config" ], "component_items": [ { "name": "connect-wallet-button", "type": "registry:component", "title": "Connect Wallet Button", "description": "A connect wallet button using Abstract Global Wallet with dropdown menu when connected" }, { "name": "abstract-profile", "type": "registry:component", "title": "Abstract Profile", "description": "A profile component that displays user profile pictures from Abstract Portal with tier-based styling and loading states" }, { "name": "agw-provider", "type": "registry:component", "title": "AGW Provider", "description": "Provider component that wraps your application with Abstract Global Wallet and React Query" }, { "name": "siwe-button", "type": "registry:component", "title": "SIWE Button", "description": "A streamlined SIWE authentication button that handles wallet connection, message signing, and authentication state" }, { "name": "session-keys", "type": "registry:component", "title": "Session Key Button", "description": "A comprehensive session key management button that handles creation, validation, and revocation of Abstract Global Wallet session keys" }, { "name": "onboarding-dialog", "type": "registry:component", "title": "Onboarding Dialog", "description": "A configurable multi-step onboarding dialog that guides users through AGW authentication (wallet connection, SIWE, session keys) with progress indication" }, { "name": "portfolio-chart", "type": "registry:component", "title": "Portfolio Chart", "description": "An interactive area chart that displays Abstract Global Wallet portfolio value over time with multiple time period selections" }, { "name": "use-optimistic-write-contract", "type": "registry:hook", "title": "Optimistic Transactions", "description": "An experimental hook for optimistic transaction execution using Abstract's unstable_sendRawTransactionWithDetailedOutput endpoint to get instant transaction fe…" }, { "name": "abstract-contracts", "type": "registry:lib", "title": "Abstract Contracts", "description": "Configuration for common Abstract network contract addresses and ABIs for tokens and DEX infrastructure" }, { "name": "abstract-app-voting", "type": "registry:component", "title": "Abstract App Voting", "description": "A voting button for Abstract apps that checks vote status and submits votes via Abstract Global Wallet" }, { "name": "nft-card", "type": "registry:component", "title": "NFT Card", "description": "A single NFT card component that displays an NFT with image, name, collection, and balance" }, { "name": "cursor-ai-config", "type": "registry:lib", "title": "Cursor AI Configuration", "description": "Cursor project rules and MCP configuration optimized for Abstract ecosystem development with AGW, wagmi, and Next.js" }, { "name": "claude-config", "type": "registry:lib", "title": "Claude Code Configuration", "description": "Claude Code project instructions and MCP server configuration optimized for Abstract ecosystem development with AGW, wagmi, and Next.js" } ], "component_count": 13, "components_truncated": false, "component_types": { "registry:component": 9, "registry:hook": 1, "registry:lib": 3 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 4, "name": "@abui", "category": "Component library (general)", "tags": [ "dashboard", "aesthetic", "components" ], "tagline": "A shadcn-compatible registry of reusable components, blocks, and utilities conforming to Vercel's components.build specification", "short_description": "A shadcn-compatible registry of reusable components, blocks, and utilities conforming to Vercel's components.build specification", "description": "Personal shadcn-compatible registry by Antonio Brandao conforming to Vercel's components.build specification. Includes blocks (Timeline/Gantt, Availability Calendar, Scroll Reveal, Animated Chart), components (Breakpoint Display, Radio Tabs, Radio Rows, Color Swatch Selector, Label Selector, Spinner, Scroll Progress, Text Gradient, Accordion Multiselect, Timeline Steps, Table of Contents), and utility CSS helpers (Orientation Media Queries, Extra Breakpoints, Debug Utils). Free, open-source. Use for: projects that need Gantt-style timelines, scroll-progress indicators, or composable selector patterns not covered by core shadcn/ui.", "homepage": "https://abui.io", "docs": "https://abui.io", "github": "https://github.com/antoniobrandao/abui", "components_github": "https://github.com/antoniobrandao/abui/tree/master/registry", "github_default_branch": "master", "github_stars": 46, "last_commit": "2025-12-15T17:58:44Z", "archived": false, "license": null, "open_issues": 0, "registry_template": "https://abui.io/r/{name}.json", "registry_index": "https://abui.io/r/registry.json", "components": [ "design-system", "orientation-media-queries", "extra-breakpoints", "debug-utils", "breakpoint-display", "radio-tabs", "radio-rows", "color-swatch-selector", "label-selector", "spinner", "scroll-progress", "text-gradient", "timeline", "availability", "calendar-year", "accordion-multiselect", "scroll-reveal-content-a", "timeline-steps", "toc", "animated-chart" ], "component_items": [ { "name": "design-system", "type": "registry:style", "title": null, "description": null }, { "name": "orientation-media-queries", "type": "registry:style", "title": "Orientation Media Queries", "description": "A set of device orientation media queries." }, { "name": "extra-breakpoints", "type": "registry:style", "title": "Extra Breakpoints", "description": "Adds XS, XXS and 3XL breakpoints." }, { "name": "debug-utils", "type": "registry:style", "title": "Debug Utils", "description": "A set of debug utility classes." }, { "name": "breakpoint-display", "type": "registry:component", "title": "Breakpoint Display", "description": "A breakpoint display component." }, { "name": "radio-tabs", "type": "registry:component", "title": "Radio Tabs", "description": "A radio tabs component." }, { "name": "radio-rows", "type": "registry:component", "title": "Radio Rows", "description": "A radio rows component." }, { "name": "color-swatch-selector", "type": "registry:component", "title": "Color Swatch Selector", "description": "A color swatch selector component." }, { "name": "label-selector", "type": "registry:component", "title": "Label Selector", "description": "A text label selector component for sizes, variants, and other text-based options." }, { "name": "spinner", "type": "registry:component", "title": "Spinner", "description": "A customizable loading spinner component with size, speed, and color variants." }, { "name": "scroll-progress", "type": "registry:component", "title": "Scroll Progress", "description": "A scroll progress indicator that shows reading progress as a horizontal bar at the top or bottom of the viewport." }, { "name": "text-gradient", "type": "registry:component", "title": "Text Gradient", "description": "A text gradient effect component." }, { "name": "timeline", "type": "registry:block", "title": "Timeline", "description": "A Gantt-chart style timeline with draggable time slots." }, { "name": "availability", "type": "registry:block", "title": "Availability", "description": "A weekly availability designer with draggable and resizable time slots." }, { "name": "calendar-year", "type": "registry:block", "title": "Calendar Year", "description": "A calendar year component." }, { "name": "accordion-multiselect", "type": "registry:component", "title": "Accordion Multiselect", "description": "An accordion multiselect component with categories and services." }, { "name": "scroll-reveal-content-a", "type": "registry:block", "title": "Scroll Reveal Content A", "description": "A block that shows 3 parts of content with a specific image for each part, and a fancy line grow expand during scroll." }, { "name": "timeline-steps", "type": "registry:component", "title": "Timeline Steps", "description": "A component for displaying chronological events, activities, or steps" }, { "name": "toc", "type": "registry:component", "title": "Table of Contents", "description": "A table of contents component with active anchor tracking and depth-aware line styling. Features two variants: default (straight line) and clerk (depth-respons…" }, { "name": "animated-chart", "type": "registry:block", "title": "Animated Chart", "description": "An animated column chart with spring physics, viewport-triggered animations, and support for dynamic data transitions." } ], "component_count": 20, "components_truncated": false, "component_types": { "registry:style": 4, "registry:component": 11, "registry:block": 5 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 5, "name": "@aceternity", "category": "Animated components", "tags": [ "saas", "aesthetic" ], "tagline": "A modern component library built with Tailwind CSS and Motion for React, Aceternity UI contains unique and interactive components that can make your landing pages look 100x better.", "short_description": "A modern component library built with Tailwind CSS and Motion for React, Aceternity UI contains unique and interactive components that can make your landing pages look 100x better.", "description": "Popular copy-paste React component library with 200+ animated, visually striking components and blocks built with Tailwind CSS and Framer Motion (Motion for React). Notable components include: background beams/boxes/lines/aurora, sparkles, vortex, spotlight, canvas reveal effect, 3D card effect, card stack, sticky scroll reveal, tracing beam, lamp effect, wobble card, infinite moving cards, parallax scroll, and many more. Freemium: most components are free; a paid All-Access tier unlocks premium blocks and templates. Targets Next.js + Tailwind CSS v3. Use for: SaaS or portfolio landing pages that need high-impact animated sections without a design team.", "homepage": "https://ui.aceternity.com", "docs": "https://ui.aceternity.com", "github": "https://github.com/aceternity", "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://ui.aceternity.com/registry/{name}.json", "registry_index": "https://ui.aceternity.com/registry/registry.json", "components": [ "grid", "moving-line", "sparkles", "spotlight", "glowing-stars", "text-reveal-card", "animated-tooltip", "following-pointer", "background-beams", "svg-mask-effect", "infinite-moving-cards", "3d-pin", "evervault-card", "parallax-scroll", "parallax-scroll-2", "parallax-hero-images", "tracing-beam", "container-scroll-animation", "text-generate-effect", "meteors", "card-stack", "moving-border", "lamp", "sticky-scroll-reveal", "floating-navbar", "navbar-menu", "tailwindcss-buttons", "bento-grid", "card-hover-effect", "google-gemini-effect", "gooey-input", "typewriter-effect", "background-boxes", "3d-card", "images-slider", "direction-aware-hover", "tabs", "hero-parallax", "wavy-background", "background-gradient", "layout-grid", "background-gradient-animation", "macbook-scroll", "input", "label", "multi-step-loader", "globe", "aurora-background", "canvas-reveal-effect", "hover-border-gradient", "hero-highlight", "vortex", "wobble-card", "placeholders-and-vanish-input", "flip-words", "link-preview", "glare-card", "animated-modal", "sidebar", "apple-cards-carousel", "shooting-stars", "stars-background", "compare", "card-spotlight", "cover", "file-upload", "floating-dock", "focus-cards", "background-beams-with-collision", "timeline", "text-hover-effect", "lens", "background-lines", "animated-testimonials", "world-map", "code-block", "carousel", "colourful-text", "squiggly-text", "magnetic-button", "notch", "spotlight-new", "glowing-effect", "3d-marquee", "container-text-flip", "resizable-navbar", "draggable-card", "sticky-banner", "pointer-highlight", "stateful-button", "loader", "comet-card", "background-ripple-effect", "pixelated-canvas", "canvas-text", "layout-text-flip", "dotted-glow-background", "tooltip-card", "encrypted-text", "noise-background" ], "component_items": [ { "name": "grid", "type": "registry:ui", "title": null, "description": null }, { "name": "moving-line", "type": "registry:ui", "title": null, "description": null }, { "name": "sparkles", "type": "registry:ui", "title": null, "description": null }, { "name": "spotlight", "type": "registry:ui", "title": null, "description": null }, { "name": "glowing-stars", "type": "registry:ui", "title": null, "description": null }, { "name": "text-reveal-card", "type": "registry:ui", "title": null, "description": null }, { "name": "animated-tooltip", "type": "registry:ui", "title": null, "description": null }, { "name": "following-pointer", "type": "registry:ui", "title": null, "description": null }, { "name": "background-beams", "type": "registry:ui", "title": null, "description": null }, { "name": "svg-mask-effect", "type": "registry:ui", "title": null, "description": null }, { "name": "infinite-moving-cards", "type": "registry:ui", "title": null, "description": null }, { "name": "3d-pin", "type": "registry:ui", "title": null, "description": null }, { "name": "evervault-card", "type": "registry:ui", "title": null, "description": null }, { "name": "parallax-scroll", "type": "registry:ui", "title": null, "description": null }, { "name": "parallax-scroll-2", "type": "registry:ui", "title": null, "description": null }, { "name": "parallax-hero-images", "type": "registry:ui", "title": null, "description": null }, { "name": "tracing-beam", "type": "registry:ui", "title": null, "description": null }, { "name": "container-scroll-animation", "type": "registry:ui", "title": null, "description": null }, { "name": "text-generate-effect", "type": "registry:ui", "title": null, "description": null }, { "name": "meteors", "type": "registry:ui", "title": null, "description": null }, { "name": "card-stack", "type": "registry:ui", "title": null, "description": null }, { "name": "moving-border", "type": "registry:ui", "title": null, "description": null }, { "name": "lamp", "type": "registry:ui", "title": null, "description": null }, { "name": "sticky-scroll-reveal", "type": "registry:ui", "title": null, "description": null }, { "name": "floating-navbar", "type": "registry:ui", "title": null, "description": null }, { "name": "navbar-menu", "type": "registry:ui", "title": null, "description": null }, { "name": "tailwindcss-buttons", "type": "registry:ui", "title": null, "description": null }, { "name": "bento-grid", "type": "registry:ui", "title": null, "description": null }, { "name": "card-hover-effect", "type": "registry:ui", "title": null, "description": null }, { "name": "google-gemini-effect", "type": "registry:ui", "title": null, "description": null }, { "name": "gooey-input", "type": "registry:ui", "title": null, "description": null }, { "name": "typewriter-effect", "type": "registry:ui", "title": null, "description": null }, { "name": "background-boxes", "type": "registry:ui", "title": null, "description": null }, { "name": "3d-card", "type": "registry:ui", "title": null, "description": null }, { "name": "images-slider", "type": "registry:ui", "title": null, "description": null }, { "name": "direction-aware-hover", "type": "registry:ui", "title": null, "description": null }, { "name": "tabs", "type": "registry:ui", "title": null, "description": null }, { "name": "hero-parallax", "type": "registry:ui", "title": null, "description": null }, { "name": "wavy-background", "type": "registry:ui", "title": null, "description": null }, { "name": "background-gradient", "type": "registry:ui", "title": null, "description": null }, { "name": "layout-grid", "type": "registry:ui", "title": null, "description": null }, { "name": "background-gradient-animation", "type": "registry:ui", "title": null, "description": null }, { "name": "macbook-scroll", "type": "registry:ui", "title": null, "description": null }, { "name": "input", "type": "registry:ui", "title": null, "description": null }, { "name": "label", "type": "registry:ui", "title": null, "description": null }, { "name": "multi-step-loader", "type": "registry:ui", "title": null, "description": null }, { "name": "globe", "type": "registry:ui", "title": null, "description": null }, { "name": "aurora-background", "type": "registry:ui", "title": null, "description": null }, { "name": "canvas-reveal-effect", "type": "registry:ui", "title": null, "description": null }, { "name": "hover-border-gradient", "type": "registry:ui", "title": null, "description": null }, { "name": "hero-highlight", "type": "registry:ui", "title": null, "description": null }, { "name": "vortex", "type": "registry:ui", "title": null, "description": null }, { "name": "wobble-card", "type": "registry:ui", "title": null, "description": null }, { "name": "placeholders-and-vanish-input", "type": "registry:ui", "title": null, "description": null }, { "name": "flip-words", "type": "registry:ui", "title": null, "description": null }, { "name": "link-preview", "type": "registry:ui", "title": null, "description": null }, { "name": "glare-card", "type": "registry:ui", "title": null, "description": null }, { "name": "animated-modal", "type": "registry:ui", "title": null, "description": null }, { "name": "sidebar", "type": "registry:ui", "title": null, "description": null }, { "name": "apple-cards-carousel", "type": "registry:ui", "title": null, "description": null } ], "component_count": 270, "components_truncated": true, "component_types": { "registry:ui": 109, "registry:block": 161 }, "has_logo": true, "enrichment_errors": [ "github_lookup_failed" ], "featured": true }, { "number": 6, "name": "@aevr", "category": "Component library (general)", "tags": [ "components" ], "tagline": "A small collection of focused, production‑ready components and primitives for React/Next.js projects—built on shadcn/ui and complementary libraries.", "short_description": "A small collection of focused, production‑ready components and primitives for React/Next.js projects—built on shadcn/ui and complementary libraries.", "description": "Small personal registry of focused production-ready React/Next.js components built on shadcn/ui. Documented components include info-box, button, and card, with additional pieces accessible at the registry URL. Designed to complement rather than replace shadcn/ui core, targeting Tailwind CSS projects. Free, open-source. Use for: supplementing an existing shadcn/ui project with a small set of production-polished primitives when the core library lacks the specific variant needed.", "homepage": "https://ui.aevr.space", "docs": "https://ui.aevr.space", "github": "https://github.com/aevrHQ/ui", "components_github": "https://github.com/aevrHQ/ui/tree/main/registry", "github_default_branch": "main", "github_stars": 6, "last_commit": "2026-02-27T03:48:55Z", "archived": false, "license": null, "open_issues": 0, "registry_template": "https://ui.aevr.space/r/{name}.json", "registry_index": null, "components": [], "component_items": [], "component_count": null, "components_truncated": false, "component_types": {}, "has_logo": true, "enrichment_errors": [ "registry_index_unresolved" ], "featured": false }, { "number": 8, "name": "@agentcn", "category": "Uncategorized", "tags": [], "tagline": "Production-ready agents, made simple. Ready to use, customizable AI agent recipes. Built on Eve and Flue.", "short_description": "", "description": "Production-ready agents, made simple. Ready to use, customizable AI agent recipes. Built on Eve and Flue.", "homepage": "https://agentcn.vercel.app", "docs": "https://agentcn.vercel.app/docs", "github": "https://github.com/shadcn-labs/agentcn", "components_github": "https://github.com/shadcn-labs/agentcn/tree/main/registry", "github_default_branch": "main", "github_stars": 341, "last_commit": "2026-07-05T08:56:47Z", "archived": false, "license": "MIT", "open_issues": 4, "registry_template": "https://agentcn.vercel.app/r/{name}.json", "registry_index": "https://agentcn.vercel.app/r/registry.json", "components": [ "eve/ai-seo-audit", "eve/browser-agent", "eve/chat-with-pdf", "eve/chat-with-youtube", "eve/claw", "eve/company-knowledge", "eve/csv-to-questions", "eve/deep-search", "eve/docs-chatbot", "eve/docs-expert", "eve/extract-design-md", "eve/feedback-summary", "eve/flashcards-pdf", "eve/github-review", "eve/google-sheets", "eve/meeting-notes", "eve/slack-agent", "eve/text-to-sql", "eve/weather", "flue/ai-seo-audit", "flue/browser-agent", "flue/chat-with-pdf", "flue/chat-with-youtube", "flue/claw", "flue/company-knowledge", "flue/csv-to-questions", "flue/deep-search", "flue/docs-chatbot", "flue/docs-expert", "flue/extract-design-md", "flue/feedback-summary", "flue/flashcards-pdf", "flue/github-review", "flue/google-sheets", "flue/meeting-notes", "flue/slack-agent", "flue/text-to-sql", "flue/weather", "mastra/ai-seo-audit", "mastra/browser-agent", "mastra/chat-with-pdf", "mastra/chat-with-youtube", "mastra/claw", "mastra/company-knowledge", "mastra/csv-to-questions", "mastra/deep-search", "mastra/docs-chatbot", "mastra/docs-expert", "mastra/extract-design-md", "mastra/feedback-summary", "mastra/flashcards-pdf", "mastra/github-review", "mastra/google-sheets", "mastra/meeting-notes", "mastra/slack-agent", "mastra/text-to-sql", "mastra/weather" ], "component_items": [ { "name": "eve/ai-seo-audit", "type": "registry:block", "title": "AI SEO Audit Agent", "description": "Eve agent that runs a deterministic AI-SEO audit on a page through context.dev — scoring ~30 checks across six categories into a 0–100 total and returning fail…" }, { "name": "eve/browser-agent", "type": "registry:block", "title": "Browser Agent", "description": "Eve agent that drives a real browser with Playwright using a snapshot-and-selector pattern to complete web tasks." }, { "name": "eve/chat-with-pdf", "type": "registry:block", "title": "Chat with PDF Agent", "description": "Eve agent that indexes a PDF into a vector store and answers questions over it with page-cited retrieval." }, { "name": "eve/chat-with-youtube", "type": "registry:block", "title": "Chat with YouTube Agent", "description": "Eve agent that fetches a video's metadata and transcript, then answers questions with clickable timestamp citations." }, { "name": "eve/claw", "type": "registry:block", "title": "Claw Autonomous Assistant", "description": "Eve agent that operates a sandboxed workspace — read/write files and run shell commands — to finish multi-step tasks." }, { "name": "eve/company-knowledge", "type": "registry:block", "title": "Company Knowledge Agent", "description": "Eve agent that indexes internal documents into a vector store and answers questions over them, with PII redaction." }, { "name": "eve/csv-to-questions", "type": "registry:block", "title": "CSV to Questions Agent", "description": "Eve agent that summarizes a CSV dataset to stay within token limits, then generates focused analytical questions." }, { "name": "eve/deep-search", "type": "registry:block", "title": "Deep Search Agent", "description": "Eve agent that researches a question, evaluates its own findings, and iterates until the answer is complete and cited." }, { "name": "eve/docs-chatbot", "type": "registry:block", "title": "Docs Chatbot Agent", "description": "Eve agent that answers questions about a library's functions by looking up structured documentation." }, { "name": "eve/docs-expert", "type": "registry:block", "title": "Docs Expert Agent", "description": "Eve agent that answers questions about libraries and APIs by searching the live web and citing sources." }, { "name": "eve/extract-design-md", "type": "registry:block", "title": "Extract DESIGN.md Agent", "description": "Eve agent that turns a domain into a self-contained DESIGN.md — gathering the styleguide, screenshot, and homepage Markdown from context.dev, then composing th…" }, { "name": "eve/feedback-summary", "type": "registry:block", "title": "Customer Feedback Summary Agent", "description": "Eve agent that retrieves, categorizes, and summarizes customer feedback into an executive report with recommendations." }, { "name": "eve/flashcards-pdf", "type": "registry:block", "title": "Flash Cards from PDF Agent", "description": "Eve agent that turns a PDF into study flash cards, with optional AI-generated images per concept." }, { "name": "eve/github-review", "type": "registry:block", "title": "GitHub PR Code Review Agent", "description": "Eve agent that fetches a GitHub pull request and returns adaptive, file-by-file code review feedback." }, { "name": "eve/google-sheets", "type": "registry:block", "title": "Google Sheets Analysis Agent", "description": "Eve agent that reads, analyzes, and edits Google Sheets via the Sheets API." }, { "name": "eve/meeting-notes", "type": "registry:block", "title": "Meeting Notes Agent", "description": "Eve agent that turns a raw meeting transcript into a structured summary, decisions, and action items." }, { "name": "eve/slack-agent", "type": "registry:block", "title": "Slack Agent", "description": "Eve agent that replies to Slack mentions and DMs, threaded, via the Slack Web API." }, { "name": "eve/text-to-sql", "type": "registry:block", "title": "Chat with Database Agent", "description": "Eve agent that introspects a database schema, converts questions to SQL, and runs read-only queries." }, { "name": "eve/weather", "type": "registry:block", "title": "Weather Agent", "description": "Eve agent that looks up current weather for a location via the Open-Meteo API." }, { "name": "flue/ai-seo-audit", "type": "registry:block", "title": "AI SEO Audit Agent", "description": "Flue agent that runs a deterministic AI-SEO audit on a page through context.dev — scoring ~30 checks across six categories into a 0–100 total and returning fai…" }, { "name": "flue/browser-agent", "type": "registry:block", "title": "Browser Agent", "description": "Flue agent that drives a real browser with Playwright using a snapshot-and-selector pattern to complete web tasks." }, { "name": "flue/chat-with-pdf", "type": "registry:block", "title": "Chat with PDF Agent", "description": "Flue agent that indexes a PDF into a vector store and answers questions over it with page-cited retrieval." }, { "name": "flue/chat-with-youtube", "type": "registry:block", "title": "Chat with YouTube Agent", "description": "Flue agent that fetches a video's metadata and transcript, then answers questions with clickable timestamp citations." }, { "name": "flue/claw", "type": "registry:block", "title": "Claw Autonomous Assistant", "description": "Flue agent that operates a sandboxed workspace — read/write files and run shell commands — to finish multi-step tasks." }, { "name": "flue/company-knowledge", "type": "registry:block", "title": "Company Knowledge Agent", "description": "Flue agent that indexes internal documents into a vector store and answers questions over them, with a scheduled re-index workflow and PII redaction." }, { "name": "flue/csv-to-questions", "type": "registry:block", "title": "CSV to Questions Agent", "description": "Flue agent that chains a summarizer and a question-generator through a workflow to turn a CSV into analytical questions." }, { "name": "flue/deep-search", "type": "registry:block", "title": "Deep Search Agent", "description": "Flue agent that fans research out to searcher and evaluator subagents, iterating through a bounded workflow until the answer is cited and complete." }, { "name": "flue/docs-chatbot", "type": "registry:block", "title": "Docs Chatbot Agent", "description": "Flue agent that answers questions about a library's functions by looking up structured documentation." }, { "name": "flue/docs-expert", "type": "registry:block", "title": "Docs Expert Agent", "description": "Flue agent that answers questions about libraries and APIs by searching the live web and citing sources." }, { "name": "flue/extract-design-md", "type": "registry:block", "title": "Extract DESIGN.md Agent", "description": "Flue workflow that turns a domain into a self-contained DESIGN.md — gathering the styleguide, screenshot, and homepage Markdown from context.dev, then composin…" }, { "name": "flue/feedback-summary", "type": "registry:block", "title": "Customer Feedback Summary Agent", "description": "Flue agent that retrieves, categorizes, and summarizes customer feedback into an executive report with recommendations." }, { "name": "flue/flashcards-pdf", "type": "registry:block", "title": "Flash Cards from PDF Agent", "description": "Flue agent that turns a PDF into study flash cards through a workflow, with optional AI-generated images per concept." }, { "name": "flue/github-review", "type": "registry:block", "title": "GitHub PR Code Review Agent", "description": "Flue agent that fetches a GitHub pull request and returns adaptive review feedback, with a workflow that emits a typed review." }, { "name": "flue/google-sheets", "type": "registry:block", "title": "Google Sheets Analysis Agent", "description": "Flue agent that reads, analyzes, and edits Google Sheets via the Sheets API." }, { "name": "flue/meeting-notes", "type": "registry:block", "title": "Meeting Notes Agent", "description": "Flue agent that runs a transcript through a workflow to return a structured summary, decisions, and action items." }, { "name": "flue/slack-agent", "type": "registry:block", "title": "Slack Agent", "description": "Flue agent that replies to Slack mentions and DMs, threaded, via the Slack Web API." }, { "name": "flue/text-to-sql", "type": "registry:block", "title": "Chat with Database Agent", "description": "Flue agent that introspects a database schema, converts questions to SQL, and runs read-only queries." }, { "name": "flue/weather", "type": "registry:block", "title": "Weather Agent", "description": "Flue agent that looks up current weather for a location via the Open-Meteo API." }, { "name": "mastra/ai-seo-audit", "type": "registry:block", "title": "AI SEO Audit Agent", "description": "Mastra agent that runs a deterministic AI-SEO audit on a page through context.dev — scoring ~30 checks across six categories into a 0–100 total, returning fail…" }, { "name": "mastra/browser-agent", "type": "registry:block", "title": "Browser Agent", "description": "A browser-operating agent that interacts with live web pages using Playwright-based tools with accessibility-tree ref ids." }, { "name": "mastra/chat-with-pdf", "type": "registry:block", "title": "Chat with PDF Agent", "description": "Mastra agent that indexes a PDF into a vector store and answers questions over it with page-cited retrieval and stratified sampling." }, { "name": "mastra/chat-with-youtube", "type": "registry:block", "title": "Chat with YouTube Agent", "description": "A helpful assistant that fetches and analyzes YouTube video transcripts to answer questions, generate summaries, and create chapters." }, { "name": "mastra/claw", "type": "registry:block", "title": "Claw Autonomous Assistant", "description": "Mastra agent that operates a sandboxed workspace — read/write files and run shell commands — to finish multi-step tasks." }, { "name": "mastra/company-knowledge", "type": "registry:block", "title": "Company Knowledge Agent", "description": "Mastra agent that indexes internal documents into a vector store and answers questions over them, with PII redaction." }, { "name": "mastra/csv-to-questions", "type": "registry:block", "title": "CSV to Questions Agent", "description": "Mastra agent that summarizes a CSV dataset to stay within token limits, then generates focused analytical questions." }, { "name": "mastra/deep-search", "type": "registry:block", "title": "Deep Search Agent", "description": "A multi-agent deep search system that researches questions by clarifying intent, planning queries, evaluating results, and synthesizing answers." }, { "name": "mastra/docs-chatbot", "type": "registry:block", "title": "Docs Chatbot Agent", "description": "Mastra agent that answers questions about a library's functions by looking up structured documentation." }, { "name": "mastra/docs-expert", "type": "registry:block", "title": "Docs Expert Agent", "description": "Mastra agent that answers questions about libraries and APIs by searching the live web and citing sources." }, { "name": "mastra/extract-design-md", "type": "registry:block", "title": "Extract DESIGN.md Agent", "description": "Mastra agent that turns a domain into a self-contained DESIGN.md — gathering the styleguide, screenshot, and homepage Markdown from context.dev, then composing…" }, { "name": "mastra/feedback-summary", "type": "registry:block", "title": "Customer Feedback Summary Agent", "description": "Mastra agent that retrieves, categorizes, and summarizes customer feedback into an executive report with recommendations." }, { "name": "mastra/flashcards-pdf", "type": "registry:block", "title": "Flash Cards from PDF Agent", "description": "Mastra agent that turns a PDF into study flash cards, with optional AI-generated images per concept." }, { "name": "mastra/github-review", "type": "registry:block", "title": "GitHub PR Code Review Agent", "description": "Mastra agent that fetches a GitHub pull request and returns adaptive, file-by-file code review feedback." }, { "name": "mastra/google-sheets", "type": "registry:block", "title": "Google Sheets Analysis Agent", "description": "Mastra agent that reads, analyzes, and edits Google Sheets via the Sheets API." }, { "name": "mastra/meeting-notes", "type": "registry:block", "title": "Meeting Notes Agent", "description": "Mastra agent that turns a raw meeting transcript into a structured summary, decisions, and action items." }, { "name": "mastra/slack-agent", "type": "registry:block", "title": "Slack Agent", "description": "Mastra agent that replies to Slack mentions and DMs, scoped to the thread, via the Slack Web API." }, { "name": "mastra/text-to-sql", "type": "registry:block", "title": "Chat with Database Agent", "description": "Mastra agent that introspects a database schema, converts questions to SQL, and runs read-only queries." }, { "name": "mastra/weather", "type": "registry:block", "title": "Weather Agent", "description": "Mastra agent that looks up current weather for a location via the Open-Meteo API." } ], "component_count": 57, "components_truncated": false, "component_types": { "registry:block": 57 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 7, "name": "@agents-ui", "category": "AI/chat UI", "tags": [ "ai" ], "tagline": "This is a shadcn/ui component registry that distributes copy-paste React components for building LiveKit AI Agent interfaces.", "short_description": "This is a shadcn/ui component registry that distributes copy-paste React components for building LiveKit AI Agent interfaces.", "description": "Official LiveKit shadcn/ui component registry for building voice AI agent interfaces. Components include: AgentSessionProvider, AgentControlBar, AgentChatTranscript, AgentAudioVisualizerBar (five visualizer styles: Aura, Wave, Radial, Grid, and more), StartAudioButton, plus media controls and session management primitives. Built on React 19 and Tailwind CSS v4; depends on @livekit/components-react and the LiveKit platform. Built on top of Vercel AI Elements. Free, open-source. Use for: any LiveKit-powered voice agent front-end that needs polished, production-ready visualizers and chat transcript UI without building WebRTC audio components from scratch.", "homepage": "https://livekit.com/ui", "docs": "https://docs.livekit.io/frontends/components/agents-ui/", "github": "https://github.com/livekit/components-js", "components_github": null, "github_default_branch": "main", "github_stars": 442, "last_commit": "2026-07-08T05:11:33Z", "archived": false, "license": "Apache-2.0", "open_issues": 37, "registry_template": "https://livekit.com/ui/r/{name}.json", "registry_index": "https://livekit.com/ui/r/registry.json", "components": [ "agent-disconnect-button", "agent-track-toggle", "agent-track-control", "agent-control-bar", "agent-audio-visualizer-bar", "agent-audio-visualizer-radial", "agent-audio-visualizer-grid", "agent-session-provider", "start-audio-button", "agent-chat-indicator", "agent-chat-transcript", "react-shader-toy", "agent-audio-visualizer-wave", "agent-audio-visualizer-aura", "nextjs-api-token-route", "agent-session-view-01", "all" ], "component_items": [ { "name": "agent-disconnect-button", "type": "registry:component", "title": "Agent Disconnect Button", "description": "A button for disconnecting the agent session." }, { "name": "agent-track-toggle", "type": "registry:component", "title": "Agent Track Toggle", "description": "A toggle button for controlling media tracks (microphone, camera, screen share) with appropriate icons and loading states." }, { "name": "agent-track-control", "type": "registry:component", "title": "Agent Track Control", "description": "A control for managing media tracks (microphone, camera, screen share) with appropriate icons and loading states." }, { "name": "agent-control-bar", "type": "registry:component", "title": "Agent Control Bar", "description": "A control bar for managing media tracks (microphone, camera, screen share), disconnecting the agent session, and opening the chat input, with appropriate icons…" }, { "name": "agent-audio-visualizer-bar", "type": "registry:component", "title": "Agent Audio Visualizer Bar", "description": "A linear bar visualizer for audio tracks." }, { "name": "agent-audio-visualizer-radial", "type": "registry:component", "title": "Agent Audio Visualizer Radial", "description": "A radial bar visualizer for audio tracks." }, { "name": "agent-audio-visualizer-grid", "type": "registry:component", "title": "Agent Audio Visualizer Grid", "description": "A grid visualizer for audio tracks." }, { "name": "agent-session-provider", "type": "registry:component", "title": "Agent Session Provider", "description": "A component for providing an agent's session context and ensuring remote participants’ audio tracks (microphones and screen share) are audible." }, { "name": "start-audio-button", "type": "registry:component", "title": "Start Audio Button", "description": "A button for starting the agent session's audio track when the browser blocks audio playback." }, { "name": "agent-chat-indicator", "type": "registry:component", "title": "Agent Chat Indicator", "description": "A component for indicating the agent's chat status with a blinking dot. Useful for indicating the agent is thinking before generating a response." }, { "name": "agent-chat-transcript", "type": "registry:component", "title": "Agent Chat Transcript", "description": "A component for displaying the agent session's chat transcript." }, { "name": "react-shader-toy", "type": "registry:component", "title": "React Shader Toy", "description": "A shadertoy-like shader renderer component for React." }, { "name": "agent-audio-visualizer-wave", "type": "registry:component", "title": "Agent Audio Visualizer Wave", "description": "A wave visualizer for audio tracks." }, { "name": "agent-audio-visualizer-aura", "type": "registry:component", "title": "Agent Audio Visualizer Aura", "description": "An aura visualizer for audio tracks." }, { "name": "nextjs-api-token-route", "type": "registry:page", "title": "NextJS API route to get a LiveKit session token", "description": "A NextJS API route to generate a LiveKit session token while keeping your API keys private." }, { "name": "agent-session-view-01", "type": "registry:block", "title": "Agent Session View", "description": "A full-screen agent session block with transcript, controls, and I/O media tiles." }, { "name": "all", "type": "registry:item", "title": "All", "description": "Installs every component in the @agents-ui registry (excluding the nextjs-api-token-route)." } ], "component_count": 17, "components_truncated": false, "component_types": { "registry:component": 14, "registry:page": 1, "registry:block": 1, "registry:item": 1 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 8, "name": "@ai-blocks", "category": "AI/chat UI", "tags": [ "ai" ], "tagline": "AI components for the web. No server. No API keys. Built on WebLLM.", "short_description": "AI components for the web. No server. No API keys. Built on WebLLM.", "description": "50+ browser-native AI UI components powered by WebLLM — runs large language models directly in the browser with no server and no API keys required. Categories include: chat interfaces (simple chat, personas, voice chat, tool use), text generation (streaming, rewriter, expander, autocomplete), structured output (sentiment analysis, entity extraction, JSON generation), content tools (summarization, translation), forms (smart validation, autofill), e-commerce (product search, reviews, size advisor), education (flashcards, quizzes, Socratic tutoring), and accessibility helpers. Requires the webllm npm package, React 18+, and shadcn/ui. Free, open-source. Use for: privacy-first AI features where all inference must stay client-side, with zero backend infrastructure.", "homepage": "https://webllm.org/blocks", "docs": "https://webllm.org/blocks", "github": "https://github.com/webllm-org/ai-blocks", "components_github": "https://github.com/webllm-org/ai-blocks/tree/main/src/registry", "github_default_branch": "main", "github_stars": 9, "last_commit": "2025-12-09T15:22:25Z", "archived": false, "license": null, "open_issues": 0, "registry_template": "https://webllm.org/r/{name}.json", "registry_index": null, "components": [], "component_items": [], "component_count": null, "components_truncated": false, "component_types": {}, "has_logo": true, "enrichment_errors": [ "registry_index_unresolved" ], "featured": true }, { "number": 9, "name": "@ai-elements", "category": "AI/chat UI", "tags": [ "ai" ], "tagline": "Pre-built components like conversations, messages and more to help you build AI-native applications faster.", "short_description": "Pre-built components like conversations, messages and more to help you build AI-native applications faster.", "description": "Official Vercel AI SDK component registry (also distributed as ai-elements CLI) for building AI-native Next.js applications. Components span: Chatbot, Conversation, Message, Prompt Input, Model Selector, Reasoning/Chain-of-Thought display, Inline Citation, Confirmation, Checkpoint, Context, Suggestion, Task, Queue, Tool display, Code Block, Commit, File Tree, JSX Preview, Package Info, Sandbox, Schema Display, Snippet, Stack Trace, Terminal, Test Results, Web Preview, Audio Player, Mic Selector, and more. Requires Vercel AI SDK + shadcn/ui + Tailwind CSS. Free, open-source. Use for: AI-first Next.js apps that need a full suite of streaming-ready chat and agentic display components wired to the Vercel AI SDK out of the box.", "homepage": "https://ai-sdk.dev/elements", "docs": "https://ai-sdk.dev/docs", "github": "https://github.com/vercel/ai-elements", "components_github": null, "github_default_branch": "main", "github_stars": 2192, "last_commit": "2026-07-01T09:19:33Z", "archived": false, "license": null, "open_issues": 61, "registry_template": "https://ai-sdk.dev/elements/api/registry/{name}.json", "registry_index": "https://ai-sdk.dev/elements/api/registry/registry.json", "components": [ "agent", "artifact", "attachments", "audio-player", "canvas", "chain-of-thought", "checkpoint", "code-block", "commit", "confirmation", "connection", "context", "controls", "conversation", "edge", "environment-variables", "file-tree", "image", "inline-citation", "jsx-preview", "message", "mic-selector", "model-selector", "node", "open-in-chat", "package-info", "panel", "persona", "plan", "prompt-input", "queue", "reasoning", "sandbox", "schema-display", "shimmer", "snippet", "sources", "speech-input", "stack-trace", "suggestion", "task", "terminal", "test-results", "tool", "toolbar", "transcription", "voice-selector", "web-preview", "example-agent", "example-artifact", "example-attachments-inline", "example-attachments-list", "example-attachments", "example-audio-player-remote", "example-audio-player", "example-chain-of-thought", "example-chatbot", "example-checkpoint", "example-code-block-dark", "example-code-block", "example-commit", "example-confirmation-accepted", "example-confirmation-rejected", "example-confirmation-request", "example-confirmation", "example-context", "example-conversation", "example-demo-chatgpt", "example-demo-claude", "example-demo-cursor", "example-demo-grok", "example-demo-workflow", "example-environment-variables", "example-file-tree-basic", "example-file-tree-expanded", "example-file-tree-selection", "example-file-tree", "example-image", "example-inline-citation", "example-jsx-preview", "example-message", "example-mic-selector", "example-model-selector", "example-open-in-chat", "example-package-info", "example-persona-command", "example-persona-glint", "example-persona-halo", "example-persona-mana", "example-persona-obsidian", "example-persona-opal", "example-plan", "example-prompt-input-cursor", "example-prompt-input-tooltip", "example-prompt-input", "example-queue-prompt-input", "example-queue", "example-reasoning", "example-sandbox", "example-schema-display-basic" ], "component_items": [ { "name": "agent", "type": "registry:component", "title": "Agent", "description": "AI-powered agent component." }, { "name": "artifact", "type": "registry:component", "title": "Artifact", "description": "AI-powered artifact component." }, { "name": "attachments", "type": "registry:component", "title": "Attachments", "description": "AI-powered attachments component." }, { "name": "audio-player", "type": "registry:component", "title": "Audio Player", "description": "AI-powered audio player component." }, { "name": "canvas", "type": "registry:component", "title": "Canvas", "description": "AI-powered canvas component." }, { "name": "chain-of-thought", "type": "registry:component", "title": "Chain Of Thought", "description": "AI-powered chain of-thought component." }, { "name": "checkpoint", "type": "registry:component", "title": "Checkpoint", "description": "AI-powered checkpoint component." }, { "name": "code-block", "type": "registry:component", "title": "Code Block", "description": "AI-powered code block component." }, { "name": "commit", "type": "registry:component", "title": "Commit", "description": "AI-powered commit component." }, { "name": "confirmation", "type": "registry:component", "title": "Confirmation", "description": "AI-powered confirmation component." }, { "name": "connection", "type": "registry:component", "title": "Connection", "description": "AI-powered connection component." }, { "name": "context", "type": "registry:component", "title": "Context", "description": "AI-powered context component." }, { "name": "controls", "type": "registry:component", "title": "Controls", "description": "AI-powered controls component." }, { "name": "conversation", "type": "registry:component", "title": "Conversation", "description": "AI-powered conversation component." }, { "name": "edge", "type": "registry:component", "title": "Edge", "description": "AI-powered edge component." }, { "name": "environment-variables", "type": "registry:component", "title": "Environment Variables", "description": "AI-powered environment variables component." }, { "name": "file-tree", "type": "registry:component", "title": "File Tree", "description": "AI-powered file tree component." }, { "name": "image", "type": "registry:component", "title": "Image", "description": "AI-powered image component." }, { "name": "inline-citation", "type": "registry:component", "title": "Inline Citation", "description": "AI-powered inline citation component." }, { "name": "jsx-preview", "type": "registry:component", "title": "Jsx Preview", "description": "AI-powered jsx preview component." }, { "name": "message", "type": "registry:component", "title": "Message", "description": "AI-powered message component." }, { "name": "mic-selector", "type": "registry:component", "title": "Mic Selector", "description": "AI-powered mic selector component." }, { "name": "model-selector", "type": "registry:component", "title": "Model Selector", "description": "AI-powered model selector component." }, { "name": "node", "type": "registry:component", "title": "Node", "description": "AI-powered node component." }, { "name": "open-in-chat", "type": "registry:component", "title": "Open In Chat", "description": "AI-powered open in-chat component." }, { "name": "package-info", "type": "registry:component", "title": "Package Info", "description": "AI-powered package info component." }, { "name": "panel", "type": "registry:component", "title": "Panel", "description": "AI-powered panel component." }, { "name": "persona", "type": "registry:component", "title": "Persona", "description": "AI-powered persona component." }, { "name": "plan", "type": "registry:component", "title": "Plan", "description": "AI-powered plan component." }, { "name": "prompt-input", "type": "registry:component", "title": "Prompt Input", "description": "AI-powered prompt input component." }, { "name": "queue", "type": "registry:component", "title": "Queue", "description": "AI-powered queue component." }, { "name": "reasoning", "type": "registry:component", "title": "Reasoning", "description": "AI-powered reasoning component." }, { "name": "sandbox", "type": "registry:component", "title": "Sandbox", "description": "AI-powered sandbox component." }, { "name": "schema-display", "type": "registry:component", "title": "Schema Display", "description": "AI-powered schema display component." }, { "name": "shimmer", "type": "registry:component", "title": "Shimmer", "description": "AI-powered shimmer component." }, { "name": "snippet", "type": "registry:component", "title": "Snippet", "description": "AI-powered snippet component." }, { "name": "sources", "type": "registry:component", "title": "Sources", "description": "AI-powered sources component." }, { "name": "speech-input", "type": "registry:component", "title": "Speech Input", "description": "AI-powered speech input component." }, { "name": "stack-trace", "type": "registry:component", "title": "Stack Trace", "description": "AI-powered stack trace component." }, { "name": "suggestion", "type": "registry:component", "title": "Suggestion", "description": "AI-powered suggestion component." }, { "name": "task", "type": "registry:component", "title": "Task", "description": "AI-powered task component." }, { "name": "terminal", "type": "registry:component", "title": "Terminal", "description": "AI-powered terminal component." }, { "name": "test-results", "type": "registry:component", "title": "Test Results", "description": "AI-powered test results component." }, { "name": "tool", "type": "registry:component", "title": "Tool", "description": "AI-powered tool component." }, { "name": "toolbar", "type": "registry:component", "title": "Toolbar", "description": "AI-powered toolbar component." }, { "name": "transcription", "type": "registry:component", "title": "Transcription", "description": "AI-powered transcription component." }, { "name": "voice-selector", "type": "registry:component", "title": "Voice Selector", "description": "AI-powered voice selector component." }, { "name": "web-preview", "type": "registry:component", "title": "Web Preview", "description": "AI-powered web preview component." }, { "name": "example-agent", "type": "registry:block", "title": "Agent Example", "description": "Example implementation of agent." }, { "name": "example-artifact", "type": "registry:block", "title": "Artifact Example", "description": "Example implementation of artifact." }, { "name": "example-attachments-inline", "type": "registry:block", "title": "Attachments Inline Example", "description": "Example implementation of attachments inline." }, { "name": "example-attachments-list", "type": "registry:block", "title": "Attachments List Example", "description": "Example implementation of attachments list." }, { "name": "example-attachments", "type": "registry:block", "title": "Attachments Example", "description": "Example implementation of attachments." }, { "name": "example-audio-player-remote", "type": "registry:block", "title": "Audio Player Remote Example", "description": "Example implementation of audio player-remote." }, { "name": "example-audio-player", "type": "registry:block", "title": "Audio Player Example", "description": "Example implementation of audio player." }, { "name": "example-chain-of-thought", "type": "registry:block", "title": "Chain Of Thought Example", "description": "Example implementation of chain of-thought." }, { "name": "example-chatbot", "type": "registry:block", "title": "Chatbot Example", "description": "Example implementation of chatbot." }, { "name": "example-checkpoint", "type": "registry:block", "title": "Checkpoint Example", "description": "Example implementation of checkpoint." }, { "name": "example-code-block-dark", "type": "registry:block", "title": "Code Block Dark Example", "description": "Example implementation of code block-dark." }, { "name": "example-code-block", "type": "registry:block", "title": "Code Block Example", "description": "Example implementation of code block." } ], "component_count": 136, "components_truncated": true, "component_types": { "registry:component": 48, "registry:block": 88 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 10, "name": "@aicanvas", "category": "Animated components", "tags": [ "ai", "aesthetic" ], "tagline": "54 animated React components with AI reproduction prompts for Claude Code, Lovable, and v0. Free and open source.", "short_description": "54 animated React components with AI reproduction prompts for Claude Code, Lovable, and v0. Free and open source.", "description": "Growing open-source collection of 64+ animated React components (TypeScript, Motion/Framer Motion, Tailwind CSS) aimed at designers and developers. Notable component groups include: Label Cards, Cards & Modals (Travel Deck, AI Job Cards, Task Cards), Backgrounds (Particle Sphere), and more. Each component ships with full source code and expert-crafted AI reproduction prompts for Claude Code, Lovable, and v0. Free, MIT-licensed. Install via shadcn CLI. Use for: quickly grabbing a polished animated card or background component and immediately being able to remix or extend it with an AI coding tool.", "homepage": "https://aicanvas.me", "docs": "https://aicanvas.me", "github": "https://github.com/uiNerd16/aicanvas", "components_github": "https://github.com/uiNerd16/aicanvas/tree/main/app/components", "github_default_branch": "main", "github_stars": 27, "last_commit": "2026-07-07T21:17:20Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://aicanvas.me/r/{name}.json", "registry_index": "https://aicanvas.me/r/registry.json", "components": [ "ai-job-cards", "andromeda-button", "meet-the-crew", "blind-pull-toggle", "bubble-field", "charging-widget", "crypto-swap", "cube-carousel", "curious-ai", "danger-stripes", "distortion-grid", "dot-grid", "emoji-burst", "flip-calendar", "traveldeck", "glass-ai-compose", "glass-card", "glass-dock", "glass-modal", "glass-music-player", "glass-navbar", "glass-notification", "glass-progress", "glass-search-bar", "glass-sidebar", "glass-slider", "glass-stepper", "glass-tab-bar", "glass-tags", "glass-toast", "glass-toggle", "glass-user-menu", "glitch-button", "good-vibes", "grid-lines", "halo-type", "interactive-card-stack", "jar-of-emotions", "label-cards", "magnetic-dots", "mark-toggle", "mood-tracker", "neon-clock", "new-project-modal", "noise-bg", "noise-field", "orbit", "particle-constellation", "particle-sphere", "peel-corner-reveal", "pill-toggle", "playful", "polaroid-stack", "product-card-deck", "radial-cards", "radial-toolbar", "responsive-letters", "ripple-type", "runway-loader", "scramble-text", "signature-pad", "slice-type", "slide-deck", "sphere-lines", "stack-tower", "sticker-wall", "taga-toggle", "task-cards", "text-blur-reveal", "tilted-coverflow", "upload-progress", "voice-chat-pill", "wave-lines", "wild-morph", "x-grid", "andromeda-tokens", "andromeda", "andromeda-alert", "andromeda-avatar", "andromeda-badge", "andromeda-button-system", "andromeda-card", "andromeda-checkbox", "andromeda-corner-markers", "andromeda-date-range-picker", "andromeda-drawer", "andromeda-empty-state", "andromeda-heat-grid", "andromeda-icon-button", "andromeda-input", "andromeda-nav-item", "andromeda-panel-header", "andromeda-panel-menu", "andromeda-planet", "andromeda-progress-bar", "andromeda-radar-chart", "andromeda-radio", "andromeda-search-field", "andromeda-segmented-control", "andromeda-slider" ], "component_items": [ { "name": "ai-job-cards", "type": "registry:ui", "title": "AI Job Cards", "description": "Three AI job card stacks with swipe-to-cycle. Brand logos, bookmark toggle, springs." }, { "name": "andromeda-button", "type": "registry:ui", "title": "Andromeda Button", "description": "A sci-fi / blueprint-aesthetic button with five variants (default, outline, ghost, destructive, link), three sizes (small, medium, large), optional leading ico…" }, { "name": "meet-the-crew", "type": "registry:ui", "title": "Meet the Crew", "description": "A swipeable portrait card stack perfect for introducing a team, showcasing crew members, or picking an avatar. Four stacked cards fan out with soft rotations —…" }, { "name": "blind-pull-toggle", "type": "registry:ui", "title": "Blind Pull Toggle", "description": "A dark/light mode toggle styled as a window-blind pull cord — click to yank the cord and watch the icon swap through a venetian-blind slat animation." }, { "name": "bubble-field", "type": "registry:ui", "title": "Bubble Field", "description": "A grid of outline circles that burst on hover — each expanding and fading like a soap bubble popping, then reforming, with a soft pastel blue palette." }, { "name": "charging-widget", "type": "registry:ui", "title": "Charging Widget", "description": "Circular battery indicator with animated liquid waves that rise as the percentage counts up, looping continuously." }, { "name": "crypto-swap", "type": "registry:ui", "title": "Crypto Swap", "description": "A crypto token-swap widget with live exchange rates, price impact, and an animated swap button." }, { "name": "cube-carousel", "type": "registry:ui", "title": "Cube Carousel", "description": "An interactive 3D photo cube with six placeholder images on its faces. Drag with your cursor to spin it freely on both axes; release and it coasts naturally to…" }, { "name": "curious-ai", "type": "registry:ui", "title": "Curious AI", "description": "A morphing 3D AI orb in Three.js with cyan and magenta rim lights, iridescent pink speckles on a wrinkled surface, and glowing pink robot-eye pills that follow…" }, { "name": "danger-stripes", "type": "registry:ui", "title": "Danger Stripes", "description": "Three crossing caution-tape stripes on orange. Hover to shake, click to intensify." }, { "name": "distortion-grid", "type": "registry:ui", "title": "Distortion Grid", "description": "A canvas grid of thin lines that slowly undulate with large sweeping waves. Hovering repels the grid fabric outward from the cursor, amplifying the distortion …" }, { "name": "dot-grid", "type": "registry:ui", "title": "Dot Grid", "description": "A canvas-based dot grid background where hovering illuminates nearby dots with a smooth radial glow and organic fade." }, { "name": "emoji-burst", "type": "registry:ui", "title": "Emoji Burst", "description": "A button that explodes emojis outward in all directions. Five emoji sets cycle on each click." }, { "name": "flip-calendar", "type": "registry:ui", "title": "Flip Calendar", "description": "A desk-calendar widget showing dates 1–31 with a satisfying flip-clock page-turn animation." }, { "name": "traveldeck", "type": "registry:ui", "title": "Travel Deck", "description": "A swipeable deck of destination cards. Drag the front card down to fling it off-screen and reveal the next. Each card reveals an animated hotels counter as it …" }, { "name": "glass-ai-compose", "type": "registry:ui", "title": "Glass AI Composer", "description": "Glassmorphism AI chat input with image upload, web search toggle, and model switcher." }, { "name": "glass-card", "type": "registry:ui", "title": "Glass Card", "description": "Glassmorphism content cards with 3D tilt-on-hover, spring physics, and a cursor-following glare highlight." }, { "name": "glass-dock", "type": "registry:ui", "title": "Glass Dock", "description": "Glassmorphism macOS-style dock with cursor-proximity magnification. Icons scale with spring physics as the mouse approaches." }, { "name": "glass-modal", "type": "registry:ui", "title": "Glass Modal", "description": "Centered dialog with deep glass blur, scale-spring entrance, and staggered content reveal." }, { "name": "glass-music-player", "type": "registry:ui", "title": "Glass Music Player", "description": "Mini music player with glass surface, spinning vinyl art, animated progress bar, and ambient glow." }, { "name": "glass-navbar", "type": "registry:ui", "title": "Glass Navbar", "description": "Frosted glass navigation bar with animated active tab indicator, ambient color blobs, and spring-physics entrance." }, { "name": "glass-notification", "type": "registry:ui", "title": "Glass Notifications", "description": "Swipe-to-dismiss notification stack with glass cards and spring-animated layout transitions." }, { "name": "glass-progress", "type": "registry:ui", "title": "Glass Progress", "description": "Glassmorphism progress bar panel with glowing gradient fills, spring-animated counters, staggered reveal, and replay button." }, { "name": "glass-search-bar", "type": "registry:ui", "title": "Glass Search Bar", "description": "Glassmorphism search bar with animated suggestion dropdown, active state glow, and reduced-motion support." }, { "name": "glass-sidebar", "type": "registry:ui", "title": "Glass Sidebar", "description": "Collapsible glassmorphism sidebar with icon-only and full label states, spring-animated expand and collapse." }, { "name": "glass-slider", "type": "registry:ui", "title": "Glass Slider", "description": "Range sliders with glass tracks, glowing colored fills, and spring-animated thumbs that scale on drag." }, { "name": "glass-stepper", "type": "registry:ui", "title": "Glass Stepper", "description": "Glassmorphism numeric stepper with spring number flip, notification-style tinted buttons, and configurable min/max/step." }, { "name": "glass-tab-bar", "type": "registry:ui", "title": "Glass Tab Bar", "description": "Frosted glass pill tab bar with a sliding active indicator. Edge tabs snap flush to the container wall." }, { "name": "glass-tags", "type": "registry:ui", "title": "Glass Tags", "description": "Selectable pill-shaped tags with glass surfaces, unique color accents, and spring-animated check marks." }, { "name": "glass-toast", "type": "registry:ui", "title": "Glass Toast", "description": "Frosted glassmorphism toast notification stack with 4 variants, auto-dismiss progress bar, and spring-animated stacking." }, { "name": "glass-toggle", "type": "registry:ui", "title": "Glass Toggle", "description": "On/off toggles with glass housing and liquid-feel spring animation. Track color transitions smoothly." }, { "name": "glass-user-menu", "type": "registry:ui", "title": "Glass User Menu", "description": "Frosted glass user avatar trigger with animated dropdown, grouped menu items, and Log Out." }, { "name": "glitch-button", "type": "registry:ui", "title": "Glitch Button", "description": "A terminal-inspired button with a text scramble glitch effect on hover." }, { "name": "good-vibes", "type": "registry:ui", "title": "Good Vibes", "description": "Interactive typography where letters scale 2x and become bold on hover." }, { "name": "grid-lines", "type": "registry:ui", "title": "Grid Lines", "description": "A dot grid connected by thin lines. On hover, a radial wave pulses outward from the cursor, illuminating lines and dots as it spreads." }, { "name": "halo-type", "type": "registry:ui", "title": "Halo Type", "description": "Rotating 3D ring text animation — the front arc reads upright, the back arc upside-down." }, { "name": "interactive-card-stack", "type": "registry:ui", "title": "Interactive Card Stack", "description": "A scattered stack of photo cards. Drag, click, or arrow keys to focus any card." }, { "name": "jar-of-emotions", "type": "registry:ui", "title": "Emoji Reaction Jar", "description": "Glass jar widget. Click a reaction to spring the lid and watch the emoji bounce down." }, { "name": "label-cards", "type": "registry:ui", "title": "Label Cards", "description": "Colour-blocked label cards scattered at random angles. Tap one to spring it to centre." }, { "name": "magnetic-dots", "type": "registry:ui", "title": "Magnetic Dots", "description": "A dense grid of dots that get magnetically pulled toward the cursor, snapping back with a satisfying elastic bounce when you leave." }, { "name": "mark-toggle", "type": "registry:ui", "title": "Mark Toggle", "description": "An iOS-style pill toggle in warm earth and sand tones — the thumb carries a small icon that morphs from X to checkmark as it slides across." }, { "name": "mood-tracker", "type": "registry:ui", "title": "Mood Tracker", "description": "A feelings check-in card with six expressive faces. Drag the segmented slider and the face, label, and liquid color wash shift with your mood." }, { "name": "neon-clock", "type": "registry:ui", "title": "Seven-Segment Clock", "description": "A retro 7-segment LCD clock with pixel-grid overlay. Shows live HH:MM:SS with blinking colon, AM/PM indicator, day of week row, and full date." }, { "name": "new-project-modal", "type": "registry:ui", "title": "New Project Modal", "description": "A pill button that morphs into a soft-UI project creation form — title, description, 7-swatch color label picker, Private toggle, and a checkmark-confirm Creat…" }, { "name": "noise-bg", "type": "registry:ui", "title": "Grain Background", "description": "A canvas-based grain background of randomly scattered dots that illuminate with a soft Gaussian glow and organic connection lines on hover." }, { "name": "noise-field", "type": "registry:ui", "title": "Noise Field", "description": "A grid of flowing arrows driven by layered sine-wave noise — like wind mapped on a weather chart. Hover to create a swirling vortex at the cursor." }, { "name": "orbit", "type": "registry:ui", "title": "Orbit", "description": "Kinetic text animation arranged in a circle. Hover slows the spin; letters push outward." }, { "name": "particle-constellation", "type": "registry:ui", "title": "Spider Web", "description": "An organic silk web that breathes with a slow idle bow. Hover to physically push the nodes — each intersection bounces back with tension, fading the strings ne…" }, { "name": "particle-sphere", "type": "registry:ui", "title": "Particle Sphere", "description": "9,000 particles arranged on a sphere with warm gold and cool silver tones, slowly spinning in Three.js." }, { "name": "peel-corner-reveal", "type": "registry:ui", "title": "Peel to Scan", "description": "A portrait card whose corner peels on tap, revealing a scannable Wi-Fi QR code." }, { "name": "pill-toggle", "type": "registry:ui", "title": "Pill Toggle", "description": "A minimal iOS-style slider toggle — thumb glides between off (grey) and on (green) with a snappy spring. Fully responsive." }, { "name": "playful", "type": "registry:ui", "title": "Playful", "description": "Kinetic typography where letters jump, drop, and rotate on cursor proximity." }, { "name": "polaroid-stack", "type": "registry:ui", "title": "Polaroid Stack", "description": "Five polaroid photo cards stacked in a casual pile — click to fan them out in a spring-animated arc, hover to lift, click a card to spotlight it." }, { "name": "product-card-deck", "type": "registry:ui", "title": "Product Card Deck", "description": "A draggable card deck you flick through one card at a time. The top card leans toward your drag, then spins away with momentum to reveal the next, and the deck…" }, { "name": "radial-cards", "type": "registry:ui", "title": "Radial Cards", "description": "Seven health-metric cards bloom into a slowly rotating flower — tap any petal to pull it forward and read your stats up close." }, { "name": "radial-toolbar", "type": "registry:ui", "title": "Radial Toolbar", "description": "A radial context menu that fans out formatting tools around a centre button, with active toggle states and an animated label pill." }, { "name": "responsive-letters", "type": "registry:ui", "title": "Responsive Letters", "description": "Interactive text where each letter responds to cursor proximity, animating variable font properties (weight, stretch, italic, letter-spacing, skew) to create a…" }, { "name": "ripple-type", "type": "registry:ui", "title": "Ripple Type", "description": "SVG text animation warped by a turbulence filter. Toggle the fan — letters ripple." }, { "name": "runway-loader", "type": "registry:ui", "title": "Runway Loader", "description": "An airplane taxis down a runway progress bar, nose tilting up and taking off at 100%." }, { "name": "scramble-text", "type": "registry:ui", "title": "Scramble Text", "description": "Two words scramble continuously in a pixel cipher. Hover the container to decrypt them one by one — mouse out and they snap back to noise." } ], "component_count": 115, "components_truncated": true, "component_types": { "registry:ui": 108, "registry:lib": 1, "registry:style": 2, "registry:block": 4 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 11, "name": "@algolia", "category": "Niche/single-purpose", "tags": [ "ai" ], "tagline": "Enterprises and developers use Algolia's AI search infrastructure to understand users and show them what they're looking for.", "short_description": "Enterprises and developers use Algolia's AI search infrastructure to understand users and show them what they're looking for.", "description": "Official Algolia SiteSearch shadcn registry providing opinionated, production-ready search UI components backed by Algolia's infrastructure. Ships two primary experiences: an Instant Search component (keyboard-navigation, sub-50ms results) and a Search with Ask AI component (conversational natural-language search powered by Algolia Ask AI). Built with React and also bundled as vanilla JS for framework-agnostic use. WCAG 2.1 AA compliant. Requires an Algolia account and API keys; free to use as open-source components. Use for: adding a polished modal search or AI chat-search to any app already indexed in Algolia, without building InstantSearch UI from scratch.", "homepage": "https://sitesearch.algolia.com", "docs": "https://sitesearch.algolia.com/docs", "github": "https://github.com/algolia/sitesearch", "components_github": null, "github_default_branch": "main", "github_stars": 22, "last_commit": "2026-05-28T14:27:45Z", "archived": false, "license": "MIT", "open_issues": 4, "registry_template": "https://sitesearch.algolia.com/r/{name}.json", "registry_index": "https://sitesearch.algolia.com/r/registry.json", "components": [ "dropdown-search", "search", "search-ai", "highlight-to-askai", "sidepanel-askai" ], "component_items": [ { "name": "dropdown-search", "type": "registry:block", "title": "Algolia dropdown search experience", "description": "Inline autocomplete dropdown search experience, powered by Algolia's InstantSearch" }, { "name": "search", "type": "registry:block", "title": "Algolia crafted search experience", "description": "Opinionated site search experience, powered by Algolia's InstantSearch" }, { "name": "search-ai", "type": "registry:block", "title": "Search with Ask AI", "description": "Opinionated search experience with Ask AI, powered by Algolia's InstantSearch and Ask AI" }, { "name": "highlight-to-askai", "type": "registry:block", "title": "Highlight to Ask AI [Experimental]", "description": "🚧 [Experimental] Highlight any text and ask Algolia Ask AI with an inline tooltip" }, { "name": "sidepanel-askai", "type": "registry:block", "title": "Sidepanel Ask AI", "description": "Sidepanel chat experience with Ask AI, powered by Algolia's Ask AI" } ], "component_count": 5, "components_truncated": false, "component_types": { "registry:block": 5 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 12, "name": "@aliimam", "category": "Personal/portfolio registry", "tags": [ "components" ], "tagline": "I create digital experiences that connect and inspire. I build apps, websites, brands, and products end-to-end.", "short_description": "I create digital experiences that connect and inspire. I build apps, websites, brands, and products end-to-end.", "description": "Personal shadcn/ui-based component registry by Ali Imam designed as a starting point for building your own component library. Provides a curated set of beautifully designed, customizable, open-source React components built with Tailwind CSS. Positioned as copy-paste source code to own and extend rather than a published package dependency. Free, MIT-licensed. Use for: bootstrapping the visual foundation of a new design system by forking well-crafted base components that already match the shadcn/ui integration pattern.", "homepage": "https://aliimam.in", "docs": "https://aliimam.in/docs", "github": "https://github.com/aliimam-in/aliimam", "components_github": null, "github_default_branch": "main", "github_stars": 77, "last_commit": "2026-06-23T04:11:27Z", "archived": false, "license": null, "open_issues": 1, "registry_template": "https://aliimam.in/r/{name}.json", "registry_index": null, "components": [], "component_items": [], "component_count": null, "components_truncated": false, "component_types": {}, "has_logo": true, "enrichment_errors": [ "registry_index_unresolved" ], "featured": true }, { "number": 13, "name": "@amplo", "category": "Niche/single-purpose", "tags": [ "components" ], "tagline": "OKLCH-native, Display-P3-aware composable fill picker with WCAG/APCA contrast metrics, gamut detection, and full keyboard accessibility.", "short_description": "OKLCH-native, Display-P3-aware composable fill picker with WCAG/APCA contrast metrics, gamut detection, and full keyboard accessibility.", "description": "Highly specialized single-component registry: a Radix-style composable OKLCH-native color picker for shadcn/ui. Supports sRGB, Display-P3, Rec.2020-stretched color spaces with lossless format switching (hex, rgb, hsl, hsb, oklch, oklab, p3), live WCAG 2.1 and APCA contrast metrics, gamut-warning lines, eyedropper, alpha slider, swatches, and full keyboard accessibility. Built for Next.js + Tailwind CSS v4 with shadcn/ui semantic tokens. MIT-licensed. Use for: design tools, theme builders, or any product feature where users need to pick colors with accurate wide-gamut rendering and accessibility feedback.", "homepage": "https://amplo.ale.design", "docs": "https://amplo.ale.design/docs", "github": "https://github.com/TheAleSch/amplo-picker", "components_github": "https://github.com/TheAleSch/amplo-picker/tree/main/registry", "github_default_branch": "main", "github_stars": 15, "last_commit": "2026-07-07T23:53:37Z", "archived": false, "license": "MIT", "open_issues": 1, "registry_template": "https://amplo.ale.design/r/{name}.json", "registry_index": "https://amplo.ale.design/r/registry.json", "components": [ "color-picker", "fill-picker-base" ], "component_items": [ { "name": "color-picker", "type": "registry:ui", "title": "Amplo Color Picker", "description": "OKLCH-native, Display-P3-aware composable color picker with WCAG/APCA contrast metrics, gamut detection, and full keyboard accessibility." }, { "name": "fill-picker-base", "type": "registry:ui", "title": "Amplo Color Picker (Base UI)", "description": "Base UI variant of the Amplo Color Picker — Hue/Lightness/Alpha on Slider, FormatSwitcher on Select, ChannelInput on NumberField, and Swatches on RadioGroup. R…" } ], "component_count": 2, "components_truncated": false, "component_types": { "registry:ui": 2 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 14, "name": "@animate-ui", "category": "Animated components", "tags": [ "aesthetic" ], "tagline": "A fully animated, open-source React component distribution. Browse a list of animated primitives, components and icons you can install and use in your projects.", "short_description": "A fully animated, open-source React component distribution. Browse a list of animated primitives, components and icons you can install and use in your projects.", "description": "Fully animated open-source React component distribution built with TypeScript, Tailwind CSS, and Motion (formerly Framer Motion). Three component tiers: animated Radix-wrapped primitives (accordion, alert-dialog, checkbox, dialog, dropdown-menu, files, hover-card, popover, progress, radio-group, sheet, sidebar, switch, tabs, toggle, tooltip), Base UI-backed variants of the same set, and custom Animate components (avatar-group, code, code-tabs, cursor, github-stars-wheel, tabs, tooltip). Also includes animated Lucide icons. MCP server available. Free, MIT-licensed. Use for: any React app that wants smooth, physics-based transitions on standard shadcn/ui primitives without writing animation logic manually.", "homepage": "https://animate-ui.com", "docs": "https://animate-ui.com/docs", "github": "https://github.com/imskyleen/animate-ui", "components_github": null, "github_default_branch": "main", "github_stars": 3777, "last_commit": "2025-12-31T12:51:05Z", "archived": false, "license": null, "open_issues": 16, "registry_template": "https://animate-ui.com/r/{name}.json", "registry_index": "https://animate-ui.com/r/registry.json", "components": [ "index", "components-animate-avatar-group", "components-animate-code", "components-animate-code-tabs", "components-animate-cursor", "components-animate-github-stars-wheel", "components-animate-tabs", "components-animate-tooltip", "components-backgrounds-bubble", "components-backgrounds-fireworks", "components-backgrounds-gradient", "components-backgrounds-gravity-stars", "components-backgrounds-hexagon", "components-backgrounds-hole", "components-backgrounds-stars", "components-base-accordion", "components-base-alert-dialog", "components-base-checkbox", "components-base-dialog", "components-base-files", "components-base-menu", "components-base-popover", "components-base-preview-card", "components-base-preview-link-card", "components-base-progress", "components-base-radio", "components-base-switch", "components-base-tabs", "components-base-toggle", "components-base-toggle-group", "components-base-tooltip", "components-buttons-button", "components-buttons-copy", "components-buttons-flip", "components-buttons-github-stars", "components-buttons-icon", "components-buttons-liquid", "components-buttons-ripple", "components-buttons-theme-toggler", "components-community-flip-card", "components-community-management-bar", "components-community-motion-carousel", "components-community-notification-list", "components-community-pin-list", "components-community-playful-todolist", "components-community-radial-intro", "components-community-radial-menu", "components-community-radial-nav", "components-community-share-button", "components-community-user-presence-avatar", "components-headless-accordion", "components-headless-checkbox", "components-headless-dialog", "components-headless-popover", "components-headless-switch", "components-headless-tabs", "components-radix-accordion", "components-radix-alert-dialog", "components-radix-checkbox", "components-radix-dialog", "components-radix-dropdown-menu", "components-radix-files", "components-radix-hover-card", "components-radix-popover", "components-radix-preview-link-card", "components-radix-progress", "components-radix-radio-group", "components-radix-sheet", "components-radix-sidebar", "components-radix-switch", "components-radix-tabs", "components-radix-toggle", "components-radix-toggle-group", "components-radix-tooltip", "demo-components-animate-avatar-group", "demo-components-animate-code", "demo-components-animate-code-tabs", "demo-components-animate-cursor", "demo-components-animate-github-stars-wheel", "demo-components-animate-tabs", "demo-components-animate-tooltip", "demo-components-backgrounds-bubble", "demo-components-backgrounds-fireworks", "demo-components-backgrounds-fireworks-circle", "demo-components-backgrounds-gradient", "demo-components-backgrounds-gravity-stars", "demo-components-backgrounds-hexagon", "demo-components-backgrounds-hole", "demo-components-backgrounds-stars", "demo-components-base-accordion", "demo-components-base-alert-dialog", "demo-components-base-checkbox", "demo-components-base-dialog", "demo-components-base-files", "demo-components-base-menu", "demo-components-base-menu-checkbox", "demo-components-base-menu-radio", "demo-components-base-popover", "demo-components-base-preview-card", "demo-components-base-preview-link-card" ], "component_items": [ { "name": "index", "type": "registry:style", "title": null, "description": null }, { "name": "components-animate-avatar-group", "type": "registry:ui", "title": "Avatar Group", "description": "An animated avatar group that displays overlapping user images and smoothly shifts each avatar forward on hover to highlight it." }, { "name": "components-animate-code", "type": "registry:ui", "title": "Code", "description": "A code component that animates the code as it is written." }, { "name": "components-animate-code-tabs", "type": "registry:ui", "title": "Code Tabs", "description": "A tabs component that displays code for different languages." }, { "name": "components-animate-cursor", "type": "registry:ui", "title": "Cursor", "description": "An animated cursor component that allows you to customize both the cursor and cursor follow elements with smooth animations." }, { "name": "components-animate-github-stars-wheel", "type": "registry:ui", "title": "GitHub Stars Wheel", "description": "A scrolling wheel that displays GitHub stars count." }, { "name": "components-animate-tabs", "type": "registry:ui", "title": "Tabs", "description": "A set of layered sections of content—known as tab panels—that are displayed one at a time." }, { "name": "components-animate-tooltip", "type": "registry:ui", "title": "Tooltip", "description": "A tooltip is a small box that appears when hovering over an element." }, { "name": "components-backgrounds-bubble", "type": "registry:ui", "title": "Bubble Background", "description": "An interactive background featuring smoothly animated gradient bubbles, creating a playful, dynamic, and visually engaging backdrop." }, { "name": "components-backgrounds-fireworks", "type": "registry:ui", "title": "Fireworks Background", "description": "A background component that displays a fireworks animation." }, { "name": "components-backgrounds-gradient", "type": "registry:ui", "title": "Gradient Background", "description": "A background component featuring a subtle yet engaging animated gradient effect, smoothly transitioning colors to enhance visual depth." }, { "name": "components-backgrounds-gravity-stars", "type": "registry:ui", "title": "Gravity Stars Background", "description": "A background component featuring a subtle yet engaging animated gravity stars effect." }, { "name": "components-backgrounds-hexagon", "type": "registry:ui", "title": "Hexagon Background", "description": "A background component featuring an interactive hexagon grid." }, { "name": "components-backgrounds-hole", "type": "registry:ui", "title": "Hole Background", "description": "A background component featuring an animated hole grid." }, { "name": "components-backgrounds-stars", "type": "registry:ui", "title": "Stars Background", "description": "An interactive background featuring animated dots of varying sizes and speeds, simulating a dynamic and immersive starry space effect." }, { "name": "components-base-accordion", "type": "registry:ui", "title": "Accordion", "description": "A set of collapsible panels with headings." }, { "name": "components-base-alert-dialog", "type": "registry:ui", "title": "Alert Dialog", "description": "A dialog that requires user response to proceed." }, { "name": "components-base-checkbox", "type": "registry:ui", "title": "Checkbox", "description": "An easily stylable checkbox component." }, { "name": "components-base-dialog", "type": "registry:ui", "title": "Dialog", "description": "A popup that opens on top of the entire page." }, { "name": "components-base-files", "type": "registry:ui", "title": "Files", "description": "A component that allows you to display a list of files and folders." }, { "name": "components-base-menu", "type": "registry:ui", "title": "Menu", "description": "A list of actions in a dropdown, enhanced with keyboard navigation." }, { "name": "components-base-popover", "type": "registry:ui", "title": "Popover", "description": "An accessible popup anchored to a button." }, { "name": "components-base-preview-card", "type": "registry:ui", "title": "Preview Card", "description": "A popup that appears when a link is hovered, showing a preview for sighted users." }, { "name": "components-base-preview-link-card", "type": "registry:ui", "title": "Preview Link Card", "description": "Displays a preview image of a link when hovered." }, { "name": "components-base-progress", "type": "registry:ui", "title": "Progress", "description": "Displays the status of a task that takes a long time." }, { "name": "components-base-radio", "type": "registry:ui", "title": "Base Radio", "description": "An easily stylable radio button component." }, { "name": "components-base-switch", "type": "registry:ui", "title": "Switch", "description": "A control that indicates whether a setting is on or off." }, { "name": "components-base-tabs", "type": "registry:ui", "title": "Tabs", "description": "A component for toggling between related panels on the same page." }, { "name": "components-base-toggle", "type": "registry:ui", "title": "Toggle", "description": "A two-state button that can be on or off." }, { "name": "components-base-toggle-group", "type": "registry:ui", "title": "Toggle Group", "description": "Provides a shared state to a series of toggle buttons." }, { "name": "components-base-tooltip", "type": "registry:ui", "title": "Tooltip", "description": "A popup that appears when an element is hovered or focused, showing a hint for sighted users." }, { "name": "components-buttons-button", "type": "registry:ui", "title": "Button", "description": "A button component with a variety of styles and animations." }, { "name": "components-buttons-copy", "type": "registry:ui", "title": "Copy Button", "description": "A copy button component with a variety of styles and animations." }, { "name": "components-buttons-flip", "type": "registry:ui", "title": "Flip Button", "description": "A button that flips between two states on hover." }, { "name": "components-buttons-github-stars", "type": "registry:ui", "title": "GitHub Stars Button", "description": "A clickable button that links to a GitHub repository and displays the number of stars." }, { "name": "components-buttons-icon", "type": "registry:ui", "title": "Icon Button", "description": "An icon button component with a variety of styles and animations." }, { "name": "components-buttons-liquid", "type": "registry:ui", "title": "Liquid Button", "description": "A button that fills on hover." }, { "name": "components-buttons-ripple", "type": "registry:ui", "title": "Ripple Button", "description": "A button that animates on tap with a ripple effect." }, { "name": "components-buttons-theme-toggler", "type": "registry:ui", "title": "Theme Toggler Button", "description": "A button that toggles the theme gradually." }, { "name": "components-community-flip-card", "type": "registry:ui", "title": "Flip Card", "description": "A 3D animated card component that flips to reveal content on the back." }, { "name": "components-community-management-bar", "type": "registry:ui", "title": "Management Bar", "description": "A management bar for managing items." }, { "name": "components-community-motion-carousel", "type": "registry:ui", "title": "Motion Carousel", "description": "A carousel built on top of Embla Carousel with smooth Motion-powered animations. Each slide scales dynamically based on its active state, and the pagination us…" }, { "name": "components-community-notification-list", "type": "registry:ui", "title": "Notification List", "description": "A fun notification list with animated stacking and cards that expand as you interact." }, { "name": "components-community-pin-list", "type": "registry:ui", "title": "Pin List", "description": "A playful list for pinning and unpinning items, with smooth animated transitions as items move between groups." }, { "name": "components-community-playful-todolist", "type": "registry:ui", "title": "Playful Todolist", "description": "A playful todolist component with animated wavy strikethroughs for each completed task." }, { "name": "components-community-radial-intro", "type": "registry:ui", "title": "Radial Intro", "description": "A circular intro animation component that arranges elements in a radial layout, smoothly transitioning them into orbit with looping motion." }, { "name": "components-community-radial-menu", "type": "registry:ui", "title": "Radial Menu", "description": "A circular context menu built with Base UI, displaying actions in a clean radial layout with full keyboard support and smooth interaction." }, { "name": "components-community-radial-nav", "type": "registry:ui", "title": "Radial Nav", "description": "A circular navigation menu with animated pointer and expanding buttons for smooth interactive transitions." }, { "name": "components-community-share-button", "type": "registry:ui", "title": "Share Button", "description": "This is a button for sharing." }, { "name": "components-community-user-presence-avatar", "type": "registry:ui", "title": "User Presence Avatar", "description": "A compact avatar group for showing online and offline users, with smooth animated transitions when presence changes." }, { "name": "components-headless-accordion", "type": "registry:ui", "title": "Accordion", "description": "A vertically stacked set of interactive headings that each reveal an associated section of content." }, { "name": "components-headless-checkbox", "type": "registry:ui", "title": "Checkbox", "description": "Checkboxes provide the same functionality as native HTML checkboxes, without any of the styling, giving you a clean slate to design them however you'd like." }, { "name": "components-headless-dialog", "type": "registry:ui", "title": "Dialog", "description": "A fully-managed, renderless dialog component jam-packed with accessibility and keyboard features, perfect for building completely custom dialogs and alerts." }, { "name": "components-headless-popover", "type": "registry:ui", "title": "Popover", "description": "Popovers are perfect for floating panels with arbitrary content like navigation menus, mobile menus and flyout menus." }, { "name": "components-headless-switch", "type": "registry:ui", "title": "Switch", "description": "Switches are a pleasant interface for toggling a value between two states, and offer the same semantics and keyboard navigation as native checkbox elements." }, { "name": "components-headless-tabs", "type": "registry:ui", "title": "Tabs", "description": "Easily create accessible, fully customizable tab interfaces, with robust focus management and keyboard navigation support." }, { "name": "components-radix-accordion", "type": "registry:ui", "title": "Accordion", "description": "A vertically stacked set of interactive headings that each reveal an associated section of content." }, { "name": "components-radix-alert-dialog", "type": "registry:ui", "title": "Alert Dialog", "description": "A modal dialog that interrupts the user with important content and expects a response." }, { "name": "components-radix-checkbox", "type": "registry:ui", "title": "Checkbox", "description": "A control that allows the user to toggle between checked and not checked." }, { "name": "components-radix-dialog", "type": "registry:ui", "title": "Dialog", "description": "A window overlaid on either the primary window or another dialog window, rendering the content underneath inert." } ], "component_count": 580, "components_truncated": true, "component_types": { "registry:style": 1, "registry:ui": 573, "registry:hook": 5, "registry:lib": 1 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 15, "name": "@animbits", "category": "Animated components", "tags": [ "aesthetic" ], "tagline": "AnimBits is a collection animated UI components for React that use Framer Motion. The components provided include buttons, cards, text, icons, lists, loaders, and page transitions, animation hooks all of which have general-purpose effects that are not flashy and easy on the eyes, making them easy to use.", "short_description": "AnimBits is a collection animated UI components for React that use Framer Motion. The components provided include buttons, cards, text, icons, lists, loaders, and page transitions, animation hooks all of which have general-purpose effects that are not flashy and easy on the eyes, making them easy to use.", "description": "Production-ready Framer Motion animation component library for React (Next.js 15, TypeScript 5.9). Ships 50+ copy-paste animation components organized into: Icons (heartbeat, pulse, bounce, spin, wiggle, shake, pop, rotate, stroke-draw, fade-in, scale-in), Buttons (lift, ripple, magnetic, glow), Cards, Loaders, Lists, and Page Transitions, plus animation hooks. All components respect prefers-reduced-motion. Install via shadcn CLI. Free, MIT-licensed, dark-mode ready. Use for: adding tasteful, non-flashy micro-interactions to existing components — particularly icons and buttons — in Next.js or Vite projects.", "homepage": "https://animbits.dev", "docs": "https://animbits.dev/docs", "github": "https://github.com/Garvit1000/AnimBits", "components_github": "https://github.com/Garvit1000/AnimBits/tree/main/registry", "github_default_branch": "main", "github_stars": 32, "last_commit": "2026-06-07T05:01:49Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://animbits.dev/r/{name}.json", "registry_index": "https://animbits.dev/r/registry.json", "components": [ "hooks-use-hover-lift", "hooks-use-hover-glow", "hooks-use-press", "hooks-use-fade-in", "hooks-use-scale-in", "hooks-use-slide-in", "hooks-use-pulse", "hooks-use-bounce", "hooks-use-shimmer", "hooks-use-scramble", "hooks-use-word-carousel", "hooks-use-magnetic", "hooks-use-parallax-tilt", "hooks-use-stroke-draw", "hooks-index", "icons-pulse", "icons-bounce", "icons-bounce-continuous", "icons-spin", "icons-wiggle", "icons-shake", "icons-heartbeat", "icons-fade-in", "icons-scale-in", "icons-pop", "icons-rotate", "icons-stroke-draw", "specials-reaction-dock", "specials-reaction-dock-demo", "specials-animated-toast", "spotlight-card", "reaction-button", "specials-border-beam", "specials-border-beam-demo", "buttons-press", "buttons-glow", "buttons-lift", "buttons-shine", "buttons-fade-in", "buttons-slide-in", "buttons-ripple", "buttons-magnetic", "buttons-border-gradient", "cards-hover-lift", "cards-hover-glow", "cards-fade-in", "cards-scale-in", "cards-slide-in", "cards-flip", "cards-tilt", "cards-parallax-tilt", "cards-background-zoom", "text-fade-in", "text-slide-up", "text-typewriter", "text-gradient", "text-blur-in", "text-dia", "text-shimmer", "text-scramble", "text-word-carousel", "text-split-reveal", "text-svg-text-draw", "loaders-spinner", "loaders-dots", "loaders-bars", "loaders-pulse", "loaders-skeleton", "loaders-orbit", "loaders-gooey-blobs", "loaders-morphing", "lists-slide-in", "lists-stagger-fade", "icons-morph", "cards-grayscale", "loaders-liquid-progress", "pages-page-transition-fade", "pages-page-transition-link", "pages-page-transition-slide", "transitions-shared-modal", "transitions-expanding-card", "transitions-tab-switcher", "transitions-view-toggle", "transitions-zoom-hollow", "transitions-theme-toggle-circular", "transitions-theme-toggle-slide-bottom", "transitions-theme-toggle-slide-left", "transitions-theme-toggle-slide-right", "transitions-theme-toggle-slide-top", "text-highlight", "text-highlight-demo", "specials-swipeable-stack", "specials-swipeable-stack-demo", "specials-magnetic-drawer", "specials-magnetic-drawer-demo", "specials-spotlight-card", "specials-spotlight-card-demo", "image-text", "specials-linear-carousel" ], "component_items": [ { "name": "hooks-use-hover-lift", "type": "registry:lib", "title": "Use Hover Lift", "description": "The use-hover-lift hook." }, { "name": "hooks-use-hover-glow", "type": "registry:lib", "title": "Use Hover Glow", "description": "The use-hover-glow hook." }, { "name": "hooks-use-press", "type": "registry:lib", "title": "Use Press", "description": "The use-press hook." }, { "name": "hooks-use-fade-in", "type": "registry:lib", "title": "Use Fade In", "description": "The use-fade-in hook." }, { "name": "hooks-use-scale-in", "type": "registry:lib", "title": "Use Scale In", "description": "The use-scale-in hook." }, { "name": "hooks-use-slide-in", "type": "registry:lib", "title": "Use Slide In", "description": "The use-slide-in hook." }, { "name": "hooks-use-pulse", "type": "registry:lib", "title": "Use Pulse", "description": "The use-pulse hook." }, { "name": "hooks-use-bounce", "type": "registry:lib", "title": "Use Bounce", "description": "The use-bounce hook." }, { "name": "hooks-use-shimmer", "type": "registry:lib", "title": "Use Shimmer", "description": "The use-shimmer hook." }, { "name": "hooks-use-scramble", "type": "registry:lib", "title": "Use Scramble", "description": "The use-scramble hook." }, { "name": "hooks-use-word-carousel", "type": "registry:lib", "title": "Use Word Carousel", "description": "The use-word-carousel hook." }, { "name": "hooks-use-magnetic", "type": "registry:lib", "title": "Use Magnetic", "description": "The use-magnetic hook." }, { "name": "hooks-use-parallax-tilt", "type": "registry:lib", "title": "Use Parallax Tilt", "description": "The use-parallax-tilt hook." }, { "name": "hooks-use-stroke-draw", "type": "registry:lib", "title": "Use Stroke Draw", "description": "The use-stroke-draw hook." }, { "name": "hooks-index", "type": "registry:lib", "title": "Index", "description": "The index hook." }, { "name": "icons-pulse", "type": "registry:component", "title": "Pulse Icon", "description": "Continuous pulsing animation for icons" }, { "name": "icons-bounce", "type": "registry:component", "title": "Bounce Icon", "description": "One-shot bounce animation for icons with configurable triggers" }, { "name": "icons-bounce-continuous", "type": "registry:component", "title": "Bounce Continuous", "description": "Continuous bouncing animation for icons" }, { "name": "icons-spin", "type": "registry:component", "title": "Spin Icon", "description": "Continuous rotation animation for icons" }, { "name": "icons-wiggle", "type": "registry:component", "title": "Wiggle Icon", "description": "One-shot wiggle animation (rotate left-right) for icons" }, { "name": "icons-shake", "type": "registry:component", "title": "Shake Icon", "description": "One-shot shake animation (horizontal shake) for icons" }, { "name": "icons-heartbeat", "type": "registry:component", "title": "Heartbeat Icon", "description": "Continuous heartbeat rhythm animation for icons" }, { "name": "icons-fade-in", "type": "registry:component", "title": "Fade In Icon", "description": "Entrance animation with fade effect for icons" }, { "name": "icons-scale-in", "type": "registry:component", "title": "Scale In Icon", "description": "Entrance animation with scale effect for icons" }, { "name": "icons-pop", "type": "registry:component", "title": "Pop Icon", "description": "One-shot pop effect (scale from 0 to 1) for icons" }, { "name": "icons-rotate", "type": "registry:component", "title": "Rotate Icon", "description": "One-shot 360° rotation animation for icons" }, { "name": "icons-stroke-draw", "type": "registry:component", "title": "Stroke Draw Icon", "description": "SVG path stroke drawing animation for icons" }, { "name": "specials-reaction-dock", "type": "registry:component", "title": "Reaction Dock", "description": "A smooth, scaling dock of reaction emojis with magnification effect" }, { "name": "specials-reaction-dock-demo", "type": "registry:component", "title": "Reaction Dock Demo", "description": "Demo for the Reaction Dock component" }, { "name": "specials-animated-toast", "type": "registry:component", "title": "Animated Toast", "description": "Detailed toast notification with slide-in animation, icon, and auto-dismiss progress bar" }, { "name": "spotlight-card", "type": "registry:ui", "title": null, "description": "An interactive card with a spotlight effect." }, { "name": "reaction-button", "type": "registry:ui", "title": null, "description": null }, { "name": "specials-border-beam", "type": "registry:component", "title": "Border Beam", "description": "An animated gradient border effect that travels around a container" }, { "name": "specials-border-beam-demo", "type": "registry:component", "title": "Border Beam Demo", "description": "Demo for the Border Beam component" }, { "name": "buttons-press", "type": "registry:component", "title": "Press Button", "description": "Button with press-down effect on tap" }, { "name": "buttons-glow", "type": "registry:component", "title": "Glow Button", "description": "Button with glow effect on hover" }, { "name": "buttons-lift", "type": "registry:component", "title": "Lift Button", "description": "Button that lifts up on hover" }, { "name": "buttons-shine", "type": "registry:component", "title": "Shine Button", "description": "Button with shine sweep effect on hover" }, { "name": "buttons-fade-in", "type": "registry:component", "title": "Fade In Button", "description": "Button with fade-in entrance animation" }, { "name": "buttons-slide-in", "type": "registry:component", "title": "Slide In Button", "description": "Button with slide-in entrance animation" }, { "name": "buttons-ripple", "type": "registry:component", "title": "Ripple Button", "description": "Button with touch-aware ripple effect on click" }, { "name": "buttons-magnetic", "type": "registry:component", "title": "Magnetic Button", "description": "Button with cursor-following magnetic attraction effect" }, { "name": "buttons-border-gradient", "type": "registry:component", "title": "Border Gradient Button", "description": "Button with animated gradient border" }, { "name": "cards-hover-lift", "type": "registry:component", "title": "Hover Lift Card", "description": "Card that lifts with shadow on hover" }, { "name": "cards-hover-glow", "type": "registry:component", "title": "Hover Glow Card", "description": "Card with glow effect on hover" }, { "name": "cards-fade-in", "type": "registry:component", "title": "Fade In Card", "description": "Card with fade-in animation on mount" }, { "name": "cards-scale-in", "type": "registry:component", "title": "Scale In Card", "description": "Card with scale-in animation on mount" }, { "name": "cards-slide-in", "type": "registry:component", "title": "Slide In Card", "description": "Card that slides in from any direction on mount" }, { "name": "cards-flip", "type": "registry:component", "title": "Flip Card", "description": "Card with 3D flip animation on hover" }, { "name": "cards-tilt", "type": "registry:component", "title": "Tilt Card", "description": "Card with mouse-tracking tilt effect" }, { "name": "cards-parallax-tilt", "type": "registry:component", "title": "Parallax Tilt Card", "description": "Card with 3D parallax tilt effect and depth" }, { "name": "cards-background-zoom", "type": "registry:component", "title": "Background Zoom Card", "description": "Card with background image zoom on hover" }, { "name": "text-fade-in", "type": "registry:component", "title": "Fade In Text", "description": "Text that fades in word by word or character by character" }, { "name": "text-slide-up", "type": "registry:component", "title": "Slide Up Text", "description": "Text that slides up word by word or character by character" }, { "name": "text-typewriter", "type": "registry:component", "title": "Typewriter Text", "description": "Text with typewriter effect and optional blinking cursor" }, { "name": "text-gradient", "type": "registry:component", "title": "Gradient Text", "description": "Text with animated gradient effect" }, { "name": "text-blur-in", "type": "registry:component", "title": "Blur In Text", "description": "Text that blurs in word by word or character by character" }, { "name": "text-dia", "type": "registry:component", "title": "Dia Text", "description": "Scroll-driven text reveal with precision blur and spring physics" }, { "name": "text-shimmer", "type": "registry:component", "title": "Shimmer Text", "description": "Text with gradient shimmer sweep animation" }, { "name": "text-scramble", "type": "registry:component", "title": "Scramble Text", "description": "Hacker-style text scramble decode animation" } ], "component_count": 99, "components_truncated": false, "component_types": { "registry:lib": 15, "registry:component": 82, "registry:ui": 2 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 16, "name": "@arc", "category": "Niche/single-purpose", "tags": [ "saas", "aesthetic" ], "tagline": "Animated, accessible UI components built with React and Tailwind CSS.", "short_description": "Animated, accessible UI components built with React and Tailwind CSS.", "description": "Minimal shadcn registry from Arc Studio (design agency) exposing two animated, accessible React components: Logo Carousel and Showreel. Built with React and Tailwind CSS using Motion/Framer Motion. No GitHub source listed; documentation is minimal. Free to use. Use for: quickly adding a smooth logo carousel (client/partner logos) or a reel/video showcase section to a marketing landing page without building scroll-animated carousels from scratch.", "homepage": "https://witharc.co/components", "docs": "N/A", "github": "N/A", "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://witharc.co/r/{name}.json", "registry_index": "https://witharc.co/r/registry.json", "components": [ "logo-carousel", "showreel" ], "component_items": [ { "name": "logo-carousel", "type": "registry:component", "title": "Logo Carousel", "description": "Animated logo carousel with staggered cycling, image preloading, and reduced-motion support." }, { "name": "showreel", "type": "registry:component", "title": "Showreel", "description": "Interactive showreel section with animated image transitions and custom hover cursor." } ], "component_count": 2, "components_truncated": false, "component_types": { "registry:component": 2 }, "has_logo": true, "enrichment_errors": [ "github_lookup_failed" ], "featured": false }, { "number": 17, "name": "@asanshay", "category": "AI/chat UI", "tags": [ "ai", "aesthetic" ], "tagline": "Clean, beautiful, and simple UI primitives and AI elements.", "short_description": "Clean, beautiful, and simple UI primitives and AI elements.", "description": "Personal React component registry by Asanshay focused on LLM-ready UI primitives and AI elements. Components include: Window, Badge, Button (including Long Press Button), Code Block, Markdown renderer (ReactMarkdown-based), Select, Input, Number Input, Command Prompt, Invisible Input, Textarea, Card, Description List, Page Header, Loader, Color Picker, Chat, Chat Input, Chat Message, Chat Reasoning, Chat Tool, JSX Preview, Pointer, Reveal, Motion Blur Text, Morphing Text, and ASCII Wave. Tailwind CSS + shadcn/ui based. Free. Use for: assembling an AI chat or agent UI that needs both standard form primitives and specialized LLM output components (reasoning display, tool calls, markdown) in one cohesive visual style.", "homepage": "https://ds.asanshay.com", "docs": "https://ds.asanshay.com", "github": "N/A", "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://ds.asanshay.com/r/{name}.json", "registry_index": "https://ds.asanshay.com/r/registry.json", "components": [ "command-prompt", "pointer", "chat", "window", "jsx-preview", "select", "input", "textarea", "chat-input", "chat-message", "chat-tool", "chat-reasoning", "badge", "button", "long-press-button", "reveal", "card", "description-list", "page-header", "motion-blur-text", "code-block", "markdown", "invisible-input", "loader", "morphing-text", "ascii-wave", "color-picker" ], "component_items": [ { "name": "command-prompt", "type": "registry:component", "title": "Command Prompt", "description": "A keyboard-first command prompt with history and autocomplete." }, { "name": "pointer", "type": "registry:component", "title": "Pointer", "description": "A controllable on-screen pointer that moves to coordinates and shows thoughts." }, { "name": "chat", "type": "registry:component", "title": "Chat", "description": "A complete chat component that composes chat-message and chat-input and wires to /api/chat." }, { "name": "window", "type": "registry:component", "title": "Window", "description": "A draggable, resizable window inside a container." }, { "name": "jsx-preview", "type": "registry:component", "title": "JSX Preview", "description": "A preview of a JSX component rendered from a string. Useful for LLM-generated UIs." }, { "name": "select", "type": "registry:component", "title": "Select", "description": "A lightly skinned select component." }, { "name": "input", "type": "registry:component", "title": "Input", "description": "A simple input component with a tactile feel." }, { "name": "textarea", "type": "registry:component", "title": "Textarea", "description": "An input that can increase in height to accommodate more text." }, { "name": "chat-input", "type": "registry:component", "title": "Chat Input", "description": "A chat input component for a nice chatbot experience. Ready for useChat()." }, { "name": "chat-message", "type": "registry:component", "title": "Chat Message", "description": "A chat message component compatible with the Vercel AI SDK including markdown support, copying, etc." }, { "name": "chat-tool", "type": "registry:component", "title": "Chat Tool", "description": "A chat tool component that displays tool calls and their results." }, { "name": "chat-reasoning", "type": "registry:component", "title": "Chat Reasoning", "description": "A chat reasoning component for a nice chatbot experience. Ready for useChat()." }, { "name": "badge", "type": "registry:component", "title": "Badge", "description": "A clean set of badge components with an edible look." }, { "name": "button", "type": "registry:component", "title": "Button", "description": "A button component that *feels* good to use." }, { "name": "long-press-button", "type": "registry:component", "title": "Long Press Button", "description": "A long-press action button with animated hold progress." }, { "name": "reveal", "type": "registry:component", "title": "Reveal", "description": "A simple wrapper that reveals content when it scrolls into view." }, { "name": "card", "type": "registry:component", "title": "Card", "description": "A variety of clean cards, from minimal to flashy." }, { "name": "description-list", "type": "registry:component", "title": "Description List", "description": "Quickly display a json object in an aesthetically pleasing way." }, { "name": "page-header", "type": "registry:component", "title": "Page Header", "description": "A clean page header so your pages look consistent." }, { "name": "motion-blur-text", "type": "registry:component", "title": "Motion Blur Text", "description": "A cool motion blur text effect." }, { "name": "code-block", "type": "registry:component", "title": "Code Block", "description": "A code block with syntax highlighting and quick copying." }, { "name": "markdown", "type": "registry:component", "title": "Markdown", "description": "A markdown component with a clean look and no-frills parsing." }, { "name": "invisible-input", "type": "registry:component", "title": "Invisible Input", "description": "An unstyled input that looks like text; fully styleable." }, { "name": "loader", "type": "registry:component", "title": "Loader", "description": "Custom WebGL shader loaders with 3 shapes (sphere, swirl, ripple) × 3 styles (plain, blur, dither)." }, { "name": "morphing-text", "type": "registry:component", "title": "Morphing Text", "description": "Text that smoothly animates character changes when the value updates." }, { "name": "ascii-wave", "type": "registry:component", "title": "ASCII Wave", "description": "A flowing ASCII animation with wave-based coloring. Inspired by exa.ai." }, { "name": "color-picker", "type": "registry:component", "title": "Color Picker", "description": "A color picker with OKLCH, HSL, RGB, and HEX support, plus Tailwind CSS presets." } ], "component_count": 27, "components_truncated": false, "component_types": { "registry:component": 27 }, "has_logo": true, "enrichment_errors": [ "github_lookup_failed" ], "featured": false }, { "number": 18, "name": "@assistant-ui", "category": "AI/chat UI", "tags": [ "ai" ], "tagline": "Radix-style React primitives for AI chat with adapters for AI SDK, LangGraph, Mastra, and custom backends.", "short_description": "Radix-style React primitives for AI chat with adapters for AI SDK, LangGraph, Mastra, and custom backends.", "description": "Production-grade open-source React toolkit for building ChatGPT-style AI chat interfaces. Provides Radix-style composable primitives: Thread, Message, Composer, ThreadList, ActionBar, and more — all with streaming, auto-scroll, retries, attachments, markdown, code highlighting, voice dictation, and keyboard shortcuts built in. Adapter packages for Vercel AI SDK, LangGraph/LangChain, AG-UI, A2A, Google ADK, and custom data-stream backends. Supports generative UI (tool-call rendering, inline human approvals). Optional paid Cloud tier for managed thread history, telemetry, and file storage. Y Combinator-backed. Use for: any production AI chat or copilot UI that needs a fully featured, themeable, framework-agnostic chat shell wired to the Vercel AI SDK or LangGraph in minutes.", "homepage": "https://www.assistant-ui.com", "docs": "https://www.assistant-ui.com/docs", "github": "https://github.com/assistant-ui/assistant-ui", "components_github": null, "github_default_branch": "main", "github_stars": 10996, "last_commit": "2026-07-08T08:42:51Z", "archived": false, "license": "MIT", "open_issues": 59, "registry_template": "https://r.assistant-ui.com/{name}.json", "registry_index": "https://r.assistant-ui.com/registry.json", "components": [ "shimmer-style", "chat/b/ai-sdk-quick-start/json", "ai-sdk-backend", "thread", "voice", "markdown-text", "reasoning", "message-timing", "context-display", "thread-list", "mcp-config", "attachment", "follow-up-suggestions", "tooltip-icon-button", "syntax-highlighter", "assistant-modal", "assistant-sidebar", "tool-fallback", "tool-group", "shiki-highlighter", "mermaid-diagram", "diff-viewer", "threadlist-sidebar", "quote", "sources", "image", "file", "model-selector", "select", "direction", "badge", "tabs", "accordion", "dot-matrix", "number-roll", "heat-graph", "composer-trigger-popover", "directive-text" ], "component_items": [ { "name": "shimmer-style", "type": "registry:style", "title": null, "description": null }, { "name": "chat/b/ai-sdk-quick-start/json", "type": "registry:page", "title": null, "description": null }, { "name": "ai-sdk-backend", "type": "registry:page", "title": null, "description": null }, { "name": "thread", "type": "registry:component", "title": null, "description": null }, { "name": "voice", "type": "registry:component", "title": null, "description": null }, { "name": "markdown-text", "type": "registry:component", "title": null, "description": null }, { "name": "reasoning", "type": "registry:component", "title": null, "description": null }, { "name": "message-timing", "type": "registry:component", "title": null, "description": null }, { "name": "context-display", "type": "registry:component", "title": null, "description": null }, { "name": "thread-list", "type": "registry:component", "title": null, "description": null }, { "name": "mcp-config", "type": "registry:component", "title": null, "description": null }, { "name": "attachment", "type": "registry:component", "title": null, "description": null }, { "name": "follow-up-suggestions", "type": "registry:component", "title": null, "description": null }, { "name": "tooltip-icon-button", "type": "registry:component", "title": null, "description": null }, { "name": "syntax-highlighter", "type": "registry:component", "title": null, "description": null }, { "name": "assistant-modal", "type": "registry:component", "title": null, "description": null }, { "name": "assistant-sidebar", "type": "registry:component", "title": null, "description": null }, { "name": "tool-fallback", "type": "registry:component", "title": null, "description": null }, { "name": "tool-group", "type": "registry:component", "title": null, "description": null }, { "name": "shiki-highlighter", "type": "registry:component", "title": null, "description": null }, { "name": "mermaid-diagram", "type": "registry:component", "title": null, "description": null }, { "name": "diff-viewer", "type": "registry:component", "title": null, "description": null }, { "name": "threadlist-sidebar", "type": "registry:component", "title": null, "description": null }, { "name": "quote", "type": "registry:component", "title": null, "description": null }, { "name": "sources", "type": "registry:component", "title": null, "description": null }, { "name": "image", "type": "registry:component", "title": null, "description": null }, { "name": "file", "type": "registry:component", "title": null, "description": null }, { "name": "model-selector", "type": "registry:component", "title": null, "description": null }, { "name": "select", "type": "registry:component", "title": null, "description": null }, { "name": "direction", "type": "registry:ui", "title": null, "description": null }, { "name": "badge", "type": "registry:component", "title": null, "description": null }, { "name": "tabs", "type": "registry:component", "title": null, "description": null }, { "name": "accordion", "type": "registry:component", "title": null, "description": null }, { "name": "dot-matrix", "type": "registry:component", "title": null, "description": null }, { "name": "number-roll", "type": "registry:component", "title": null, "description": null }, { "name": "heat-graph", "type": "registry:component", "title": null, "description": null }, { "name": "composer-trigger-popover", "type": "registry:component", "title": null, "description": null }, { "name": "directive-text", "type": "registry:component", "title": null, "description": null } ], "component_count": 38, "components_truncated": false, "component_types": { "registry:style": 1, "registry:page": 2, "registry:component": 34, "registry:ui": 1 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 19, "name": "@auth0", "category": "Auth/identity", "tags": [ "saas", "ai" ], "tagline": "Official Auth0 Universal Components for Web. Accelerate development with pre-built, embeddable UI for enterprise SSO, MFA, and organization management", "short_description": "Official Auth0 Universal Components for Web. Accelerate development with pre-built, embeddable UI for enterprise SSO, MFA, and organization management", "description": "Official Auth0 Universal Components registry providing pre-built embeddable UI for enterprise-grade authentication flows: SSO login, MFA enrollment, and organization management screens. Designed to accelerate integration of Auth0's identity platform directly into React/Next.js apps with shadcn/ui styling. Requires an Auth0 account; components shell out to Auth0's authentication APIs. Free to use as components; Auth0 platform costs apply per MAU. Use for: enterprise SaaS applications that need fully branded, compliant SSO and MFA flows without building custom OAuth/SAML UI from scratch.", "homepage": "https://auth0.com", "docs": "https://auth0.com/docs", "github": "https://github.com/auth0", "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://ui.auth0.com/r/{name}.json", "registry_index": "https://ui.auth0.com/r/registry.json", "components": [ "my-account/user-mfa-management", "my-organization/organization-details-edit", "my-organization/domain-table", "my-organization/sso-provider-table", "my-organization/sso-provider-create", "my-organization/sso-provider-edit" ], "component_items": [ { "name": "my-account/user-mfa-management", "type": "registry:block", "title": "User MFA Management", "description": "A block for managing Multi-Factor Authentication (MFA) factors, including enrollment and deletion." }, { "name": "my-organization/organization-details-edit", "type": "registry:block", "title": "Organization Management", "description": "A block for managing organization details, including editing organization settings and branding, with delete functionality." }, { "name": "my-organization/domain-table", "type": "registry:block", "title": "Domain Management Table", "description": "A block for managing organization domains, including creating, verifying, configuring identity providers, and deleting domains." }, { "name": "my-organization/sso-provider-table", "type": "registry:block", "title": "SSO Provider Table", "description": "A block for managing SSO identity providers in a table format, including create, edit, delete, enable/disable, and remove from organization capabilities." }, { "name": "my-organization/sso-provider-create", "type": "registry:block", "title": "SSO Provider Creation Wizard", "description": "A multi-step wizard for creating SSO identity providers with support for multiple strategies including SAMLP, OIDC, ADFS, Okta, Google Workspace, Azure AD, and…" }, { "name": "my-organization/sso-provider-edit", "type": "registry:block", "title": "SSO Provider Edit", "description": "A comprehensive block for editing SSO identity providers with tabs for provider configuration, SCIM provisioning settings, and domain management. Includes toke…" } ], "component_count": 6, "components_truncated": false, "component_types": { "registry:block": 6 }, "has_logo": true, "enrichment_errors": [ "github_lookup_failed" ], "featured": false }, { "number": 22, "name": "@baraile-loader", "category": "Uncategorized", "tags": [], "tagline": "A simple braille-inspired loader components for shadcn/ui.", "short_description": "", "description": "A simple braille-inspired loader components for shadcn/ui.", "homepage": "https://shadcn-braille-loader.vercel.app", "docs": null, "github": null, "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://shadcn-braille-loader.vercel.app/r/{name}.json", "registry_index": "https://shadcn-braille-loader.vercel.app/r/registry.json", "components": [ "braille-loader" ], "component_items": [ { "name": "braille-loader", "type": "registry:ui", "title": "Braille Loader", "description": "Accessible braille-inspired loading indicator with 25 animation variants." } ], "component_count": 1, "components_truncated": false, "component_types": { "registry:ui": 1 }, "has_logo": true, "enrichment_errors": [ "docs_unresolved", "github_unresolved" ], "featured": false }, { "number": 20, "name": "@basecn", "category": "Component library (general)", "tags": [ "dashboard", "components" ], "tagline": "Beautifully crafted shadcn/ui components powered by Base UI", "short_description": "Beautifully crafted shadcn/ui components powered by Base UI", "description": "Shadcn/ui component set re-implemented on top of MUI's Base UI headless primitives (instead of Radix). Offers 50+ components: accordion, alert, alert-dialog, aspect-ratio, autocomplete, avatar, badge, breadcrumb, button-group, button, calendar, card, carousel, chart, checkbox, collapsible, combobox (Radix + Base UI variants), command, context-menu, data-table, date-picker, dialog, drawer, dropdown-menu, empty, field, forms (React Hook Form + TanStack Form), hover-card, input-group, input-otp, item, kbd, label, menubar, navigation-menu, pagination, popover, progress, radio-group, resizable, scroll-area, select, separator, sheet, sidebar, and more. Tailwind CSS, TypeScript. Free, MIT-licensed. Use for: teams that prefer MUI Base UI's accessibility model over Radix but still want the shadcn/ui copy-paste workflow and visual style.", "homepage": "https://basecn.dev", "docs": "https://basecn.dev/docs/components/accordion", "github": "https://github.com/akash3444/basecn", "components_github": "https://github.com/akash3444/basecn/tree/main/src/registry", "github_default_branch": "main", "github_stars": 278, "last_commit": "2026-03-14T03:48:55Z", "archived": false, "license": "MIT", "open_issues": 6, "registry_template": "https://basecn.dev/r/{name}.json", "registry_index": "https://basecn.dev/r/registry.json", "components": [ "alert", "accordion", "autocomplete", "alert-dialog", "aspect-ratio", "avatar", "badge", "breadcrumb", "button", "button-group", "card", "carousel", "calendar", "checkbox", "collapsible", "command", "combobox", "context-menu", "dialog", "drawer", "drawer-base", "dropdown-menu", "field", "form", "empty", "form-tanstack", "hover-card", "input", "input-group", "item", "label", "menubar", "kbd", "navigation-menu", "pagination", "popover", "progress", "radio-group", "resizable", "scroll-area", "select", "separator", "separator-extended", "sheet", "sidebar", "skeleton", "slider", "sonner", "spinner", "switch", "table", "tabs", "textarea", "toggle", "toggle-group", "tooltip" ], "component_items": [ { "name": "alert", "type": "registry:ui", "title": "Alert", "description": "Displays a callout for user attention." }, { "name": "accordion", "type": "registry:ui", "title": "Accordion", "description": "A set of collapsible panels with headings." }, { "name": "autocomplete", "type": "registry:ui", "title": "Autocomplete", "description": "An input that suggests options as you type." }, { "name": "alert-dialog", "type": "registry:ui", "title": "Alert Dialog", "description": "A dialog that requires user response to proceed." }, { "name": "aspect-ratio", "type": "registry:ui", "title": "Aspect Ratio", "description": "Displays content within a desired ratio." }, { "name": "avatar", "type": "registry:ui", "title": "Avatar", "description": "An easily stylable avatar component." }, { "name": "badge", "type": "registry:ui", "title": "Badge", "description": "Displays a badge or a component that looks like a badge." }, { "name": "breadcrumb", "type": "registry:ui", "title": "Breadcrumb", "description": "Displays the path to the current resource using a hierarchy of links." }, { "name": "button", "type": "registry:ui", "title": "Button", "description": "Displays a button or a component that looks like a button." }, { "name": "button-group", "type": "registry:ui", "title": "Button Group", "description": "A container that groups related buttons together with consistent styling." }, { "name": "card", "type": "registry:ui", "title": "Card", "description": "Displays a card with header, content, and footer." }, { "name": "carousel", "type": "registry:ui", "title": "Carousel", "description": "A carousel with motion and swipe built using Embla." }, { "name": "calendar", "type": "registry:ui", "title": "Calendar", "description": "A date field component that allows users to enter and edit date." }, { "name": "checkbox", "type": "registry:ui", "title": "Checkbox", "description": "A control that allows the user to toggle between checked and not checked." }, { "name": "collapsible", "type": "registry:ui", "title": "Collapsible", "description": "An interactive component which expands/collapses a panel." }, { "name": "command", "type": "registry:ui", "title": "Command", "description": "Fast, composable, unstyled command menu for React." }, { "name": "combobox", "type": "registry:ui", "title": "Combobox", "description": "An input combined with a list of predefined items to select." }, { "name": "context-menu", "type": "registry:ui", "title": "Context Menu", "description": "Displays a menu to the user — such as a set of actions or functions — triggered by a button." }, { "name": "dialog", "type": "registry:ui", "title": "Dialog", "description": "A window overlaid on either the primary window or another dialog window, rendering the content underneath inert." }, { "name": "drawer", "type": "registry:ui", "title": "Drawer", "description": "A drawer component for React." }, { "name": "drawer-base", "type": "registry:ui", "title": "Drawer (Base UI)", "description": "A panel that slides in from the edge of the screen." }, { "name": "dropdown-menu", "type": "registry:ui", "title": "Dropdown Menu", "description": "Displays a menu to the user — such as a set of actions or functions — triggered by a button." }, { "name": "field", "type": "registry:ui", "title": "Field", "description": "Combine labels, controls, and help text to compose accessible form fields and grouped inputs." }, { "name": "form", "type": "registry:ui", "title": "Form", "description": "Renders a form built with React Hook Form." }, { "name": "empty", "type": "registry:ui", "title": "Empty", "description": "Use the Empty component to display an empty state." }, { "name": "form-tanstack", "type": "registry:ui", "title": "Form", "description": "Renders a form built with Tanstack Form." }, { "name": "hover-card", "type": "registry:ui", "title": "Hover Card", "description": "For sighted users to preview content available behind a link." }, { "name": "input", "type": "registry:ui", "title": "Input", "description": "Displays a form input field or a component that looks like an input field." }, { "name": "input-group", "type": "registry:ui", "title": "Input Group", "description": "Display additional information or actions to an input or textarea." }, { "name": "item", "type": "registry:ui", "title": "Item", "description": "A versatile component that you can use to display any content." }, { "name": "label", "type": "registry:ui", "title": "Label", "description": "Renders an accessible label associated with controls." }, { "name": "menubar", "type": "registry:ui", "title": "Menubar", "description": "A visually persistent menu common in desktop applications that provides quick access to a consistent set of commands." }, { "name": "kbd", "type": "registry:ui", "title": "Kbd", "description": "Used to display textual user input from keyboard." }, { "name": "navigation-menu", "type": "registry:ui", "title": "Navigation Menu", "description": "A collection of links for navigating websites." }, { "name": "pagination", "type": "registry:ui", "title": "Pagination", "description": "Pagination with page navigation, next and previous links." }, { "name": "popover", "type": "registry:ui", "title": "Popover", "description": "Displays rich content in a portal, triggered by a button." }, { "name": "progress", "type": "registry:ui", "title": "Progress", "description": "Displays an indicator showing the completion progress of a task, typically displayed as a progress bar." }, { "name": "radio-group", "type": "registry:ui", "title": "Radio Group", "description": "A set of checkable buttons—known as radio buttons—where no more than one of the buttons can be checked at a time." }, { "name": "resizable", "type": "registry:ui", "title": "Resizable", "description": "Accessible resizable panel groups and layouts with keyboard support." }, { "name": "scroll-area", "type": "registry:ui", "title": "Scroll Area", "description": "Augments native scroll functionality for custom, cross-browser styling." }, { "name": "select", "type": "registry:ui", "title": "Select", "description": "Displays a list of options for the user to pick from—triggered by a button." }, { "name": "separator", "type": "registry:ui", "title": "Separator", "description": "Visually or semantically separates content." }, { "name": "separator-extended", "type": "registry:ui", "title": "Separator (Extended)", "description": "Visually or semantically separates content." }, { "name": "sheet", "type": "registry:ui", "title": "Sheet", "description": "Extends the Dialog component to display content that complements the main content of the screen." }, { "name": "sidebar", "type": "registry:item", "title": "Sidebar", "description": "A composable, themeable and customizable sidebar component." }, { "name": "skeleton", "type": "registry:ui", "title": "Skeleton", "description": "Use to show a placeholder while content is loading." }, { "name": "slider", "type": "registry:ui", "title": "Slider", "description": "An input where the user selects a value from within a given range." }, { "name": "sonner", "type": "registry:ui", "title": "Sonner", "description": "An opinionated toast component for React." }, { "name": "spinner", "type": "registry:ui", "title": "Spinner", "description": "An indicator that can be used to show a loading state." }, { "name": "switch", "type": "registry:ui", "title": "Switch", "description": "A control that allows the user to toggle between checked and not checked." }, { "name": "table", "type": "registry:ui", "title": "Table", "description": "A responsive table component." }, { "name": "tabs", "type": "registry:ui", "title": "Tabs", "description": "A set of layered sections of content, known as tab panels, that are displayed one at a time." }, { "name": "textarea", "type": "registry:ui", "title": "Textarea", "description": "Displays a form textarea or a component that looks like a textarea." }, { "name": "toggle", "type": "registry:ui", "title": "Toggle", "description": "A two-state button that can be either on or off." }, { "name": "toggle-group", "type": "registry:ui", "title": "Toggle Group", "description": "A set of two-state buttons that can be toggled on or off." }, { "name": "tooltip", "type": "registry:ui", "title": "Tooltip", "description": "A popup that displays information related to an element when the element receives keyboard focus or the mouse hovers over it." } ], "component_count": 56, "components_truncated": false, "component_types": { "registry:ui": 55, "registry:item": 1 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 21, "name": "@baselayer", "category": "Component library (general)", "tags": [ "components" ], "tagline": "A collection of components built on React Aria, Tailwind CSS, and tailwind-variants.", "short_description": "A collection of components built on React Aria, Tailwind CSS, and tailwind-variants.", "description": "React component library built on React Aria Components (Adobe) and styled with Tailwind CSS + tailwind-variants, delivering ~25 fully accessible primitives: accordion, badge, breadcrumbs, button, calendar, card, checkbox, combobox, command, date-field, date-picker, input, menu, meter, modal, popover, radio-group, select, slider, switch, table, tabs, tag-group, time-field, toggle, and tooltip. Shadcn CLI compatible; components copy directly to your codebase. MIT-licensed, open-source. MCP server support for Cursor/Claude integration. Use for: accessibility-critical products that require React Aria's WCAG-first primitives but prefer a Tailwind utility styling model over Material Design or Radix.", "homepage": "https://www.baselayer.dev", "docs": "https://www.baselayer.dev/docs/intro", "github": "https://github.com/zwgnr/BaseLayer", "components_github": null, "github_default_branch": "main", "github_stars": 203, "last_commit": "2025-12-24T19:45:58Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://www.baselayer.dev/r/{name}.json", "registry_index": "https://www.baselayer.dev/r/registry.json", "components": [ "accordion", "badge", "breadcrumbs", "button", "calendar", "card", "checkbox", "combobox", "command", "date-field", "date-picker", "input", "menu", "meter", "modal", "popover", "radio-group", "select", "slider", "switch", "table", "tabs", "tag-group", "time-field", "toggle", "tooltip" ], "component_items": [ { "name": "accordion", "type": "registry:ui", "title": "accordion", "description": "An accordion allows users to toggle the display of sections of content. Each accordion consists of a header with a title and content area." }, { "name": "badge", "type": "registry:ui", "title": "badge", "description": "A badge is a small label that can be used to display information or status." }, { "name": "breadcrumbs", "type": "registry:ui", "title": "breadcrumbs", "description": "Breadcrumbs display a heirarchy of links to the current page or resource in an application." }, { "name": "button", "type": "registry:ui", "title": "button", "description": "A button allows a user to perform an action, with mouse, touch, and keyboard interactions." }, { "name": "calendar", "type": "registry:ui", "title": "calendar", "description": "A calendar displays one or more date grids and allows users to select either a single date or a contiguous range of dates." }, { "name": "card", "type": "registry:ui", "title": "card", "description": "Displays a card with header, content, and footer." }, { "name": "checkbox", "type": "registry:ui", "title": "checkbox", "description": "A checkbox allows a user to select multiple items from a list of individual items, or to mark one individual item as selected." }, { "name": "combobox", "type": "registry:ui", "title": "combobox", "description": "A combo box combines a text input with a listbox, allowing users to filter a list of options to items matching a query." }, { "name": "command", "type": "registry:ui", "title": "command", "description": "A command palette that allows users to quickly search and execute commands using keyboard shortcuts." }, { "name": "date-field", "type": "registry:ui", "title": "date-field", "description": "A date field allows users to enter and edit date and time values using a keyboard. Each part of a date value is displayed in an individually editable segment." }, { "name": "date-picker", "type": "registry:ui", "title": "date-picker", "description": "A date picker combines one or more DateFields with a calendar popover, allowing users to enter or select a single date/time or a range." }, { "name": "input", "type": "registry:ui", "title": "input", "description": "Allows a user to enter a plain text value with a keyboard." }, { "name": "menu", "type": "registry:ui", "title": "menu", "description": "A menu displays a list of actions or options that a user can choose." }, { "name": "meter", "type": "registry:ui", "title": "meter", "description": "A meter represents a quantity within a known range, or a fractional value." }, { "name": "modal", "type": "registry:ui", "title": "modal", "description": "A modal is an overlay element which blocks interaction with elements outside it." }, { "name": "popover", "type": "registry:ui", "title": "popover", "description": "A popover is an overlay element positioned relative to a trigger." }, { "name": "radio-group", "type": "registry:ui", "title": "radio-group", "description": "A radio group allows a user to select a single option from a list of mutually exclusive options." }, { "name": "select", "type": "registry:ui", "title": "select", "description": "A select displays a collapsible list of options and allows a user to select one of them." }, { "name": "slider", "type": "registry:ui", "title": "slider", "description": "A slider allows a user to select one or more values within a range." }, { "name": "switch", "type": "registry:ui", "title": "switch", "description": "A switch allows a user to turn a setting on or off." }, { "name": "table", "type": "registry:ui", "title": "table", "description": "A table displays data in rows and columns and enables a user to navigate its contents via directional navigation keys, and optionally supports row selection an…" }, { "name": "tabs", "type": "registry:ui", "title": "tabs", "description": "Tabs organize content into multiple sections and allow users to navigate between them." }, { "name": "tag-group", "type": "registry:ui", "title": "tag-group", "description": "A tag group is a focusable list of labels, categories, keywords, filters, or other items, with support for keyboard navigation, selection, and removal." }, { "name": "time-field", "type": "registry:ui", "title": "time-field", "description": "A time field allows users to enter and edit time values using a keyboard. Each part of a time value is displayed in an individually editable segment." }, { "name": "toggle", "type": "registry:ui", "title": "toggle", "description": "A toggle button allows a user to toggle a selection on or off, for example switching between two states or modes." }, { "name": "tooltip", "type": "registry:ui", "title": "tooltip", "description": "A tooltip displays a description of an element on hover or focus." } ], "component_count": 26, "components_truncated": false, "component_types": { "registry:ui": 26 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 22, "name": "@beste-ui", "category": "Blocks & sections (marketing/SaaS)", "tags": [ "saas", "dashboard" ], "tagline": "Production-ready UI blocks for landing pages, dashboards, and web apps.", "short_description": "Production-ready UI blocks for landing pages, dashboards, and web apps.", "description": "A curated collection of 1,163+ production-ready shadcn/ui blocks built with React, Tailwind CSS, and Next.js, organized into named categories including hero, feature, pricing, cta, faq, stats, auth, careers, news, ecommerce, onboarding, food, booking, event, travel, blog, chat, portfolio, and more. Each block is individually installable via the shadcn CLI. Free and open source. Use for: quickly assembling diverse landing pages and web-app screens without building blocks from scratch.", "homepage": "https://ui.beste.co", "docs": "https://ui.beste.co", "github": "https://github.com/beste-co/beste-ui", "components_github": "https://github.com/beste-co/beste-ui/tree/main/components", "github_default_branch": "main", "github_stars": 22, "last_commit": "2026-07-04T21:10:08Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://ui.beste.co/r/{name}.json", "registry_index": "https://ui.beste.co/r/registry.json", "components": [ "about1", "about2", "about3", "about4", "about5", "about6", "about7", "about8", "about9", "about10", "about11", "about12", "about13", "about14", "about15", "about16", "about17", "about18", "about19", "about20", "about21", "about22", "about23", "about24", "about25", "about26", "about27", "about28", "about29", "about30", "about31", "about32", "about33", "about34", "about35", "about36", "about37", "about38", "about39", "about40", "about41", "about42", "about43", "about44", "about45", "about46", "about47", "about48", "about49", "about50", "about51", "about52", "about53", "about54", "about55", "about56", "about57", "about58", "about59", "about60", "about61", "about62", "about63", "about64", "about65", "about66", "about67", "about68", "agency10", "agency11", "agency12", "agency13", "agency14", "agency15", "agency16", "agency17", "agency18", "agency19", "agency20", "agency21", "agency22", "agency23", "auth1", "auth2", "auth3", "auth4", "auth5", "auth6", "auth7", "auth8", "auth9", "auth10", "auth11", "auth12", "auth13", "auth14", "auth15", "auth16", "auth17", "auth18" ], "component_items": [ { "name": "about1", "type": "registry:block", "title": "Team & Mission", "description": "Two-column about section with mission statement, company stats, and team member grid. Perfect for company pages and landing sections." }, { "name": "about2", "type": "registry:block", "title": "Values with Team Photo", "description": "Full-width team photo with a three-column values grid below. Great for culture pages and brand storytelling." }, { "name": "about3", "type": "registry:block", "title": "Timeline & Milestones", "description": "Two-column layout with company stats on the left and a vertical timeline of milestones on the right. Ideal for company history and growth stories." }, { "name": "about4", "type": "registry:block", "title": "Founder Quote & Team", "description": "Founder blockquote with avatar, followed by a horizontal team member row. Ideal for leadership pages and company introductions." }, { "name": "about5", "type": "registry:block", "title": "Image & Text Split", "description": "Side-by-side layout with a tall image on the left and company story, inline stats, and CTAs on the right." }, { "name": "about6", "type": "registry:block", "title": "Numbered Principles", "description": "Asymmetric two-column layout with heading on the left and numbered company principles on the right. Clean and editorial." }, { "name": "about7", "type": "registry:block", "title": "Team Cards with Bios", "description": "Three-column grid of team member cards with avatars, roles, and short bios. Great for leadership and team pages." }, { "name": "about8", "type": "registry:block", "title": "Stats with Descriptions", "description": "Four-column stats grid with large numbers, titles, and supporting descriptions. Perfect for impact and results sections." }, { "name": "about9", "type": "registry:block", "title": "Mission & Trust Logos", "description": "Centered mission statement with a logo strip of trusted partners below. Ideal for building credibility on landing and about pages." }, { "name": "about10", "type": "registry:block", "title": "Bento Grid About", "description": "Asymmetric bento grid combining a mission card, team photo, stats, and stacked avatars. A modern, compact about section." }, { "name": "about11", "type": "registry:block", "title": "Hero Banner with Avatars", "description": "Wide hero image with gradient overlay text, inline stats, and a stacked avatar strip of team members." }, { "name": "about12", "type": "registry:block", "title": "Process Steps", "description": "Four-column numbered process cards showing how your company works. Each step has a large number, title, and description." }, { "name": "about13", "type": "registry:block", "title": "Company Profile", "description": "Asymmetric layout with company story and image on the left, and a vertical list of company details on the right. Great for press and investor pages." }, { "name": "about14", "type": "registry:block", "title": "Stats Bar with Story Card", "description": "Horizontal stats row at the top followed by a centered story card with heading, body text, and CTAs." }, { "name": "about15", "type": "registry:block", "title": "Letter from the CEO", "description": "Editorial-style open letter with paragraphs, a personal signature with avatar, and a call-to-action. Great for founder stories." }, { "name": "about16", "type": "registry:block", "title": "Vision Mission Values", "description": "Three-column cards for vision, mission, and values with labeled headers. Clean editorial layout for company positioning." }, { "name": "about17", "type": "registry:block", "title": "Awards & Recognition", "description": "Vertical list of awards and accolades with icons, titles, organizations, and years. Ideal for press and credibility sections." }, { "name": "about18", "type": "registry:block", "title": "Office Locations Grid", "description": "Four-column grid of office cards with city, country, address, and team size. Ideal for global companies." }, { "name": "about19", "type": "registry:block", "title": "Company At a Glance", "description": "Full company overview with panoramic image, story paragraph, key facts list, leadership quote, and stats row. A rich, multi-section layout for company landing …" }, { "name": "about20", "type": "registry:block", "title": "Team Photo & List", "description": "Wide team photo, member list with avatars, team stats grid, and a culture quote. A rich team showcase layout." }, { "name": "about21", "type": "registry:block", "title": "Checklist & Image Split", "description": "Two-column layout with checklist highlights on the left, featured image and testimonial quote on the right, plus a full-width stats row." }, { "name": "about22", "type": "registry:block", "title": "Q&A About Us", "description": "Asymmetric two-column layout with heading on the left and question-answer pairs on the right. A conversational way to introduce your company." }, { "name": "about23", "type": "registry:block", "title": "Story, Image & Team Row", "description": "Two-column layout with company story, stats, and leadership quote on the left, team photo and avatar row on the right." }, { "name": "about24", "type": "registry:block", "title": "Company Heritage & Features", "description": "Company story with image, border-accented feature highlights, and stats row. Great for craft, heritage, and product-focused brands." }, { "name": "about25", "type": "registry:block", "title": "Animated Stats & Value Cards", "description": "Side-by-side intro with animated number counters on scroll, expanding accent bars, and hover-lift value cards. For impact-driven companies." }, { "name": "about26", "type": "registry:block", "title": "Interactive Pillar Tabs & Image", "description": "Centered header with interactive hover tabs that crossfade a side image. Accordion descriptions and sliding accent line. For studios and agencies." }, { "name": "about27", "type": "registry:block", "title": "Split Intro & Animated Timeline", "description": "Left intro with image, right vertical timeline with staggered scroll-reveal animation. Numbered steps with sliding content. For startup journeys." }, { "name": "about28", "type": "registry:block", "title": "Marquee Stats & Team Split", "description": "Full-width animated marquee stats ticker, split layout with intro text and leadership avatars on the left, full-height image on the right. For SaaS and product…" }, { "name": "about29", "type": "registry:block", "title": "Wide Banner & Product Cards", "description": "Centered header with wide panoramic image, product cards with layered attributes, and sourcing grid." }, { "name": "about30", "type": "registry:block", "title": "Banner Split & Process Steps", "description": "Panoramic image with split header showing numbered process steps alongside. For studios and creative agencies." }, { "name": "about31", "type": "registry:block", "title": "Hero Overlay & Suite Cards", "description": "Dark-overlay hero image with heading, suite/room cards with temperature and capacity badges. For hotels and hospitality." }, { "name": "about32", "type": "registry:block", "title": "Two Image Layout", "description": "Centered heading with description, followed by two images side-by-side. Configurable image ratio (equal, left larger, right larger). Always horizontal on mobil…" }, { "name": "about33", "type": "registry:block", "title": "About With Stats Band", "description": "About section with an eyebrow label and read-more action on the left, a bold heading with two side-by-side images on the right, and a four-column stats band be…" }, { "name": "about34", "type": "registry:block", "title": "About Stats Grid", "description": "About section: eyebrow label, two-tone heading, two portraits beside a 2x2 stats grid." }, { "name": "about35", "type": "registry:block", "title": "About Media Reel", "description": "About section with eyebrow, stacked stats and a read-more CTA beside a media card with a watch-reel play button." }, { "name": "about36", "type": "registry:block", "title": "Edge Label About", "description": "Asymmetric about with a bleeding image, vertical edge label, offset copy and an inline stats row." }, { "name": "about37", "type": "registry:block", "title": "Index Columns About", "description": "Three uneven columns: a studio fact index, an oversized statement, and a portrait with signature." }, { "name": "about38", "type": "registry:block", "title": "Overlap Heading About", "description": "About where a large heading overlaps a portrait, with a paragraph, CTA and a bottom stat ribbon." }, { "name": "about39", "type": "registry:block", "title": "Numeral About", "description": "About anchored by an oversized numeral with a paragraph and a horizontal image strip." }, { "name": "about40", "type": "registry:block", "title": "Interleaved About", "description": "Magazine about where copy is interleaved between two staggered offset images." }, { "name": "about41", "type": "registry:block", "title": "Story Rail About", "description": "Sticky eyebrow rail beside a story column and an offset captioned image." }, { "name": "about42", "type": "registry:block", "title": "Framed Studio Card", "description": "About composed inside a bordered studio card with header marks, portrait and a stats strip." }, { "name": "about43", "type": "registry:block", "title": "Heading Hero About", "description": "An oversized about statement hero above three heterogeneous zones: portrait, values and a CTA with stats." }, { "name": "about44", "type": "registry:block", "title": "Marquee Accent About", "description": "Layered about over a faint scrolling studio-word marquee with offset images and stats." }, { "name": "about45", "type": "registry:block", "title": "Founder Quote About", "description": "A founder-led pull-quote about with a portrait, signature and a facts strip." }, { "name": "about46", "type": "registry:block", "title": "About Strip", "description": "An about intro followed by a horizontally scrollable strip mixing image, stat, quote and values cards." }, { "name": "about47", "type": "registry:block", "title": "Split Panel About", "description": "A hard light/dark split about panel: dark statement side and a light image-and-facts side." }, { "name": "about48", "type": "registry:block", "title": "Principles About", "description": "About pairing a sticky studio statement and image with a numbered list of operating principles." }, { "name": "about49", "type": "registry:block", "title": "Founder Statement About", "description": "About built around a dark founder portrait card with a pull-quote, signature, and supporting stats." }, { "name": "about50", "type": "registry:block", "title": "Chaptered About", "description": "A pinned studio image beside a numbered, chaptered about story." }, { "name": "about51", "type": "registry:block", "title": "Beliefs About", "description": "A statement heading over a belief list punctuated by intermittent inline thumbnails." }, { "name": "about52", "type": "registry:block", "title": "Spec Sheet About", "description": "About styled as a technical spec sheet with coordinate marks, a data column and a portrait." }, { "name": "about53", "type": "registry:block", "title": "Pinned Photos About", "description": "About with two subtly rotated, captioned studio photos clustered beside the statement." }, { "name": "about54", "type": "registry:block", "title": "Inset Card About", "description": "A cinematic wide image with an overlapping inset content card and a stat ribbon." }, { "name": "about55", "type": "registry:block", "title": "Four Parts About", "description": "A type-led about with an oversized statement and a four-part Who/What/How/Why grid." }, { "name": "about56", "type": "registry:block", "title": "Showcase Hero With Video", "description": "Large heading with dual CTAs and a rating card, a playable video with floating metric cards, and a labelled about block with large paragraphs." }, { "name": "about57", "type": "registry:block", "title": "Values And Mission Statement", "description": "Two centered statements on a dark surface, each with an accent heading, an uppercase paragraph, and a small label beneath." }, { "name": "about58", "type": "registry:block", "title": "About Statement Card", "description": "About section on a soft muted card with a monospace parenthetical eyebrow, a bold studio wordmark, a large centered statement, a logos strip, and a four-column…" }, { "name": "about59", "type": "registry:block", "title": "About Statement With Pillars", "description": "Centered parenthetical eyebrow and a large statement heading, followed by a three-up row of icon pillars pairing a circular icon with a title and one-line desc…" }, { "name": "about60", "type": "registry:block", "title": "Team Member Grid", "description": "Team section with an eyebrow, big heading, description and CTA above a responsive grid of people cards (portrait image, name, role)." } ], "component_count": 1498, "components_truncated": true, "component_types": { "registry:block": 1498 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 23, "name": "@better-upload", "category": "Niche/single-purpose", "tags": [ "components" ], "tagline": "Simple and easy file uploads for React. Upload directly to any S3-compatible service with minimal setup.", "short_description": "Simple and easy file uploads for React. Upload directly to any S3-compatible service with minimal setup.", "description": "A React file-upload library that handles direct-to-S3 (and S3-compatible) uploads with minimal setup. Provides an UploadButton, UploadDropzone, PasteUploadArea components, upload-progress indicators, and React hooks (including TanStack Query integration). Works with Next.js, TanStack Start, and any React framework. MIT-licensed, free. Use for: adding drag-and-drop or button-triggered file uploads to any React app without a dedicated file-storage backend.", "homepage": "https://better-upload.com", "docs": "https://better-upload.com/docs", "github": "https://github.com/Nic13Gamer/better-upload", "components_github": null, "github_default_branch": "main", "github_stars": 1276, "last_commit": "2026-07-04T05:09:48Z", "archived": false, "license": "MIT", "open_issues": 6, "registry_template": "https://better-upload.com/r/{name}.json", "registry_index": "https://better-upload.com/r/registry.json", "components": [ "upload-button", "upload-dropzone", "upload-progress", "paste-upload-area" ], "component_items": [ { "name": "upload-button", "type": "registry:ui", "title": "Upload Button", "description": null }, { "name": "upload-dropzone", "type": "registry:ui", "title": "Upload Dropzone", "description": null }, { "name": "upload-progress", "type": "registry:ui", "title": "Upload Progress", "description": null }, { "name": "paste-upload-area", "type": "registry:ui", "title": "Paste Upload Area", "description": null } ], "component_count": 4, "components_truncated": false, "component_types": { "registry:ui": 4 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 27, "name": "@beui", "category": "Uncategorized", "tags": [], "tagline": "Bespoke motion components for React. Copy-paste components with shadcn-compatible installs, Tailwind CSS v4, and Motion.", "short_description": "", "description": "Bespoke motion components for React. Copy-paste components with shadcn-compatible installs, Tailwind CSS v4, and Motion.", "homepage": "https://beui.dev", "docs": null, "github": "https://github.com/starc007/ui-components", "components_github": "https://github.com/starc007/ui-components/tree/main/components", "github_default_branch": "main", "github_stars": 608, "last_commit": "2026-07-07T17:30:13Z", "archived": false, "license": "MIT", "open_issues": 1, "registry_template": "https://beui.dev/r/{name}.json", "registry_index": "https://beui.dev/r/registry.json", "components": [ "tilt-card", "button-base", "button-stateful", "button-magnetic", "marquee", "tabs", "switch", "input", "select", "select-morph", "checkbox", "radio", "bottom-sheet", "shared-layout-bg", "dock", "tooltip", "popover", "morphing-modal", "text-reveal", "text-shimmer", "text-cascade", "number-ticker", "animated-number", "animated-badge", "action-swap-cascade", "action-swap-blur", "action-swap-roll", "animated-toast-stack", "theme-toggle", "bouncy-accordion", "drawer", "smooth-scroll", "scroll-progress", "parallax", "scroll-to", "scroll-reveal", "range-slider", "table", "table-editable", "table-async", "shader-background", "cylinder-carousel", "loader", "swap", "dynamic-island", "command-palette", "expandable-action-bar", "overflow-actions", "expandable-tabs", "swipeable-list", "file-upload", "prediction-market", "wallet-card", "otp-input", "bloom-menu", "feedback-widget", "not-found-glitch", "not-found-magnetic", "not-found-spotlight", "not-found-stacked", "not-found-terminal" ], "component_items": [ { "name": "tilt-card", "type": "registry:component", "title": "Tilt Card", "description": "3D perspective tilt on hover with cursor-tracked glare." }, { "name": "button-base", "type": "registry:component", "title": "Button Button", "description": "Press scale, hover lift, variants and sizes." }, { "name": "button-stateful", "type": "registry:component", "title": "Button Stateful Button", "description": "Idle → loading → success / error with blur-swap slots and morphing width." }, { "name": "button-magnetic", "type": "registry:component", "title": "Button Magnetic Button", "description": "Button composed with the Magnetic wrapper for cursor-attracted pull." }, { "name": "marquee", "type": "registry:component", "title": "Marquee", "description": "Infinite horizontal or vertical scroll with pause-on-hover." }, { "name": "tabs", "type": "registry:component", "title": "Tabs", "description": "Pill, segment or underline tabs with a spring layoutId indicator." }, { "name": "switch", "type": "registry:component", "title": "Switch", "description": "Toggle with a spring-driven thumb and press feedback." }, { "name": "input", "type": "registry:component", "title": "Input", "description": "Text input with label, left/right icons, error shake and success check draw." }, { "name": "select", "type": "registry:component", "title": "Select Select", "description": "Composable primitives (Select, SelectTrigger, SelectValue, SelectContent, SelectItem); the panel pinches off the trigger and separates, with staggered items. P…" }, { "name": "select-morph", "type": "registry:component", "title": "Select Morph Select", "description": "Composable primitives (MorphSelect, MorphSelectTrigger, MorphSelectValue, MorphSelectContent, MorphSelectItem) where the trigger morphs into the panel via a sh…" }, { "name": "checkbox", "type": "registry:component", "title": "Checkbox", "description": "Form choice control with a draw-on checkmark, spring press feedback and indeterminate state support." }, { "name": "radio", "type": "registry:component", "title": "Radio Group", "description": "Single-select choice control with a gliding layoutId indicator dot and spring press feedback." }, { "name": "bottom-sheet", "type": "registry:component", "title": "Bottom Sheet", "description": "Vaul-inspired draggable bottom sheet with snap points, inertia and glass surface." }, { "name": "shared-layout-bg", "type": "registry:component", "title": "Shared Layout Background", "description": "A pill that glides between hovered items via motion's shared layout, with blur enter/exit." }, { "name": "dock", "type": "registry:component", "title": "Dock", "description": "macOS-style dock with grouped actions and a gliding active pill." }, { "name": "tooltip", "type": "registry:component", "title": "Tooltip", "description": "Hover or focus tooltip with blur enter/exit and spring spawn." }, { "name": "popover", "type": "registry:component", "title": "Popover", "description": "Gooey popover whose panel oozes out of the trigger through an SVG goo filter — a liquid neck that stretches and pinches — with crisp content fading in on top. …" }, { "name": "morphing-modal", "type": "registry:component", "title": "Morphing Modal", "description": "Family-app-style modal. A single panel that morphs its height as you navigate between inner views, with blur cross-fade on content." }, { "name": "text-reveal", "type": "registry:component", "title": "Text Animation Text Reveal", "description": "Word or character reveal with spring slide-up and blur." }, { "name": "text-shimmer", "type": "registry:component", "title": "Text Animation Text Shimmer", "description": "Gradient sweep across text for loading or emphasis." }, { "name": "text-cascade", "type": "registry:component", "title": "Text Animation Text Cascade", "description": "Letter-by-letter slot roll for standalone text — old letters drop away as new ones land, left to right." }, { "name": "number-ticker", "type": "registry:component", "title": "Number Animation Number Ticker", "description": "Slot-machine rolling digits with staggered entry." }, { "name": "animated-number", "type": "registry:component", "title": "Number Animation Animated Number", "description": "Spring-driven count-up triggered when in view." }, { "name": "animated-badge", "type": "registry:component", "title": "Animated Badge", "description": "Status badge with animated state icons, pulse feedback and compact size variants." }, { "name": "action-swap-cascade", "type": "registry:component", "title": "Action Swap Cascade", "description": "Letter-by-letter slot roll — the old label's letters drop away as the new ones land, left to right." }, { "name": "action-swap-blur", "type": "registry:component", "title": "Action Swap Blur", "description": "Copy-button style swap with blur, opacity and scale." }, { "name": "action-swap-roll", "type": "registry:component", "title": "Action Swap Roll", "description": "The next text or icon rolls in from below with blur." }, { "name": "animated-toast-stack", "type": "registry:component", "title": "Animated Toast Stack", "description": "Stacked toasts with status morphs, swipe dismissal, actions and layout-aware motion." }, { "name": "theme-toggle", "type": "registry:component", "title": "Theme Toggle", "description": "Theme toggle button with a full-page rectangle clip-path reveal via the View Transition API." }, { "name": "bouncy-accordion", "type": "registry:component", "title": "Bouncy Accordion", "description": "Single-open accordion with weighted spring layout, icon rows and reduced-motion-safe content reveals." }, { "name": "drawer", "type": "registry:component", "title": "Drawer", "description": "Side panel that slides in from the left or right with a spring, backdrop blur, body scroll lock and esc-to-close." }, { "name": "smooth-scroll", "type": "registry:component", "title": "Scroll Animation Smooth Scroll", "description": "Smooth-scroll provider over Lenis with a useSmoothScroll hook exposing scroll offset, progress and velocity. Reduced-motion safe." }, { "name": "scroll-progress", "type": "registry:component", "title": "Scroll Animation Scroll Progress", "description": "Reading-progress indicator — fixed bar or circular ring — driven by scroll position via useSmoothScroll, with spring smoothing." }, { "name": "parallax", "type": "registry:component", "title": "Scroll Animation Parallax", "description": "Wrapper that drifts its children at a speed factor as they cross the viewport, on either axis. Reduced-motion safe." }, { "name": "scroll-to", "type": "registry:component", "title": "Scroll Animation Scroll To", "description": "Button that smooth-scrolls to a target (offset, selector or element) via the active SmoothScroll provider; reduced-motion jumps instantly." }, { "name": "scroll-reveal", "type": "registry:component", "title": "Scroll Animation Scroll Reveal", "description": "Reveals its children with a spring slide and blur as they enter the viewport, once or every time. Reduced-motion keeps a fade." }, { "name": "range-slider", "type": "registry:component", "title": "Range Slider", "description": "Range slider with tick dots and a bouncy vertical-bar thumb that glides between snapped steps; drag and keyboard control, reduced-motion safe." }, { "name": "table", "type": "registry:component", "title": "Table Data Table", "description": "10k virtualized rows with sortable headers, row selection, column resize and reorder." }, { "name": "table-editable", "type": "registry:component", "title": "Table Editable Table", "description": "Edit cells inline and insert or delete rows and columns via border handles; the table re-renders from the updated data and column defs." }, { "name": "table-async", "type": "registry:component", "title": "Table Async Table", "description": "Loads pages on demand — skeleton rows on first load, then infinite scroll via onEndReached as the virtualized list nears the bottom." }, { "name": "shader-background", "type": "registry:component", "title": "Shader Background", "description": "Canvas shader backgrounds (mesh gradient, grain, warp, waves, voronoi, dot orbit and more) with a single typed variant prop. Reduced-motion freezes animated va…" }, { "name": "cylinder-carousel", "type": "registry:component", "title": "Cylinder Carousel", "description": "A carousel whose items line the inside of a cylinder, receding into the center and growing toward the edges. Drag, scroll or arrow-key to roll it, with a sprin…" }, { "name": "loader", "type": "registry:component", "title": "Loader", "description": "Loading indicator with seventeen variants: spinner, dots, bars, dot-matrix, dither, morph, comet, scramble, metaballs, newton, helix, percent, and five termina…" }, { "name": "swap", "type": "registry:block", "title": "Multi-chain Swap", "description": "Cross-chain swap widget with chain + token selectors, morphing views, animated flip and quote." }, { "name": "dynamic-island", "type": "registry:block", "title": "Dynamic Island", "description": "iOS-style island pill that morphs between live activity views with bouncy shell resize and blur crossfades." }, { "name": "command-palette", "type": "registry:block", "title": "Command Palette", "description": "⌘K palette with fuzzy filter, spring-animated active row and glass surface." }, { "name": "expandable-action-bar", "type": "registry:block", "title": "Expandable Action Bar", "description": "Compact icon actions that expand into labeled controls on hover or focus with shared layout motion." }, { "name": "overflow-actions", "type": "registry:block", "title": "Overflow Actions", "description": "Connected pill rail for primary actions that springs open to reveal extra controls." }, { "name": "expandable-tabs", "type": "registry:block", "title": "Expandable Tabs", "description": "Icon tab bar where the active tab expands to a labelled pill, with a panel above that morphs height and slides content direction-aware on switch." }, { "name": "swipeable-list", "type": "registry:block", "title": "Swipeable List", "description": "Mobile-style list rows that swipe left or right to reveal contextual action buttons." }, { "name": "file-upload", "type": "registry:block", "title": "File Upload", "description": "Drag-and-drop upload queue with progress rows, retry/remove actions and reduced-motion-safe state changes." }, { "name": "prediction-market", "type": "registry:block", "title": "Prediction Market", "description": "Prediction market trade ticket with buy/sell modes, outcome prices, rolling amount entry, quick add chips and trade states." }, { "name": "wallet-card", "type": "registry:block", "title": "Wallet Card", "description": "Wallet overview card with an account switcher and search that morph open from their triggers, a cascading balance with a live change pill and privacy toggle, c…" }, { "name": "otp-input", "type": "registry:block", "title": "OTP Input", "description": "One-time-code input with a gliding focus ring, digits that roll in per slot, error shake and a success check draw." }, { "name": "bloom-menu", "type": "registry:block", "title": "Bloom Menu", "description": "A button that morphs open into a menu and blooms iris-out from the center, the grid revealing in every direction with radially staggered items." }, { "name": "feedback-widget", "type": "registry:block", "title": "Feedback Widget", "description": "Corner trigger that morphs open into a feedback popup with message entry and animated sending, success and retry states." }, { "name": "not-found-glitch", "type": "registry:block", "title": "404 / Not Found Glitch", "description": "Digits scramble through random glyphs before resolving, with a chromatic split on hover." }, { "name": "not-found-magnetic", "type": "registry:block", "title": "404 / Not Found Magnetic", "description": "Each digit is cursor-attracted via the Magnetic wrapper and springs back on leave." }, { "name": "not-found-spotlight", "type": "registry:block", "title": "404 / Not Found Spotlight", "description": "A dark panel where a cursor-tracked spotlight reveals the bright code from a dim base." }, { "name": "not-found-stacked", "type": "registry:block", "title": "404 / Not Found Stacked", "description": "A code card over a hidden stack that fans out with a spring on hover." } ], "component_count": 61, "components_truncated": false, "component_types": { "registry:component": 43, "registry:block": 18 }, "has_logo": true, "enrichment_errors": [ "docs_unresolved" ], "featured": true }, { "number": 24, "name": "@billingsdk", "category": "E-commerce/payments", "tags": [ "saas", "aesthetic" ], "tagline": "BillingSDK is an open-source React and Next.js component library for SaaS billing and payments. It offers ready-to-use, customizable components for subscriptions, invoices, usage-based pricing and billing - fully compatible with Dodo Payments and Stripe.", "short_description": "BillingSDK is an open-source React and Next.js component library for SaaS billing and payments. It offers ready-to-use, customizable components for subscriptions, invoices, usage-based pricing and billing - fully compatible with Dodo Payments and Stripe.", "description": "Open-source, TypeScript-first React component library for SaaS billing flows. Contains 30+ components including eight pricing-table variants, subscription management, usage meters (linear and circular), banner notifications, plan upgrade/downgrade cards, cancellation flows, invoice history, payment-method selector, payment success/failure dialogs, and trial-expiry cards. Built with Tailwind CSS v4, Motion animations, and shadcn/ui; supports Dodo Payments and Stripe. Part of the Vercel OSS Program. Use for: wiring up an end-to-end billing and subscription UI without designing payment flows from scratch.", "homepage": "https://billingsdk.com", "docs": "https://billingsdk.com/docs", "github": "https://github.com/dodopayments/billingsdk", "components_github": "https://github.com/dodopayments/billingsdk/tree/main/src/registry", "github_default_branch": "main", "github_stars": 483, "last_commit": "2026-06-19T11:21:30Z", "archived": false, "license": "GPL-3.0", "open_issues": 15, "registry_template": "https://billingsdk.com/r/{name}.json", "registry_index": "https://billingsdk.com/r/registry.json", "components": [ "index", "all", "hello-world", "invoice-history", "pricing-table-one", "pricing-table-two", "pricing-table-three", "pricing-table-four", "pricing-table-five", "pricing-table-six", "pricing-table-seven", "pricing-table-eight", "cancel-subscription-dialog", "cancel-subscription-card", "usage-based-pricing", "update-plan-dialog", "update-plan-card", "subscription-management", "usage-meter-linear", "usage-meter-circle", "banner", "payment-method-selector", "payment-details", "payment-details-two", "billing-settings", "billing-settings-2", "proration-preview", "detailed-usage-table", "usage-table", "upcoming-charges", "payment-card", "limited-offer-dialog", "trial-expiry-card", "payment-failure", "billing-screen" ], "component_items": [ { "name": "index", "type": "registry:lib", "title": "BillingSDK Config", "description": "Config for BillingSDK components" }, { "name": "all", "type": "registry:block", "title": "All Components", "description": "All components in the BillingSDK" }, { "name": "hello-world", "type": "registry:block", "title": "Hello World Component", "description": "A simple hello world component" }, { "name": "invoice-history", "type": "registry:block", "title": "Invoice History", "description": "A read-only invoice history table" }, { "name": "pricing-table-one", "type": "registry:block", "title": "Pricing Table One", "description": "A pricing table component" }, { "name": "pricing-table-two", "type": "registry:block", "title": "Pricing Table Two", "description": "A pricing table component with a feature table" }, { "name": "pricing-table-three", "type": "registry:block", "title": "Pricing Table Three", "description": "A pricing table component with a feature table" }, { "name": "pricing-table-four", "type": "registry:block", "title": "Pricing Table Four", "description": "A modern pricing table component with gradient design" }, { "name": "pricing-table-five", "type": "registry:block", "title": "Pricing Table Five", "description": "A modern pricing table component with contact us plan" }, { "name": "pricing-table-six", "type": "registry:block", "title": "Pricing Table Six", "description": "A modern pricing table component with contact us plan" }, { "name": "pricing-table-seven", "type": "registry:block", "title": "Pricing Table Seven", "description": "A modern pricing table component with contact us plan" }, { "name": "pricing-table-eight", "type": "registry:block", "title": "Pricing Table Eight", "description": "A modern pricing table component with a clean design." }, { "name": "cancel-subscription-dialog", "type": "registry:block", "title": "Cancel Subscription Dialog", "description": "A cancel subscription dialog component" }, { "name": "cancel-subscription-card", "type": "registry:block", "title": "Cancel Subscription Card", "description": "A cancel subscription card component" }, { "name": "usage-based-pricing", "type": "registry:block", "title": "Usage Based Pricing", "description": "A usage based pricing component" }, { "name": "update-plan-dialog", "type": "registry:block", "title": "Update Plan Dialog", "description": "A update plan dialog component" }, { "name": "update-plan-card", "type": "registry:block", "title": "Update Plan Card", "description": "A update plan card component" }, { "name": "subscription-management", "type": "registry:block", "title": "Subscription Management", "description": "A subscription management component" }, { "name": "usage-meter-linear", "type": "registry:block", "title": "Usage Meter Linear", "description": "A usage meter linear component" }, { "name": "usage-meter-circle", "type": "registry:block", "title": "Usage Meter Circle", "description": "A usage meter circle component" }, { "name": "banner", "type": "registry:block", "title": "Top Banner", "description": "A banner component" }, { "name": "payment-method-selector", "type": "registry:block", "title": "Payment Method Selector", "description": "A payment method selector component with support for cards, digital wallets, UPI, and BNPL services" }, { "name": "payment-details", "type": "registry:block", "title": "Payment Details", "description": "A comprehensive payment details form component with card details, billing information, and country selection" }, { "name": "payment-details-two", "type": "registry:block", "title": "Payment Details Two", "description": "A comprehensive payment details form component with card details, billing information, and country selection built using React Hook Form and custom validation" }, { "name": "billing-settings", "type": "registry:block", "title": "Billing Settings", "description": "A comprehensive billing settings component with tabs for general, payment methods, invoices, and usage limits" }, { "name": "billing-settings-2", "type": "registry:block", "title": "Billing Settings 2", "description": "A comprehensive billing settings component with tabs for general, payment methods, invoices, and usage limits" }, { "name": "proration-preview", "type": "registry:block", "title": "Proration Preview", "description": "Interactive component that shows billing adjustments when users change subscription plans, featuring cost breakdowns, credits, and prorated charges" }, { "name": "detailed-usage-table", "type": "registry:block", "title": "Detailed Usage Table", "description": "A detailed usage table component with resource consumption breakdown" }, { "name": "usage-table", "type": "registry:block", "title": "Usage Table", "description": "A usage table component with resource consumption breakdown" }, { "name": "upcoming-charges", "type": "registry:block", "title": "Upcoming Charges", "description": "A component that displays information about upcoming billing cycles, including the next billing date, total amount, and a breakdown of individual charges" }, { "name": "payment-card", "type": "registry:block", "title": "Payment Card", "description": "A payment card component" }, { "name": "limited-offer-dialog", "type": "registry:block", "title": "Limited Offer Dialog", "description": "A dialog component for displaying limited-time offers with customizable content and actions" }, { "name": "trial-expiry-card", "type": "registry:block", "title": "Trial Expiry Card", "description": "A card component that displays trial expiration countdown with progress indicator and feature list" }, { "name": "payment-failure", "type": "registry:block", "title": "Payment Failure", "description": "A payment failure card component with retry, home, and support actions." }, { "name": "billing-screen", "type": "registry:block", "title": "Billing Screen", "description": "Complete billing dashboard with credit balance, plan details, and interactive credit card visual" } ], "component_count": 35, "components_truncated": false, "component_types": { "registry:lib": 1, "registry:block": 34 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 25, "name": "@bklit", "category": "Charts/data viz", "tags": [ "dashboard", "aesthetic" ], "tagline": "Open-source composable chart components for React — line, area, bar, pie, radar, maps, and more. Built with Visx, Motion, and shadcn/ui.", "short_description": "Open-source composable chart components for React — line, area, bar, pie, radar, maps, and more. Built with Visx, Motion, and shadcn/ui.", "description": "Open-source shadcn/ui chart extension with 16 composable chart types: area, bar, candlestick, choropleth (map), composed, funnel, gauge, line, live-line, pie, profit-loss-line, radar, ring, sankey, scatter, and a visual Studio configurator. Built on top of Visx and Motion with Tailwind CSS and React. Free, MIT-licensed. Use for: dropping polished, customizable data-visualization charts into a shadcn project without reaching for a heavier charting library.", "homepage": "https://ui.bklit.com", "docs": "https://ui.bklit.com/docs/installation", "github": "https://github.com/bklit/bklit-ui", "components_github": null, "github_default_branch": "main", "github_stars": 1253, "last_commit": "2026-07-06T10:16:41Z", "archived": false, "license": "MIT", "open_issues": 2, "registry_template": "https://ui.bklit.com/r/{name}.json", "registry_index": "https://ui.bklit.com/r/registry.json", "components": [ "utils", "shimmering-text", "chart-utils", "chart-context", "chart-animation", "chart-series", "grid", "reference-area", "projection-line", "background", "x-axis", "y-axis", "chart-tooltip", "legend", "markers", "area-chart", "composed-chart", "bar-chart", "line-chart", "profit-loss-line", "bar-depth", "scatter-chart", "live-line-chart", "candlestick-chart", "pie-chart", "radar-chart", "ring-chart", "gauge-chart", "heatmap-chart", "choropleth-chart", "funnel-chart", "sankey-chart", "sunburst-chart", "area-chart-example", "bar-chart-example", "line-chart-example", "scatter-chart-example", "pie-chart-example", "gauge-chart-example", "heatmap-chart-example", "ring-chart-example", "radar-chart-example", "composed-chart-example", "funnel-chart-example", "sankey-chart-example", "sunburst-chart-example", "candlestick-chart-example", "choropleth-chart-example", "live-line-chart-example", "chart-stat-flow", "stat-card-area-01", "stat-card-area-01-example", "stat-card-line-01", "stat-card-line-01-example", "stat-card-choropleth-01", "stat-card-choropleth-01-example" ], "component_items": [ { "name": "utils", "type": "registry:lib", "title": "Utilities", "description": "Utility functions for className merging with clsx and tailwind-merge" }, { "name": "shimmering-text", "type": "registry:component", "title": "Shimmering Text", "description": "Per-character shimmer animation for loading labels and badges" }, { "name": "chart-utils", "type": "registry:lib", "title": "Chart Utilities", "description": "Shared Intl formatters, time-series decimation, and RAF tooltip scheduling for Bklit charts" }, { "name": "chart-context", "type": "registry:component", "title": "Chart Context", "description": "Shared context and hooks for Bklit chart components" }, { "name": "chart-animation", "type": "registry:component", "title": "Chart Animation", "description": "Shared motion helpers for chart enter transitions, clip reveals, and staggered animations" }, { "name": "chart-series", "type": "registry:component", "title": "Chart Series Layer", "description": "Shared line and area series rendering helpers (paths, markers, highlights, dash tails)" }, { "name": "grid", "type": "registry:component", "title": "Chart Grid", "description": "Grid lines for charts" }, { "name": "reference-area", "type": "registry:component", "title": "Reference Area", "description": "Shaded data-coordinate band for target ranges and thresholds on time-series charts" }, { "name": "projection-line", "type": "registry:component", "title": "Projection Line", "description": "Forecast segment extending a line series past the last data point" }, { "name": "background", "type": "registry:component", "title": "Chart Background", "description": "Pattern fill for the plot area when grid lines are hidden" }, { "name": "x-axis", "type": "registry:component", "title": "X Axis", "description": "X-axis component for time-series charts" }, { "name": "y-axis", "type": "registry:component", "title": "Y Axis", "description": "Y-axis component for value labels in line and area charts" }, { "name": "chart-tooltip", "type": "registry:component", "title": "Chart Tooltip", "description": "Composable tooltip components for charts" }, { "name": "legend", "type": "registry:component", "title": "Chart Legend", "description": "Composable legend components for charts" }, { "name": "markers", "type": "registry:component", "title": "Chart Markers", "description": "Marker components for highlighting data points on charts" }, { "name": "area-chart", "type": "registry:component", "title": "Area Chart", "description": "A composable area chart with gradient fills and animations" }, { "name": "composed-chart", "type": "registry:component", "title": "Composed Chart", "description": "Time-series chart composing Line, Area, and SeriesBar on one shared scale (Recharts ComposedChart-style)" }, { "name": "bar-chart", "type": "registry:component", "title": "Bar Chart", "description": "A composable bar chart with horizontal/vertical orientations and animations" }, { "name": "line-chart", "type": "registry:component", "title": "Line Chart", "description": "A composable line chart with multiple series support" }, { "name": "profit-loss-line", "type": "registry:component", "title": "Profit/Loss Line", "description": "Sign-colored line segments for profit and loss on LineChart" }, { "name": "bar-depth", "type": "registry:component", "title": "Bar Depth", "description": "3D depth and glossy glass surfaces for BarChart bars" }, { "name": "scatter-chart", "type": "registry:component", "title": "Scatter Chart", "description": "A composable time-series scatter chart with offset rings, hover dimming, and animated enter" }, { "name": "live-line-chart", "type": "registry:component", "title": "Live Line Chart", "description": "Real-time streaming line chart with smooth scrolling, crosshair, and animated axes" }, { "name": "candlestick-chart", "type": "registry:component", "title": "Candlestick Chart", "description": "A composable OHLC candlestick chart with gradients, patterns, tooltips, and hover interactions" }, { "name": "pie-chart", "type": "registry:component", "title": "Pie Chart", "description": "A composable pie chart with animations and customizable slices" }, { "name": "radar-chart", "type": "registry:component", "title": "Radar Chart", "description": "A composable radar/spider chart with multiple data series" }, { "name": "ring-chart", "type": "registry:component", "title": "Ring Chart", "description": "A composable donut/ring chart with progress indicators" }, { "name": "gauge-chart", "type": "registry:component", "title": "Gauge", "description": "Notch-based radial or linear gauge with optional center label, patterns, and optional gradients" }, { "name": "heatmap-chart", "type": "registry:component", "title": "Heatmap Chart", "description": "A contribution heatmap with animated cells and configurable level colors" }, { "name": "choropleth-chart", "type": "registry:component", "title": "Choropleth Map", "description": "A geographic map chart with zoom, pan, and data visualization" }, { "name": "funnel-chart", "type": "registry:component", "title": "Funnel Chart", "description": "An animated funnel chart with multi-layer halo rings, hover interactions, and staggered entrance animations" }, { "name": "sankey-chart", "type": "registry:component", "title": "Sankey Diagram", "description": "A flow diagram for visualizing data transfers between nodes" }, { "name": "sunburst-chart", "type": "registry:component", "title": "Sunburst Chart", "description": "A composable hierarchical sunburst chart with drill-down zoom and animated segments" }, { "name": "area-chart-example", "type": "registry:example", "title": "Area Chart Example", "description": "Composable area-chart demo for Open in v0" }, { "name": "bar-chart-example", "type": "registry:example", "title": "Bar Chart Example", "description": "Composable bar-chart demo for Open in v0" }, { "name": "line-chart-example", "type": "registry:example", "title": "Line Chart Example", "description": "Composable line-chart demo for Open in v0" }, { "name": "scatter-chart-example", "type": "registry:example", "title": "Scatter Chart Example", "description": "Composable scatter-chart demo for Open in v0" }, { "name": "pie-chart-example", "type": "registry:example", "title": "Pie Chart Example", "description": "Composable pie-chart demo for Open in v0" }, { "name": "gauge-chart-example", "type": "registry:example", "title": "Gauge Chart Example", "description": "Composable gauge-chart demo for Open in v0" }, { "name": "heatmap-chart-example", "type": "registry:example", "title": "Heatmap Chart Example", "description": "Composable heatmap-chart demo for Open in v0" }, { "name": "ring-chart-example", "type": "registry:example", "title": "Ring Chart Example", "description": "Composable ring-chart demo for Open in v0" }, { "name": "radar-chart-example", "type": "registry:example", "title": "Radar Chart Example", "description": "Composable radar-chart demo for Open in v0" }, { "name": "composed-chart-example", "type": "registry:example", "title": "Composed Chart Example", "description": "Composable composed-chart demo for Open in v0" }, { "name": "funnel-chart-example", "type": "registry:example", "title": "Funnel Chart Example", "description": "Composable funnel-chart demo for Open in v0" }, { "name": "sankey-chart-example", "type": "registry:example", "title": "Sankey Chart Example", "description": "Composable sankey-chart demo for Open in v0" }, { "name": "sunburst-chart-example", "type": "registry:example", "title": "Sunburst Chart Example", "description": "Composable sunburst-chart demo for Open in v0" }, { "name": "candlestick-chart-example", "type": "registry:example", "title": "Candlestick Chart Example", "description": "Composable candlestick-chart demo for Open in v0" }, { "name": "choropleth-chart-example", "type": "registry:example", "title": "Choropleth Chart Example", "description": "Composable choropleth-chart demo for Open in v0" }, { "name": "live-line-chart-example", "type": "registry:example", "title": "Live Line Chart Example", "description": "Composable live-line-chart demo for Open in v0" }, { "name": "chart-stat-flow", "type": "registry:component", "title": "Chart Stat Flow", "description": "Animated stat value and label for chart overlays" }, { "name": "stat-card-area-01", "type": "registry:block", "title": "Stat Card Area", "description": "Revenue stat card with gradient area sparkline, NumberFlow, and trend badge" }, { "name": "stat-card-area-01-example", "type": "registry:example", "title": "Stat Card Area Example", "description": "Revenue stat card with gradient area sparkline, NumberFlow, and trend badge — demo for Open in v0" }, { "name": "stat-card-line-01", "type": "registry:block", "title": "Stat Card Line", "description": "Sessions stat card with line sparkline, overlaid NumberFlow, and trend badge" }, { "name": "stat-card-line-01-example", "type": "registry:example", "title": "Stat Card Line Example", "description": "Sessions stat card with line sparkline, overlaid NumberFlow, and trend badge — demo for Open in v0" }, { "name": "stat-card-choropleth-01", "type": "registry:block", "title": "Stat Card Choropleth", "description": "Visitor map stat card with choropleth sparkline, NumberFlow, and trend badge" }, { "name": "stat-card-choropleth-01-example", "type": "registry:example", "title": "Stat Card Choropleth Example", "description": "Visitor map stat card with choropleth sparkline, NumberFlow, and trend badge — demo for Open in v0" } ], "component_count": 56, "components_truncated": false, "component_types": { "registry:lib": 2, "registry:component": 32, "registry:example": 19, "registry:block": 3 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 26, "name": "@blocks-so", "category": "Blocks & sections (marketing/SaaS)", "tags": [ "saas", "ai", "dashboard" ], "tagline": "A set of clean, modern application building blocks for you in your applications. Free and Open Source", "short_description": "A set of clean, modern application building blocks for you in your applications. Free and Open Source", "description": "Free, open-source collection of 60+ shadcn/ui application blocks covering login, dialogs, sidebars, stats, AI chat, command menus, file upload, form layouts, grid/list views, onboarding, and tables — all with live previews. Built with React, Tailwind CSS, and Next.js, accessible by default via Radix UI. Use for: grabbing polished, functional app-shell blocks (auth screens, sidebars, dashboards) that go beyond pure marketing sections.", "homepage": "https://blocks.so", "docs": "https://blocks.so", "github": "https://github.com/ephraimduncan/blocks", "components_github": "https://github.com/ephraimduncan/blocks/tree/main/components", "github_default_branch": "main", "github_stars": 1685, "last_commit": "2026-04-27T12:53:27Z", "archived": false, "license": "MIT", "open_issues": 6, "registry_template": "https://blocks.so/r/{name}.json", "registry_index": "https://blocks.so/r/registry.json", "components": [ "ai-01", "ai-02", "ai-03", "ai-04", "ai-05", "command-menu-01", "command-menu-02", "command-menu-03", "dialog-01", "dialog-02", "dialog-03", "dialog-04", "dialog-05", "dialog-06", "dialog-07", "dialog-08", "dialog-09", "dialog-10", "dialog-11", "dialog-12", "file-upload-01", "file-upload-01", "file-upload-02", "file-upload-03", "file-upload-04", "file-upload-05", "file-upload-06", "form-layout-01", "form-layout-02", "form-layout-03", "form-layout-04", "form-layout-05", "grid-list-01", "grid-list-02", "grid-list-03", "login-01", "login-02", "login-03", "login-04", "login-05", "login-06", "login-07", "login-08", "login-09", "onboarding-01", "onboarding-02", "onboarding-03", "onboarding-04", "onboarding-05", "onboarding-06", "onboarding-07", "sidebar-01", "sidebar-02", "sidebar-03", "sidebar-04", "sidebar-05", "sidebar-06", "stats-01", "stats-02", "stats-03", "stats-04", "stats-05", "stats-06", "stats-07", "stats-08", "stats-09", "stats-10", "stats-11", "stats-12", "stats-13", "stats-14", "stats-15", "table-01", "table-02", "table-03", "table-04", "table-05" ], "component_items": [ { "name": "ai-01", "type": "registry:block", "title": "AI Chat with Voice Input", "description": "A ai chat with voice input block." }, { "name": "ai-02", "type": "registry:block", "title": "AI Chat with Model Selection", "description": "A ai chat with model selection block." }, { "name": "ai-03", "type": "registry:block", "title": "AI Chat Compact Interface", "description": "A ai chat compact interface block." }, { "name": "ai-04", "type": "registry:block", "title": "AI Chat with File Attachments", "description": "A ai chat with file attachments block." }, { "name": "ai-05", "type": "registry:block", "title": "AI Elements Chat", "description": "A ai elements chat block." }, { "name": "command-menu-01", "type": "registry:block", "title": "Command Menu with Groups", "description": "A command menu with groups block." }, { "name": "command-menu-02", "type": "registry:block", "title": "Command Menu with Keyboard Shortcuts", "description": "A command menu with keyboard shortcuts block." }, { "name": "command-menu-03", "type": "registry:block", "title": "Command Menu with Documentation Search", "description": "A command menu with documentation search block." }, { "name": "dialog-01", "type": "registry:block", "title": "Dialog Confirmation", "description": "A dialog confirmation block." }, { "name": "dialog-02", "type": "registry:block", "title": "Dialog with Warning Icon", "description": "A dialog with warning icon block." }, { "name": "dialog-03", "type": "registry:block", "title": "Dialog with Input Field", "description": "A dialog with input field block." }, { "name": "dialog-04", "type": "registry:block", "title": "Dialog with Two Buttons", "description": "A dialog with two buttons block." }, { "name": "dialog-05", "type": "registry:block", "title": "Dialog with Password Confirmation", "description": "A dialog with password confirmation block." }, { "name": "dialog-06", "type": "registry:block", "title": "Dialog with Privacy Toggle", "description": "A dialog with privacy toggle block." }, { "name": "dialog-07", "type": "registry:block", "title": "Dialog with Member List", "description": "A dialog with member list block." }, { "name": "dialog-08", "type": "registry:block", "title": "Dialog with Email and Password Fields", "description": "A dialog with email and password fields block." }, { "name": "dialog-09", "type": "registry:block", "title": "Dialog with Link Share and Toggles", "description": "A dialog with link share and toggles block." }, { "name": "dialog-10", "type": "registry:block", "title": "Dialog with Calendar and Time Picker", "description": "A dialog with calendar and time picker block." }, { "name": "dialog-11", "type": "registry:block", "title": "Dialog Multi-Step Wizard", "description": "A dialog multi-step wizard block." }, { "name": "dialog-12", "type": "registry:block", "title": "Dialog with Avatar Upload", "description": "A dialog with avatar upload block." }, { "name": "file-upload-01", "type": "registry:block", "title": "File Upload with Preview", "description": "A file upload with preview block." }, { "name": "file-upload-01", "type": "registry:block", "title": "File Upload with Preview", "description": "A file upload with preview block." }, { "name": "file-upload-02", "type": "registry:block", "title": "File Upload Simple", "description": "A file upload simple block." }, { "name": "file-upload-03", "type": "registry:block", "title": "File Upload Multi-File Dropzone", "description": "A file upload multi-file dropzone block." }, { "name": "file-upload-04", "type": "registry:block", "title": "File Upload Drag & Drop", "description": "A file upload drag & drop block." }, { "name": "file-upload-05", "type": "registry:block", "title": "File Upload with Progress", "description": "A file upload with progress block." }, { "name": "file-upload-06", "type": "registry:block", "title": "File Upload with Status Sections", "description": "A file upload with status sections block." }, { "name": "form-layout-01", "type": "registry:block", "title": "Form with Workspace Fields", "description": "A form with workspace fields block." }, { "name": "form-layout-02", "type": "registry:block", "title": "Form with Side Labels", "description": "A form with side labels block." }, { "name": "form-layout-03", "type": "registry:block", "title": "Form with Checkbox Settings", "description": "A form with checkbox settings block." }, { "name": "form-layout-04", "type": "registry:block", "title": "Form with Package Selection", "description": "A form with package selection block." }, { "name": "form-layout-05", "type": "registry:block", "title": "Form with Plan Selection", "description": "A form with plan selection block." }, { "name": "grid-list-01", "type": "registry:block", "title": "Grid List with Dropdown", "description": "A grid list with dropdown block." }, { "name": "grid-list-02", "type": "registry:block", "title": "Grid List with Links", "description": "A grid list with links block." }, { "name": "grid-list-03", "type": "registry:block", "title": "Grid List with Icons", "description": "A grid list with icons block." }, { "name": "login-01", "type": "registry:block", "title": "Login with Email and Google", "description": "A login with email and google block." }, { "name": "login-02", "type": "registry:block", "title": "Login with Email, Password and Google", "description": "A login with email, password and google block." }, { "name": "login-03", "type": "registry:block", "title": "Login with Email and Password", "description": "A login with email and password block." }, { "name": "login-04", "type": "registry:block", "title": "Login with Social Buttons", "description": "A login with social buttons block." }, { "name": "login-05", "type": "registry:block", "title": "Login Card Signup Form", "description": "A login card signup form block." }, { "name": "login-06", "type": "registry:block", "title": "Login with Magic Link and SSO", "description": "A login with magic link and sso block." }, { "name": "login-07", "type": "registry:block", "title": "Login Full Page with Icons", "description": "A login full page with icons block." }, { "name": "login-08", "type": "registry:block", "title": "Login with SSO", "description": "A login with sso block." }, { "name": "login-09", "type": "registry:block", "title": "Login Signup with Role Selection", "description": "A login signup with role selection block." }, { "name": "onboarding-01", "type": "registry:block", "title": "Onboarding", "description": "A onboarding block." }, { "name": "onboarding-02", "type": "registry:block", "title": "Onboarding Workspace Setup", "description": "A onboarding workspace setup block." }, { "name": "onboarding-03", "type": "registry:block", "title": "Onboarding Steps with Progress", "description": "A onboarding steps with progress block." }, { "name": "onboarding-04", "type": "registry:block", "title": "Onboarding Accordion", "description": "A onboarding accordion block." }, { "name": "onboarding-05", "type": "registry:block", "title": "Onboarding Activity Feed", "description": "A onboarding activity feed block." }, { "name": "onboarding-06", "type": "registry:block", "title": "Onboarding Timeline", "description": "A onboarding timeline block." }, { "name": "onboarding-07", "type": "registry:block", "title": "Onboarding Deploy Pipeline", "description": "A onboarding deploy pipeline block." }, { "name": "sidebar-01", "type": "registry:block", "title": "Sidebar Collapsible Sections", "description": "A sidebar collapsible sections block." }, { "name": "sidebar-02", "type": "registry:block", "title": "Sidebar Dashboard Inset", "description": "A sidebar dashboard inset block." }, { "name": "sidebar-03", "type": "registry:block", "title": "Sidebar Dashboard Floating", "description": "A sidebar dashboard floating block." }, { "name": "sidebar-04", "type": "registry:block", "title": "Sidebar Double-Sided Mail", "description": "A sidebar double-sided mail block." }, { "name": "sidebar-05", "type": "registry:block", "title": "Sidebar Double-Sided", "description": "A sidebar double-sided block." }, { "name": "sidebar-06", "type": "registry:block", "title": "Sidebar Replacement", "description": "A sidebar replacement block." }, { "name": "stats-01", "type": "registry:block", "title": "Stats with Trending", "description": "A stats with trending block." }, { "name": "stats-02", "type": "registry:block", "title": "Stats with Borders", "description": "A stats with borders block." }, { "name": "stats-03", "type": "registry:block", "title": "Stats with Card Layout", "description": "A stats with card layout block." } ], "component_count": 77, "components_truncated": false, "component_types": { "registry:block": 77 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 27, "name": "@blockus", "category": "Blocks & sections (marketing/SaaS)", "tags": [ "saas" ], "tagline": "Production-ready React blocks built on shadcn/ui and Tailwind — drop them in, swap the copy, ship the page. Heroes, pricing and footer sections crafted by hand.", "short_description": "Production-ready React blocks built on shadcn/ui and Tailwind — drop them in, swap the copy, ship the page. Heroes, pricing and footer sections crafted by hand.", "description": "Small collection of hand-crafted React blocks built on shadcn/ui and Tailwind CSS, covering hero, pricing, and footer sections. Designed for drop-in use with minimal customization needed — swap copy and deploy. No GitHub repository listed; site was unreachable at time of research. Based on the official description the focus is marketing-page sections. Use for: grabbing hero, pricing, and footer blocks when building a simple SaaS landing page on top of shadcn.", "homepage": "https://blockus.lndevui.com", "docs": "N/A", "github": "N/A", "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://blockus.lndevui.com/r/{name}.json", "registry_index": "https://blockus.lndevui.com/r/registry.json", "components": [ "hero-01", "hero-02", "hero-03", "hero-04", "hero-05", "hero-06", "hero-07", "hero-08", "hero-09", "hero-10", "hero-11", "hero-12", "pricing-01", "pricing-02", "pricing-03", "pricing-04", "pricing-05", "pricing-06", "pricing-07", "pricing-08", "pricing-09", "pricing-10", "pricing-11", "pricing-12", "pricing-13", "pricing-14", "pricing-15", "pricing-16", "pricing-17", "pricing-18", "pricing-19", "pricing-20", "pricing-21", "pricing-22", "pricing-23", "pricing-24", "pricing-25", "pricing-26", "footer-01", "footer-02", "footer-03", "footer-04", "footer-05", "footer-06", "footer-07", "footer-08", "footer-09", "footer-10", "footer-11", "footer-12", "footer-13", "footer-14", "footer-15", "hero-13", "hero-14", "hero-15", "hero-16", "contact-01", "contact-02", "contact-03", "contact-04", "contact-05", "contact-06", "contact-07", "contact-08", "contact-09", "contact-10", "contact-11", "contact-12", "contact-13", "contact-14", "contact-15", "faqs-01", "faqs-02", "faqs-03", "faqs-04", "faqs-05", "faqs-06", "faqs-07", "faqs-08", "faqs-09", "faqs-10", "faqs-11", "faqs-12", "faqs-13", "faqs-14", "faqs-15", "login-01", "login-02", "login-03", "login-04", "login-05", "login-06", "login-07", "login-08", "login-09", "login-10", "login-11", "login-12", "login-13" ], "component_items": [ { "name": "hero-01", "type": "registry:block", "title": "Aurora-glow hero", "description": "Centered hero with a soft conic-gradient aurora behind the headline and a row of stacked avatars as social proof." }, { "name": "hero-02", "type": "registry:block", "title": "blockus marketing hero", "description": "The full blockus opening — sticky non-auth header on top, crosshair-framed dotted backdrop, an announcement pill, a four-clause balanced headline and dual CTAs…" }, { "name": "hero-03", "type": "registry:block", "title": "Split hero with terminal preview", "description": "Two-column hero with copy on the left and a mock terminal showing the install command on the right." }, { "name": "hero-04", "type": "registry:block", "title": "Hero with cycling word", "description": "Centered headline whose bracketed word rotates between five options via a pure-CSS keyframe." }, { "name": "hero-05", "type": "registry:block", "title": "Editorial newspaper hero", "description": "Serif headline, kicker ribbon and a two-column intro evoking a magazine cover layout." }, { "name": "hero-06", "type": "registry:block", "title": "Dashboard split hero", "description": "Dark split hero with a tilted dashboard mockup on the right, conic glow behind the copy and a customer-logos row anchoring the bottom." }, { "name": "hero-07", "type": "registry:block", "title": "Spotlight serif hero", "description": "Centered serif headline, glowing primary CTA and a logo marquee at the bottom — moody and high-contrast." }, { "name": "hero-08", "type": "registry:block", "title": "Beam-of-light hero", "description": "Left-aligned hero with a diagonal violet light beam slicing across the canvas and a Used-by trust strip at the bottom." }, { "name": "hero-09", "type": "registry:block", "title": "Stats-grid hero", "description": "Hero combining a strong headline with a four-stat metric grid revealing growth numbers under the CTA." }, { "name": "hero-10", "type": "registry:block", "title": "Spotlight cursor hero", "description": "Hero with an interactive spotlight that follows the cursor, revealing a hidden gradient under a dotted backdrop." }, { "name": "hero-11", "type": "registry:block", "title": "Bento feature hero", "description": "Hero copy on the left paired with a four-tile bento grid teasing the product's key capabilities on the right." }, { "name": "hero-12", "type": "registry:block", "title": "Marquee badge hero", "description": "Centered hero with an auto-scrolling badge marquee under the headline highlighting capabilities and integrations." }, { "name": "pricing-01", "type": "registry:block", "title": "Lifetime spotlight pricing", "description": "Single bold offer card with monthly-vs-lifetime savings callout and decorative gradient bloom." }, { "name": "pricing-02", "type": "registry:block", "title": "Three-tier comparison", "description": "Free, Pro and Team tiers side-by-side with feature checklists and a highlighted middle plan." }, { "name": "pricing-03", "type": "registry:block", "title": "Monthly / yearly toggle", "description": "Two-plan layout with a billing-period switch and a discount badge on the yearly option." }, { "name": "pricing-04", "type": "registry:block", "title": "Inline pricing pills", "description": "Three compact tiers arranged in a single horizontal card — perfect for a marketing site footer band." }, { "name": "pricing-05", "type": "registry:block", "title": "Team-seat slider pricing", "description": "Single plan whose total updates as the user slides the team-seat count between 1 and 25." }, { "name": "pricing-06", "type": "registry:block", "title": "Service-tier pricing cards", "description": "Three dark service-tier cards with coloured category chips, scarcity badge and gradient bottom CTAs." }, { "name": "pricing-07", "type": "registry:block", "title": "Comparison matrix pricing", "description": "Full feature-by-tier comparison matrix with grouped sections, sticky header column and tier callouts." }, { "name": "pricing-08", "type": "registry:block", "title": "Mega-offer pricing", "description": "A single big-statement pricing card with a vertical price stack, glowing accent and a long feature list." }, { "name": "pricing-09", "type": "registry:block", "title": "Stacked accordion pricing", "description": "Tiers arranged vertically as expandable rows revealing per-plan features on click." }, { "name": "pricing-10", "type": "registry:block", "title": "Usage-based pricing", "description": "Usage slider with tiered breakpoints — live preview of the estimated bill based on monthly volume." }, { "name": "pricing-11", "type": "registry:block", "title": "Pay-what-you-want", "description": "Single offer card with a custom-amount input, three preset chips and a live confirmation strip." }, { "name": "pricing-12", "type": "registry:block", "title": "Multi-currency pricing", "description": "Three-tier pricing with a currency switcher (USD / EUR / GBP) that updates every plan in place." }, { "name": "pricing-13", "type": "registry:block", "title": "Annual savings spotlight", "description": "Two-plan layout with the annual plan visually amplified — savings badge, comparison bar and copy callout." }, { "name": "pricing-14", "type": "registry:block", "title": "Modular add-on builder", "description": "Base plan card with stacked add-on checkboxes; total recomputes as add-ons are toggled." }, { "name": "pricing-15", "type": "registry:block", "title": "Testimonial-paired pricing", "description": "Pricing card on one side, rotating customer quote on the other — social proof anchored to the buy decision." }, { "name": "pricing-16", "type": "registry:block", "title": "Two-plan side-by-side", "description": "Free and Pro plans in two clean side-by-side cards, one highlighted — monthly-only, no toggle required." }, { "name": "pricing-17", "type": "registry:block", "title": "Single centered plan card", "description": "One product, one price — a centered card with a full feature list, compare-at strikethrough, and trust badges." }, { "name": "pricing-18", "type": "registry:block", "title": "Three-tier monthly/yearly toggle", "description": "Three tiers with a monthly/yearly toggle and a save-20% badge, middle tier highlighted as most picked." }, { "name": "pricing-19", "type": "registry:block", "title": "Feature comparison grid", "description": "Rows of features across three plans with check/dash indicators, built as a responsive grid with grouped categories." }, { "name": "pricing-20", "type": "registry:block", "title": "Usage-based range slider", "description": "Native range slider updates an estimated monthly price in real time as the user drags through event-volume tiers." }, { "name": "pricing-21", "type": "registry:block", "title": "Four compact tier row", "description": "Four minimal plan tiles in a single row — price, three bullets each, and a CTA, nothing more." }, { "name": "pricing-22", "type": "registry:block", "title": "Pricing cards with FAQ accordion", "description": "Two pricing cards on the left, a small FAQ accordion on the right — answers sit next to the buy button." }, { "name": "pricing-23", "type": "registry:block", "title": "Dark high-contrast spotlight", "description": "Always-dark stone-950 canvas, single featured tier with a violet radial glow and a glowing CTA button." }, { "name": "pricing-24", "type": "registry:block", "title": "Pro + Enterprise split", "description": "Two-panel layout — a priced Pro tier on the left and an Enterprise contact-sales panel on the right." }, { "name": "pricing-25", "type": "registry:block", "title": "Per-seat stepper pricing", "description": "Seat stepper with +/− buttons and quick-pick presets updates the monthly and yearly totals in place." }, { "name": "pricing-26", "type": "registry:block", "title": "Lifetime deal card", "description": "One-time lifetime deal with a compare-at strikethrough price, savings badge, and trust-badge row." }, { "name": "footer-01", "type": "registry:block", "title": "Footer with mission statement", "description": "Left column carries a punchy serif brand statement, right column groups three nav lists." }, { "name": "footer-02", "type": "registry:block", "title": "Mega wordmark footer", "description": "Compact nav columns on top, a huge wordmark across the bottom serving as a visual anchor." }, { "name": "footer-03", "type": "registry:block", "title": "CTA footer", "description": "Final-call footer leading with a Ready-to-ship CTA card and a slim copyright row underneath." }, { "name": "footer-04", "type": "registry:block", "title": "Newsletter centerpiece footer", "description": "Full-width newsletter capture as the centerpiece, framed by nav columns and a copyright row." }, { "name": "footer-05", "type": "registry:block", "title": "Dark card footer", "description": "Single rounded dark card containing brand, nav and copyright — sits inside the page like an island." }, { "name": "footer-06", "type": "registry:block", "title": "Floating CTA footer", "description": "Dark rounded CTA capsule floating above a light footer with a faded oversized wordmark behind it." }, { "name": "footer-07", "type": "registry:block", "title": "Integration-logos footer", "description": "Footer leading with a grid of integration partner logos, paired with concise nav columns." }, { "name": "footer-08", "type": "registry:block", "title": "Status + newsletter footer", "description": "Footer combining a live status pill, newsletter capture and a social-icon row in a single band." }, { "name": "footer-09", "type": "registry:block", "title": "Compact one-row footer", "description": "Minimal single-row footer — brand on the left, condensed nav and socials on the right." }, { "name": "footer-10", "type": "registry:block", "title": "Locations footer", "description": "Footer with three location blocks (city, address, hours) and a thin contact band on top." }, { "name": "footer-11", "type": "registry:block", "title": "Sticky CTA bar footer", "description": "Sticky bottom CTA bar over a slim footer — drives final conversion as the user reaches the page bottom." }, { "name": "footer-12", "type": "registry:block", "title": "Product-grid footer", "description": "Footer with a four-tile mini product showcase grid above the navigation columns." }, { "name": "footer-13", "type": "registry:block", "title": "Gradient brand footer", "description": "Footer set on a rich gradient with a large brand statement and tightly-spaced nav lists." }, { "name": "footer-14", "type": "registry:block", "title": "Testimonial rail footer", "description": "Three mini testimonial cards form a rail above the standard footer columns." }, { "name": "footer-15", "type": "registry:block", "title": "Big-type minimalist footer", "description": "Massive single-line brand wordmark dominates the layout, with a discreet nav band on top." }, { "name": "hero-13", "type": "registry:block", "title": "AI analytics dashboard hero", "description": "Centered hero with inline metric chips, paired with a live, clickable dashboard mockup — sidebar pages, tab switcher and chart toggle all wired up." }, { "name": "hero-14", "type": "registry:block", "title": "Big-type cream hero with mega menu", "description": "Massive sans-serif headline on a cream canvas with playful pebble decoration, a hover-revealed product mega menu and a multi-logo trust strip below." }, { "name": "hero-15", "type": "registry:block", "title": "Dark issue-tracker hero", "description": "Pure-black hero with a status callout on the right and a fully clickable issue-tracker mockup — sidebar pages, tabs and prev/next navigation all interactive." }, { "name": "hero-16", "type": "registry:block", "title": "Serif notebook hero with mega menu", "description": "Sky-blue editorial hero with serif headline, paper-cut mountain horizon and a notebook app mockup — plus a hover-revealed product mega menu in the floating nav…" }, { "name": "contact-01", "type": "registry:block", "title": "Centered contact form", "description": "Centered headline with a clean three-field contact form — the safest starting point for any marketing site." }, { "name": "contact-02", "type": "registry:block", "title": "Split contact with details", "description": "Two-column layout pairing a copy block plus email / phone / locations on the left with a long form on the right." }, { "name": "contact-03", "type": "registry:block", "title": "Three-channel contact cards", "description": "Routes visitors to the right team via three side-by-side cards — Sales, Support, Press — each with its own CTA." } ], "component_count": 500, "components_truncated": true, "component_types": { "registry:block": 500 }, "has_logo": true, "enrichment_errors": [ "github_lookup_failed" ], "featured": false }, { "number": 28, "name": "@boldkit", "category": "Component library (general)", "tags": [ "dashboard", "aesthetic", "components" ], "tagline": "Neubrutalism component library with 43 components, 42 SVG shapes, thick borders, and hard shadows. Supports React, Vue, and Nuxt. Built on shadcn/ui.", "short_description": "Neubrutalism component library with 43 components, 42 SVG shapes, thick borders, and hard shadows. Supports React, Vue, and Nuxt. Built on shadcn/ui.", "description": "Free, open-source neubrutalism UI library supporting both React and Vue 3/Nuxt, installable via the shadcn CLI. Contains 56+ components, 15 section blocks, 7 full-page templates, 64 SVG shapes, and 14 chart types. Distinctive aesthetic: thick borders, hard shadows, and bold accent colors. Built on shadcn/ui (Radix UI) and shadcn-vue (Reka UI), Tailwind CSS v4, TypeScript. Use for: projects requiring a bold neubrutalism visual identity across both React and Vue stacks without switching libraries.", "homepage": "https://boldkit.dev", "docs": "https://boldkit.dev/docs/installation", "github": "https://github.com/ANIBIT14/boldkit", "components_github": "https://github.com/ANIBIT14/boldkit/tree/main/registry", "github_default_branch": "main", "github_stars": 81, "last_commit": "2026-07-06T16:39:21Z", "archived": false, "license": "MIT", "open_issues": 1, "registry_template": "https://boldkit.dev/r/{name}.json", "registry_index": "https://boldkit.dev/r/registry.json", "components": [ "theme", "utils", "use-theme", "error-boundary", "accordion", "alert", "aspect-ratio", "avatar", "badge", "breadcrumb", "button", "card", "checkbox", "collapsible", "combobox", "command", "dialog", "dropdown-menu", "context-menu", "menubar", "navigation-menu", "resizable", "button-group", "input-group", "field", "native-select", "date-picker", "input", "label", "popover", "progress", "radio-group", "scroll-area", "select", "separator", "sheet", "skeleton", "slider", "sonner", "switch", "table", "tabs", "textarea", "toggle", "toggle-group", "tooltip", "alert-dialog", "calendar", "drawer", "hover-card", "input-otp", "pagination", "chart", "marquee", "sticker", "layered-card", "shapes", "styles", "spinner", "kbd", "stat-card", "stepper", "dropzone", "sparkline", "donut-chart", "radial-bar-chart", "radar-chart", "gauge-chart", "funnel-chart", "treemap-chart", "heatmap-chart", "sankey-chart", "rating", "tag-input", "time-picker", "date-range-picker", "data-table", "carousel", "timeline", "tree-view", "sidebar", "tour", "empty-state", "math-curves", "math-curve-loader", "math-curve-progress", "math-curve-background", "ascii-shapes", "motion", "motion-core", "motion-react", "chart-export", "chart-toolbar" ], "component_items": [ { "name": "theme", "type": "registry:theme", "title": null, "description": "BoldKit neubrutalism theme with bold colors and CSS variables" }, { "name": "utils", "type": "registry:lib", "title": null, "description": "Utility functions for className merging" }, { "name": "use-theme", "type": "registry:hook", "title": null, "description": "Theme provider hook with light/dark/system support and localStorage persistence. Used by Sonner toast for theme-aware rendering." }, { "name": "error-boundary", "type": "registry:component", "title": null, "description": "Error boundary wrapper with neubrutalism-styled fallback UI. Used by math-curve components to catch runtime errors gracefully." }, { "name": "accordion", "type": "registry:ui", "title": null, "description": "A vertically stacked set of interactive headings with neubrutalism styling" }, { "name": "alert", "type": "registry:ui", "title": null, "description": "Displays a callout for user attention with bold neubrutalism borders" }, { "name": "aspect-ratio", "type": "registry:ui", "title": null, "description": "Displays content within a desired ratio" }, { "name": "avatar", "type": "registry:ui", "title": null, "description": "An image element with a fallback for representing the user" }, { "name": "badge", "type": "registry:ui", "title": null, "description": "Displays a badge or a component that looks like a badge with neubrutalism styling" }, { "name": "breadcrumb", "type": "registry:ui", "title": null, "description": "Displays the path to the current resource using a hierarchy of links" }, { "name": "button", "type": "registry:ui", "title": null, "description": "Displays a button with neubrutalism styling and press-down animation" }, { "name": "card", "type": "registry:ui", "title": null, "description": "Displays a card with header, content, and footer with thick borders and shadows" }, { "name": "checkbox", "type": "registry:ui", "title": null, "description": "A control that allows the user to toggle between checked and not checked" }, { "name": "collapsible", "type": "registry:ui", "title": null, "description": "An interactive component which expands/collapses a panel" }, { "name": "combobox", "type": "registry:ui", "title": null, "description": "Searchable dropdown built by composing Popover and Command with neubrutalism styling" }, { "name": "command", "type": "registry:ui", "title": null, "description": "Fast, composable, command menu for React with neubrutalism styling" }, { "name": "dialog", "type": "registry:ui", "title": null, "description": "A window overlaid on the primary window with neubrutalism borders and shadows" }, { "name": "dropdown-menu", "type": "registry:ui", "title": null, "description": "Displays a menu of actions/options with neubrutalism styling" }, { "name": "context-menu", "type": "registry:ui", "title": null, "description": "Displays a menu triggered by right-click with neubrutalism styling" }, { "name": "menubar", "type": "registry:ui", "title": null, "description": "A horizontal menu bar of desktop-style dropdown menus with neubrutalism styling" }, { "name": "navigation-menu", "type": "registry:ui", "title": null, "description": "A collection of links and dropdown panels for site navigation with neubrutalism styling" }, { "name": "resizable", "type": "registry:ui", "title": null, "description": "Resizable panel groups and handles with neubrutalism styling" }, { "name": "button-group", "type": "registry:ui", "title": null, "description": "Visually joins a row or column of buttons into one bordered unit" }, { "name": "input-group", "type": "registry:ui", "title": null, "description": "An input joined with leading/trailing addons in a single bordered field" }, { "name": "field", "type": "registry:ui", "title": null, "description": "Form field composition: label, control, description and error" }, { "name": "native-select", "type": "registry:ui", "title": null, "description": "A styled wrapper around the native select element, a11y-first" }, { "name": "date-picker", "type": "registry:ui", "title": null, "description": "A single-date picker: a button trigger that opens a calendar popover" }, { "name": "input", "type": "registry:ui", "title": null, "description": "Displays a form input field with neubrutalism styling" }, { "name": "label", "type": "registry:ui", "title": null, "description": "Renders an accessible label for form controls" }, { "name": "popover", "type": "registry:ui", "title": null, "description": "Displays rich content in a portal with neubrutalism styling" }, { "name": "progress", "type": "registry:ui", "title": null, "description": "Displays an indicator showing the completion progress of a task" }, { "name": "radio-group", "type": "registry:ui", "title": null, "description": "A set of checkable buttons where only one can be checked at a time" }, { "name": "scroll-area", "type": "registry:ui", "title": null, "description": "Augments native scroll functionality for custom styling" }, { "name": "select", "type": "registry:ui", "title": null, "description": "Displays a list of options with neubrutalism styling" }, { "name": "separator", "type": "registry:ui", "title": null, "description": "Visually separates content with a thick border" }, { "name": "sheet", "type": "registry:ui", "title": null, "description": "Extends Dialog to display content that complements the main page" }, { "name": "skeleton", "type": "registry:ui", "title": null, "description": "Used to show a placeholder while content is loading" }, { "name": "slider", "type": "registry:ui", "title": null, "description": "A jelly slider with spring physics and bouncy animations" }, { "name": "sonner", "type": "registry:ui", "title": null, "description": "An opinionated toast component with neubrutalism styling" }, { "name": "switch", "type": "registry:ui", "title": null, "description": "A control that allows the user to toggle between on and off" }, { "name": "table", "type": "registry:ui", "title": null, "description": "A responsive table component with neubrutalism styling" }, { "name": "tabs", "type": "registry:ui", "title": null, "description": "A tabbed interface component with neubrutalism styling" }, { "name": "textarea", "type": "registry:ui", "title": null, "description": "Displays a form textarea with neubrutalism styling" }, { "name": "toggle", "type": "registry:ui", "title": null, "description": "A two-state button that can be either on or off" }, { "name": "toggle-group", "type": "registry:ui", "title": null, "description": "A group of toggle buttons where only one can be pressed at a time" }, { "name": "tooltip", "type": "registry:ui", "title": null, "description": "A popup that displays information related to an element" }, { "name": "alert-dialog", "type": "registry:ui", "title": null, "description": "A modal dialog for important confirmations with neubrutalism styling" }, { "name": "calendar", "type": "registry:ui", "title": null, "description": "A date picker calendar with neubrutalism styling" }, { "name": "drawer", "type": "registry:ui", "title": null, "description": "A drawer component that slides in from the edge of the screen" }, { "name": "hover-card", "type": "registry:ui", "title": null, "description": "A card that appears on hover with additional information" }, { "name": "input-otp", "type": "registry:ui", "title": null, "description": "One-time password input with neubrutalism styling" }, { "name": "pagination", "type": "registry:ui", "title": null, "description": "Pagination controls for navigating through pages" }, { "name": "chart", "type": "registry:ui", "title": null, "description": "Beautiful charts with neubrutalism styling built on Recharts" }, { "name": "marquee", "type": "registry:ui", "title": null, "description": "Auto-scrolling text ticker with neubrutalism styling - a common brutalist design element" }, { "name": "sticker", "type": "registry:ui", "title": null, "description": "Rotated labels and stamps with tape effect and double borders - neubrutalist decorative elements" }, { "name": "layered-card", "type": "registry:ui", "title": null, "description": "Card component with stacked layers effect showing offset depth - neubrutalist depth illusion" }, { "name": "shapes", "type": "registry:ui", "title": null, "description": "55 neubrutalist SVG shapes organized by category for badges, decorations, and visual accents" }, { "name": "styles", "type": "registry:style", "title": null, "description": "BoldKit neubrutalism CSS variables and utilities" }, { "name": "spinner", "type": "registry:ui", "title": null, "description": "Loading spinner with multiple animation variants - dots, bars, blocks, and brutal shadow spin" }, { "name": "kbd", "type": "registry:ui", "title": null, "description": "Keyboard key indicator for displaying shortcuts and hotkeys with neubrutalism styling" } ], "component_count": 93, "components_truncated": false, "component_types": { "registry:theme": 1, "registry:lib": 4, "registry:hook": 1, "registry:component": 1, "registry:ui": 84, "registry:style": 2 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 29, "name": "@bundui", "category": "Component library (general)", "tags": [ "saas", "dashboard", "aesthetic", "components" ], "tagline": "A collection of 150+ handcrafted UI components built with Tailwind CSS and shadcn/ui, covering marketing, e-commerce, dashboards, real estate, and more.", "short_description": "A collection of 150+ handcrafted UI components built with Tailwind CSS and shadcn/ui, covering marketing, e-commerce, dashboards, real estate, and more.", "description": "A curated collection of 200+ handcrafted UI components and blocks built with Tailwind CSS, Motion (Framer Motion), and shadcn/ui. Categories span marketing (hero sections, navbars, newsletters, bento grids, pricing), e-commerce (shopping carts, checkout forms), real-estate property listings, dashboard UI, base components, text effects, animated/motion components, and decorative backgrounds. Free and MIT-licensed. Use for: enriching a shadcn project with animated marketing, e-commerce, and dashboard blocks in a single registry.", "homepage": "https://bundui.io", "docs": "https://bundui.io", "github": "https://github.com/bundui/components", "components_github": "https://github.com/bundui/components/tree/main/components", "github_default_branch": "main", "github_stars": 392, "last_commit": "2025-10-04T21:03:09Z", "archived": false, "license": "MIT", "open_issues": 5, "registry_template": "https://bundui.io/r/{name}.json", "registry_index": "https://bundui.io/r/registry.json", "components": [ "accordion-default", "accordion-collapsible", "accordion-with-plus-icon", "alert-default", "alert-with-icon", "alert-with-title", "alert-with-action-button", "alert-with-dismiss", "alert-success", "alert-warning", "alert-danger", "alert-dialog", "avatar-default", "avatar-fallback-only", "avatar-with-status-indicator", "avatar-avatar-group", "avatar-sizes", "badge-default", "badge-secondary", "badge-destructive", "badge-outline", "badge-indicator", "badge-with-icon", "badge-with-dismiss", "breadcrumb-default", "breadcrumb-with-icon", "breadcrumb-with-dropdown", "button-default", "button-secondary", "button-destructive", "button-outline", "button-ghost", "button-link", "button-with-icon", "button-only-icon", "button-icon-sizes", "button-sizes", "button-disabled", "button-loading", "button-loading-with-icon", "calendar", "card-default", "card-with-header", "card-with-header-description", "card-with-header-icon", "card-with-action", "card-with-footer", "card-colored", "carousel-01", "carousel-02", "carousel-03", "chart", "checkbox", "collapsible", "combobox", "command", "context-menu", "data-table-01", "data-table-02", "data-table-03", "date-picker", "dialog", "divider-01", "divider-02", "divider-03", "drawer", "dropdown-menu", "hover-card", "input", "input-otp", "menubar", "navigation-menu", "pagination", "popover", "progress", "radio-group", "select-01", "select-02", "select-03", "select-04", "select-05", "sheet", "sidebar", "skeleton", "slider", "switch", "tabs", "toggle-group", "tooltip", "hero-sections-01", "hero-sections-02", "hero-sections-03", "hero-sections-04", "hero-sections-05", "cta-sections-01", "cta-sections-02", "cta-sections-03", "cta-sections-04", "pricing-sections-01", "pricing-sections-02" ], "component_items": [ { "name": "accordion-default", "type": "registry:component", "title": "Accordion", "description": "A vertically stacked set of interactive headings that each reveal a section of content." }, { "name": "accordion-collapsible", "type": "registry:component", "title": "Accordion", "description": "A vertically stacked set of interactive headings that each reveal a section of content." }, { "name": "accordion-with-plus-icon", "type": "registry:component", "title": "Accordion", "description": "A vertically stacked set of interactive headings that each reveal a section of content." }, { "name": "alert-default", "type": "registry:component", "title": "Alert", "description": "Displays a callout for user attention." }, { "name": "alert-with-icon", "type": "registry:component", "title": "Alert", "description": "Displays a callout for user attention." }, { "name": "alert-with-title", "type": "registry:component", "title": "Alert", "description": "Displays a callout for user attention." }, { "name": "alert-with-action-button", "type": "registry:component", "title": "Alert", "description": "Displays a callout for user attention." }, { "name": "alert-with-dismiss", "type": "registry:component", "title": "Alert", "description": "Displays a callout for user attention." }, { "name": "alert-success", "type": "registry:component", "title": "Alert", "description": "Displays a callout for user attention." }, { "name": "alert-warning", "type": "registry:component", "title": "Alert", "description": "Displays a callout for user attention." }, { "name": "alert-danger", "type": "registry:component", "title": "Alert", "description": "Displays a callout for user attention." }, { "name": "alert-dialog", "type": "registry:component", "title": "Alert Dialog", "description": "A modal dialog that interrupts the user with important content and expects a response." }, { "name": "avatar-default", "type": "registry:component", "title": "Avatar", "description": "An image element with fallbacks for representing the user." }, { "name": "avatar-fallback-only", "type": "registry:component", "title": "Avatar", "description": "An image element with fallbacks for representing the user." }, { "name": "avatar-with-status-indicator", "type": "registry:component", "title": "Avatar", "description": "An image element with fallbacks for representing the user." }, { "name": "avatar-avatar-group", "type": "registry:component", "title": "Avatar", "description": "An image element with fallbacks for representing the user." }, { "name": "avatar-sizes", "type": "registry:component", "title": "Avatar", "description": "An image element with fallbacks for representing the user." }, { "name": "badge-default", "type": "registry:component", "title": "Badge", "description": "Displays a badge or status indicator." }, { "name": "badge-secondary", "type": "registry:component", "title": "Badge", "description": "Displays a badge or status indicator." }, { "name": "badge-destructive", "type": "registry:component", "title": "Badge", "description": "Displays a badge or status indicator." }, { "name": "badge-outline", "type": "registry:component", "title": "Badge", "description": "Displays a badge or status indicator." }, { "name": "badge-indicator", "type": "registry:component", "title": "Badge", "description": "Displays a badge or status indicator." }, { "name": "badge-with-icon", "type": "registry:component", "title": "Badge", "description": "Displays a badge or status indicator." }, { "name": "badge-with-dismiss", "type": "registry:component", "title": "Badge", "description": "Displays a badge or status indicator." }, { "name": "breadcrumb-default", "type": "registry:component", "title": "Breadcrumb", "description": "Displays a breadcrumb navigation." }, { "name": "breadcrumb-with-icon", "type": "registry:component", "title": "Breadcrumb", "description": "Displays a breadcrumb navigation." }, { "name": "breadcrumb-with-dropdown", "type": "registry:component", "title": "Breadcrumb", "description": "Displays a breadcrumb navigation." }, { "name": "button-default", "type": "registry:component", "title": "Button", "description": "Displays a button or a component that looks like a button." }, { "name": "button-secondary", "type": "registry:component", "title": "Button", "description": "Displays a button or a component that looks like a button." }, { "name": "button-destructive", "type": "registry:component", "title": "Button", "description": "Displays a button or a component that looks like a button." }, { "name": "button-outline", "type": "registry:component", "title": "Button", "description": "Displays a button or a component that looks like a button." }, { "name": "button-ghost", "type": "registry:component", "title": "Button", "description": "Displays a button or a component that looks like a button." }, { "name": "button-link", "type": "registry:component", "title": "Button", "description": "Displays a button or a component that looks like a button." }, { "name": "button-with-icon", "type": "registry:component", "title": "Button", "description": "Displays a button or a component that looks like a button." }, { "name": "button-only-icon", "type": "registry:component", "title": "Button", "description": "Displays a button or a component that looks like a button." }, { "name": "button-icon-sizes", "type": "registry:component", "title": "Button", "description": "Displays a button or a component that looks like a button." }, { "name": "button-sizes", "type": "registry:component", "title": "Button", "description": "Displays a button or a component that looks like a button." }, { "name": "button-disabled", "type": "registry:component", "title": "Button", "description": "Displays a button or a component that looks like a button." }, { "name": "button-loading", "type": "registry:component", "title": "Button", "description": "Displays a button or a component that looks like a button." }, { "name": "button-loading-with-icon", "type": "registry:component", "title": "Button", "description": "Displays a button or a component that looks like a button." }, { "name": "calendar", "type": "registry:component", "title": "Calendar", "description": "A date picker component with range and single date selection." }, { "name": "card-default", "type": "registry:component", "title": "Card", "description": "Displays a card with header, content, and footer." }, { "name": "card-with-header", "type": "registry:component", "title": "Card", "description": "Displays a card with header, content, and footer." }, { "name": "card-with-header-description", "type": "registry:component", "title": "Card", "description": "Displays a card with header, content, and footer." }, { "name": "card-with-header-icon", "type": "registry:component", "title": "Card", "description": "Displays a card with header, content, and footer." }, { "name": "card-with-action", "type": "registry:component", "title": "Card", "description": "Displays a card with header, content, and footer." }, { "name": "card-with-footer", "type": "registry:component", "title": "Card", "description": "Displays a card with header, content, and footer." }, { "name": "card-colored", "type": "registry:component", "title": "Card", "description": "Displays a card with header, content, and footer." }, { "name": "carousel-01", "type": "registry:component", "title": "Carousel", "description": "A carousel component for cycling through a series of content." }, { "name": "carousel-02", "type": "registry:component", "title": "Carousel", "description": "A carousel component for cycling through a series of content." }, { "name": "carousel-03", "type": "registry:component", "title": "Carousel", "description": "A carousel component for cycling through a series of content." }, { "name": "chart", "type": "registry:component", "title": "Chart", "description": "Beautiful charts. Built using Recharts. Copy and paste into your apps." }, { "name": "checkbox", "type": "registry:component", "title": "Checkbox", "description": "A control that allows the user to toggle between checked and not checked." }, { "name": "collapsible", "type": "registry:component", "title": "Collapsible", "description": "Used to hide and show content with a smooth animation." }, { "name": "combobox", "type": "registry:component", "title": "Combobox", "description": "Combines a text input with a list of options." }, { "name": "command", "type": "registry:component", "title": "Command", "description": "Fast, composable command palette component." }, { "name": "context-menu", "type": "registry:component", "title": "Context Menu", "description": "Displays a menu to the user — triggered by a right click." }, { "name": "data-table-01", "type": "registry:component", "title": "Data Table", "description": "Display complex data in a table format with filtering, sorting and pagination." }, { "name": "data-table-02", "type": "registry:component", "title": "Data Table", "description": "Display complex data in a table format with filtering, sorting and pagination." }, { "name": "data-table-03", "type": "registry:component", "title": "Data Table", "description": "Display complex data in a table format with filtering, sorting and pagination." } ], "component_count": 217, "components_truncated": true, "component_types": { "registry:component": 217 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 30, "name": "@cardcn", "category": "Niche/single-purpose", "tags": [ "components" ], "tagline": "A set of beautifully-designed shadcn card components", "short_description": "A set of beautifully-designed shadcn card components", "description": "A focused registry of beautifully styled shadcn/ui Card-component variations built with React, Tailwind CSS, and TypeScript. Each card variant is individually copy-pasteable. Built using TanStack Start, deployed on Cloudflare Workers. Free and open source. Use for: browsing and pulling distinct card layout patterns (stat cards, profile cards, etc.) when the default shadcn Card is too plain for a design.", "homepage": "https://cardcn.dev", "docs": "https://cardcn.dev", "github": "https://github.com/Ali-Hussein-dev/cardcn", "components_github": "https://github.com/Ali-Hussein-dev/cardcn/tree/main/src/components", "github_default_branch": "main", "github_stars": 46, "last_commit": "2026-06-18T18:08:05Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://cardcn.dev/r/{name}.json", "registry_index": "https://cardcn.dev/r/registry.json", "components": [ "card-1", "card-2", "card-3", "card-4", "card-5", "card-6", "card-7", "card-8", "card-9", "card-10", "card-11", "card-12", "card-13", "card-14", "card-15", "card-16", "card-17", "card-18", "card-19", "card-20", "card-21", "card-22", "card-23", "card-24", "card-25", "card-26", "card-27" ], "component_items": [ { "name": "card-1", "type": "registry:component", "title": "Card 1", "description": "Card component" }, { "name": "card-2", "type": "registry:component", "title": "Card 2", "description": "Card component" }, { "name": "card-3", "type": "registry:component", "title": "Card 3", "description": "Card component" }, { "name": "card-4", "type": "registry:component", "title": "Card 4", "description": "Card component" }, { "name": "card-5", "type": "registry:component", "title": "Card 5", "description": "Card component" }, { "name": "card-6", "type": "registry:component", "title": "Card 6", "description": "Card component" }, { "name": "card-7", "type": "registry:component", "title": "Card 7", "description": "Card component" }, { "name": "card-8", "type": "registry:component", "title": "Card 8", "description": "Card component" }, { "name": "card-9", "type": "registry:component", "title": "Card 9", "description": "Card component" }, { "name": "card-10", "type": "registry:component", "title": "Card 10", "description": "Card component" }, { "name": "card-11", "type": "registry:component", "title": "Card 11", "description": "Card component" }, { "name": "card-12", "type": "registry:component", "title": "Card 12", "description": "Card component" }, { "name": "card-13", "type": "registry:component", "title": "Card 13", "description": "Card component" }, { "name": "card-14", "type": "registry:component", "title": "Card 14", "description": "Card component" }, { "name": "card-15", "type": "registry:component", "title": "Card 15", "description": "Card component" }, { "name": "card-16", "type": "registry:component", "title": "Card 16", "description": "Card component" }, { "name": "card-17", "type": "registry:component", "title": "Card 17", "description": "Card component" }, { "name": "card-18", "type": "registry:component", "title": "Card 18", "description": "Card component" }, { "name": "card-19", "type": "registry:component", "title": "Card 19", "description": "Card component" }, { "name": "card-20", "type": "registry:component", "title": "Card 20", "description": "Card component" }, { "name": "card-21", "type": "registry:component", "title": "Card 21", "description": "Card component" }, { "name": "card-22", "type": "registry:component", "title": "Card 22", "description": "Card component" }, { "name": "card-23", "type": "registry:component", "title": "Card 23", "description": "Card component" }, { "name": "card-24", "type": "registry:component", "title": "Card 24", "description": "Card component" }, { "name": "card-25", "type": "registry:component", "title": "Card 25", "description": "Card component" }, { "name": "card-26", "type": "registry:component", "title": "Card 26", "description": "Card component" }, { "name": "card-27", "type": "registry:component", "title": "Card 27", "description": "Card component" } ], "component_count": 27, "components_truncated": false, "component_types": { "registry:component": 27 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 31, "name": "@chamaac", "category": "Animated components", "tags": [ "saas", "aesthetic" ], "tagline": "A collection of beautiful, animated components to elevate your web projects instantly.", "short_description": "A collection of beautiful, animated components to elevate your web projects instantly.", "description": "A premium collection of high-performance animated and shader-driven components for React. Includes GLSL/WebGL shader backgrounds, React Three Fiber interactive scenes, and Framer Motion-animated elements. Components emphasize visual impact — particle effects, liquid shaders, scroll-triggered animations. Built with Tailwind CSS and Motion; copy-paste model. Free, MIT-licensed. Use for: adding GPU-accelerated shader backgrounds or cinematic scroll animations to a landing page or portfolio where visual differentiation matters.", "homepage": "https://chamaac.com", "docs": "https://chamaac.com/components", "github": "https://github.com/amarnathdhumal/chamaacui", "components_github": "https://github.com/amarnathdhumal/chamaacui/tree/main/registry", "github_default_branch": "main", "github_stars": 43, "last_commit": "2026-06-30T02:32:57Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://chamaac.com/r/{name}.json", "registry_index": "https://chamaac.com/r/registry.json", "components": [ "electric-mist", "waves", "liquid-chrome", "nebula", "astral-flow", "synthesis", "light-speed", "stats-cards", "interactive-grid-background", "text-loop", "gif-text", "dancing-letters", "premium-button", "shimmer-button", "slideup-button", "hover-arrow-button", "focus-button", "neo-brutalist-button", "glowing-border-button", "gauge", "carousel", "feature-steps", "dock", "copy-icon", "wavy-icon", "adjustments-icon", "ai-input", "scan-icon", "bell-icon", "settings-icon", "activity-icon", "refresh-icon", "wifi-icon", "arrow-right-icon", "download-icon", "globe-icon", "star-icon", "hourglass-icon", "lightbulb-icon", "music-icon", "heart-icon", "mail-icon", "location-icon", "lock-icon", "rocket-icon", "zap-icon", "eye-icon", "send-icon", "volume-icon", "check-icon", "sparkle-icon", "menu-icon", "alert-circle-icon", "external-link-icon", "cloud-icon", "credit-card-icon", "cart-icon", "arrow-left-icon", "arrow-up-icon", "arrow-down-icon", "arrow-up-right-icon", "arrow-up-left-icon", "arrow-down-left-icon", "arrow-down-right-icon", "chevron-right-icon", "chevron-left-icon", "chevron-up-icon", "chevron-down-icon", "chevrons-right-icon", "chevrons-left-icon", "chevrons-up-icon", "chevrons-down-icon", "calendar-icon", "shield-icon", "upload-icon", "message-icon", "search-icon", "close-icon", "clock-icon", "layers-icon", "moon-icon", "sun-icon", "trash-icon", "battery-icon", "gift-icon", "crown-icon", "thumbs-up-icon", "how-it-works", "water-caustic", "grid-bloom" ], "component_items": [ { "name": "electric-mist", "type": "registry:component", "title": "Electric Mist", "description": "A high-energy glowing lightning shader with waves and smoke effects." }, { "name": "waves", "type": "registry:component", "title": "Waves", "description": "A smooth, shader-based wave animation component." }, { "name": "liquid-chrome", "type": "registry:component", "title": "Liquid Chrome", "description": "A smooth, mesmerizing liquid metal shader effect." }, { "name": "nebula", "type": "registry:component", "title": "Nebula", "description": "A deep space nebula effect with fractional distortion." }, { "name": "astral-flow", "type": "registry:component", "title": "Astral Flow", "description": "A majestic, constantly breathing radial shader with deep cosmic wisps." }, { "name": "synthesis", "type": "registry:component", "title": "Synthesis", "description": "A professional, multi-layered cosmic flow background with extensive warping customization." }, { "name": "light-speed", "type": "registry:component", "title": "Light Speed", "description": "A Warp/Light-Speed hyperspace animation inspired by the Ducky3D Blender tutorial." }, { "name": "stats-cards", "type": "registry:component", "title": "Stats Cards", "description": "A set of animated statistic cards with hover effects." }, { "name": "interactive-grid-background", "type": "registry:component", "title": "Interactive Grid Background", "description": "A highly interactive, mouse-sensitive grid background." }, { "name": "text-loop", "type": "registry:component", "title": "Text Loop", "description": "An animated text loop with typewriter and gradient effect." }, { "name": "gif-text", "type": "registry:component", "title": "Gif Text", "description": "A stunning text effect that uses a GIF as the fill color." }, { "name": "dancing-letters", "type": "registry:component", "title": "Dancing Letters", "description": "Physics-based interactive text animations with multiple animation styles." }, { "name": "premium-button", "type": "registry:component", "title": "Premium Button", "description": "An animated button with a dynamic arrow grid animation." }, { "name": "shimmer-button", "type": "registry:component", "title": "Shimmer Button", "description": "A button with a shimmer animation effect." }, { "name": "slideup-button", "type": "registry:component", "title": "Slide Up Button", "description": "A button with a smooth slide-up text animation on hover." }, { "name": "hover-arrow-button", "type": "registry:component", "title": "Hover Arrow Button", "description": "A button with a smooth hover arrow swap animation." }, { "name": "focus-button", "type": "registry:component", "title": "Focus Button", "description": "A button with a focus ring animation effect." }, { "name": "neo-brutalist-button", "type": "registry:component", "title": "Neo Brutalist Button", "description": "A bold, retro-styled button with skewed design, offset shadow, and shimmer effect." }, { "name": "glowing-border-button", "type": "registry:component", "title": "Glowing Border Button", "description": "A stylish button with a glowing border animation." }, { "name": "gauge", "type": "registry:component", "title": "Gauge", "description": "A customizable semi-circular gauge component for visualizing metrics and performance scores." }, { "name": "carousel", "type": "registry:component", "title": "Carousel", "description": "A smooth, auto-playing 3D carousel component with layout animations." }, { "name": "feature-steps", "type": "registry:component", "title": "Feature Steps", "description": "A dynamic feature showcase with auto-playing steps and synchronized image transitions." }, { "name": "dock", "type": "registry:component", "title": "Dock", "description": "A navigation dock component with smooth animations and hover effects, perfect for desktop interfaces." }, { "name": "copy-icon", "type": "registry:component", "title": "Copy Icon", "description": "An animated copy icon with smooth motion effects." }, { "name": "wavy-icon", "type": "registry:component", "title": "Wavy Icon", "description": "An animated wavy icon with smooth motion effects." }, { "name": "adjustments-icon", "type": "registry:component", "title": "Adjustments Icon", "description": "An animated adjustments/settings icon with smooth motion effects." }, { "name": "ai-input", "type": "registry:component", "title": "AI Input", "description": "A polished AI input component with model selection, tools, file uploads, and smooth animations." }, { "name": "scan-icon", "type": "registry:component", "title": "Scan Icon", "description": "An animated scan icon with a moving scan line." }, { "name": "bell-icon", "type": "registry:component", "title": "Bell Icon", "description": "An animated bell icon that rings." }, { "name": "settings-icon", "type": "registry:component", "title": "Settings Icon", "description": "An animated settings icon that rotates." }, { "name": "activity-icon", "type": "registry:component", "title": "Activity Icon", "description": "An animated activity icon with a heartbeat line." }, { "name": "refresh-icon", "type": "registry:component", "title": "Refresh Icon", "description": "An animated refresh icon that rotates." }, { "name": "wifi-icon", "type": "registry:component", "title": "Wifi Icon", "description": "An animated wifi icon with pulsing signal bars." }, { "name": "arrow-right-icon", "type": "registry:component", "title": "Arrow Right Icon", "description": "An animated arrow right icon that moves horizontally." }, { "name": "download-icon", "type": "registry:component", "title": "Download Icon", "description": "An animated download icon with a bouncing arrow." }, { "name": "globe-icon", "type": "registry:component", "title": "Globe Icon", "description": "An animated globe icon that rotates continuously." }, { "name": "star-icon", "type": "registry:component", "title": "Star Icon", "description": "An animated star icon that twinkles and rotates." }, { "name": "hourglass-icon", "type": "registry:component", "title": "Hourglass Icon", "description": "An animated hourglass icon that rotates." }, { "name": "lightbulb-icon", "type": "registry:component", "title": "Lightbulb Icon", "description": "An animated lightbulb icon with pulsing rays." }, { "name": "music-icon", "type": "registry:component", "title": "Music Icon", "description": "An animated music icon with dancing notes." }, { "name": "heart-icon", "type": "registry:component", "title": "Heart Icon", "description": "An animated heart icon that beats." }, { "name": "mail-icon", "type": "registry:component", "title": "Mail Icon", "description": "An animated mail icon with a moving envelope flap." }, { "name": "location-icon", "type": "registry:component", "title": "Location Icon", "description": "An animated location icon that rotates like a compass." }, { "name": "lock-icon", "type": "registry:component", "title": "Lock Icon", "description": "An animated lock icon that locks and unlocks." }, { "name": "rocket-icon", "type": "registry:component", "title": "Rocket Icon", "description": "An animated rocket icon with launch thrust animation." }, { "name": "zap-icon", "type": "registry:component", "title": "Zap Icon", "description": "An animated zap icon with electric flash effect." }, { "name": "eye-icon", "type": "registry:component", "title": "Eye Icon", "description": "An animated eye icon with blinking and looking animation." }, { "name": "send-icon", "type": "registry:component", "title": "Send Icon", "description": "An animated send icon with paper airplane flying motion." }, { "name": "volume-icon", "type": "registry:component", "title": "Volume Icon", "description": "An animated volume icon with pulsing sound waves." }, { "name": "check-icon", "type": "registry:component", "title": "Check Icon", "description": "An animated check icon with drawing circle and checkmark." }, { "name": "sparkle-icon", "type": "registry:component", "title": "Sparkle Icon", "description": "An animated sparkle icon with twinkling stars." }, { "name": "menu-icon", "type": "registry:component", "title": "Menu Icon", "description": "An animated menu icon." }, { "name": "alert-circle-icon", "type": "registry:component", "title": "Alert Icon", "description": "An animated alert icon." }, { "name": "external-link-icon", "type": "registry:component", "title": "External Link Icon", "description": "An animated external link icon." }, { "name": "cloud-icon", "type": "registry:component", "title": "Cloud Icon", "description": "An animated cloud icon." }, { "name": "credit-card-icon", "type": "registry:component", "title": "Credit Card Icon", "description": "An animated credit card icon." }, { "name": "cart-icon", "type": "registry:component", "title": "Cart Icon", "description": "An animated cart icon." }, { "name": "arrow-left-icon", "type": "registry:component", "title": "Arrow Left Icon", "description": "An animated arrow left icon." }, { "name": "arrow-up-icon", "type": "registry:component", "title": "Arrow Up Icon", "description": "An animated arrow up icon." }, { "name": "arrow-down-icon", "type": "registry:component", "title": "Arrow Down Icon", "description": "An animated arrow down icon." } ], "component_count": 90, "components_truncated": false, "component_types": { "registry:component": 90 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 36, "name": "@channel3", "category": "Uncategorized", "tags": [], "tagline": "Open-source React components for building shopping experiences on the Channel3 product API: search, filters, product detail, offer comparison, and price history.", "short_description": "", "description": "Open-source React components for building shopping experiences on the Channel3 product API: search, filters, product detail, offer comparison, and price history.", "homepage": "https://trychannel3.com/developers/ui", "docs": "https://docs.trychannel3.com/ui", "github": "https://github.com/channel3-ai/channel3-ui", "components_github": "https://github.com/channel3-ai/channel3-ui/tree/main/registry", "github_default_branch": "main", "github_stars": 4, "last_commit": "2026-06-26T20:07:50Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://ui.trychannel3.com/r/{name}.json", "registry_index": "https://ui.trychannel3.com/r/registry.json", "components": [ "format", "variants", "use-latest-request", "use-in-viewport", "use-variant-selection", "search", "use-product-recommendations", "use-async-options", "use-infinite-scroll", "use-product-search", "price-range-gauge", "price-history-chart", "product-card", "offers-list", "image-gallery", "variant-selector", "product-attributes", "product-grid", "product-carousel", "product-details", "product-recommendations", "search-bar", "product-filters", "product-search", "all" ], "component_items": [ { "name": "format", "type": "registry:lib", "title": "Format helpers", "description": "Price, currency, discount, domain, availability, and image helpers for Channel3 product data." }, { "name": "variants", "type": "registry:lib", "title": "Variant helpers", "description": "Classifies variant option values into display tiers from `exists` and `available`." }, { "name": "use-latest-request", "type": "registry:hook", "title": "useLatestRequest", "description": "Latest-wins guard for overlapping async work: tracks the most recent request and drops stale responses from superseded ones." }, { "name": "use-in-viewport", "type": "registry:hook", "title": "useInViewport", "description": "Fires a callback when an element enters the viewport via IntersectionObserver, with one-shot and repeating modes for lazy sections and infinite-scroll sentinel…" }, { "name": "use-variant-selection", "type": "registry:hook", "title": "useVariantSelection", "description": "Manages variant selection and server-side re-resolution via an injected resolver, keeping the API key on your server." }, { "name": "search", "type": "registry:lib", "title": "Search filter helpers", "description": "UI-friendly search filter state, conversion to the SDK SearchFilters payload, option lists, color presets, and hex helpers." }, { "name": "use-product-recommendations", "type": "registry:hook", "title": "useProductRecommendations", "description": "Lazily fetches similar products when the section scrolls into view, via an injected fetcher, so it never blocks the PDP." }, { "name": "use-async-options", "type": "registry:hook", "title": "useAsyncOptions", "description": "Debounced typeahead loader for brand/category suggestions, delegating to an injected server-side fetcher." }, { "name": "use-infinite-scroll", "type": "registry:hook", "title": "useInfiniteScroll", "description": "Headless infinite-scroll pagination over a token-paged list: seeds an initial page, appends subsequent pages via an injected fetcher, and exposes a sentinel re…" }, { "name": "use-product-search", "type": "registry:hook", "title": "useProductSearch", "description": "Query + filter state, debounced auto-search, and infinite-scroll pagination via an injected search fetcher." }, { "name": "price-range-gauge", "type": "registry:component", "title": "Price Range Gauge", "description": "Plots the current price against its historical range as low/typical/high zones with a tick at the current price." }, { "name": "price-history-chart", "type": "registry:component", "title": "Price History Chart", "description": "Area chart of a product's price over time, built on the shadcn chart wrapper." }, { "name": "product-card", "type": "registry:component", "title": "Product Card", "description": "Borderless, image-forward product tile with hover image-swap and color swatches, for grids and carousels. Includes a loading skeleton." }, { "name": "offers-list", "type": "registry:component", "title": "Offers List", "description": "Compares merchant offers for a product, cheapest first, with affiliate-tracked buy links." }, { "name": "image-gallery", "type": "registry:component", "title": "Image Gallery", "description": "Product image carousel with a synced thumbnail strip." }, { "name": "variant-selector", "type": "registry:component", "title": "Variant Selector", "description": "Renders every variant dimension as pills or swatches with three tiers of emphasis (purchasable, out-of-stock, not-offered)." }, { "name": "product-attributes", "type": "registry:component", "title": "Product Attributes", "description": "Renders a product's extracted attributes (structured_attributes plus materials, gender, and age) as a two-column definition list." }, { "name": "product-grid", "type": "registry:component", "title": "Product Grid", "description": "Responsive grid of product cards with loading skeletons and an empty state." }, { "name": "product-carousel", "type": "registry:component", "title": "Product Carousel", "description": "Horizontally scrollable row of product cards with nav controls (e.g. \"More like this\")." }, { "name": "product-details", "type": "registry:block", "title": "Product Details (PDP)", "description": "Compound product detail page: gallery, header (all brands), variant selection, offers, price history, description, attributes, and an optional 'you might also …" }, { "name": "product-recommendations", "type": "registry:component", "title": "Product Recommendations", "description": "Lazy \"you might also like\" carousel for a PDP: defers the findSimilar fetch until it scrolls into view and hides itself when empty." }, { "name": "search-bar", "type": "registry:component", "title": "Search Bar", "description": "Controlled search input with submit-on-Enter, a clear button, and an optional image-search trigger." }, { "name": "product-filters", "type": "registry:component", "title": "Product Filters", "description": "Compound, configurable filter panel (stacked sidebar or horizontal popover bar): price, gender, age, condition, availability, hex color palette with opt-in per…" }, { "name": "product-search", "type": "registry:block", "title": "Product Search", "description": "Batteries-included search experience: search bar, configurable filters, and an infinite-scroll results grid wired to useProductSearch." }, { "name": "all", "type": "registry:block", "title": "Channel3 — everything", "description": "Installs the full Channel3 UI kit: every component, hook, and lib in the registry." } ], "component_count": 25, "components_truncated": false, "component_types": { "registry:lib": 3, "registry:hook": 7, "registry:component": 12, "registry:block": 3 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 32, "name": "@clerk", "category": "Auth/identity", "tags": [ "components" ], "tagline": "The easiest way to add authentication and user management to your application. Purpose-built for React, Next.js, Remix, and The Modern Web.", "short_description": "The easiest way to add authentication and user management to your application. Purpose-built for React, Next.js, Remix, and The Modern Web.", "description": "Official Clerk authentication components distributed through the shadcn CLI. Provides pre-built, themeable React sign-in, sign-up, user-profile, and organization-management UI components that integrate directly with Clerk's authentication backend. Designed for Next.js, Remix, and other React frameworks. Not open-source in the traditional sense — requires a Clerk account. Use for: adding Clerk-powered auth flows with shadcn-compatible styling without manually building every auth screen.", "homepage": "https://clerk.com/docs/guides/development/shadcn-cli", "docs": "https://clerk.com/docs", "github": "N/A", "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://clerk.com/r/{name}.json", "registry_index": "https://clerk.com/r/registry.json", "components": [ "nextjs-clerk-provider", "nextjs-middleware", "nextjs-theme-provider", "nextjs-header", "nextjs-layout-with-header", "nextjs-quickstart", "nextjs-quickstart-sign-in-or-up", "nextjs-sign-in-page", "nextjs-sign-up-page", "nextjs-waitlist-page", "nextjs-aio-multistep-onboarding", "nextjs-custom-flows-multistep-onboarding" ], "component_items": [ { "name": "nextjs-clerk-provider", "type": "registry:component", "title": "Clerk Provider (App Router)", "description": "The component is required to integrate Clerk into your React application, providing session and user context to Clerk's hooks and components." }, { "name": "nextjs-middleware", "type": "registry:file", "title": "Clerk Next.js Middleware", "description": "The clerkMiddleware() helper integrates Clerk authentication into your Next.js application through Middleware. clerkMiddleware() is compatible with both the Ap…" }, { "name": "nextjs-theme-provider", "type": "registry:component", "title": "Theme Provider", "description": "A theme provider component using next-themes for dark mode support." }, { "name": "nextjs-header", "type": "registry:component", "title": "Header Component", "description": "A header component with Clerk authentication buttons and user button." }, { "name": "nextjs-layout-with-header", "type": "registry:page", "title": "Layout with Header", "description": "A root layout component with Clerk provider, theme provider, and header." }, { "name": "nextjs-quickstart", "type": "registry:block", "title": "Clerk Next.js Quickstart (App Router)", "description": "A quickstart for Next.js App Router with Clerk authentication." }, { "name": "nextjs-quickstart-sign-in-or-up", "type": "registry:block", "title": "Clerk Next.js Quickstart — Sign-in-or-up (App Router)", "description": "A minimal Clerk quickstart for Next.js App Router with a single combined sign-in-or-up page (no separate sign-up route)." }, { "name": "nextjs-sign-in-page", "type": "registry:page", "title": "Clerk Next.js Sign In Page (App Router)", "description": "A sign in page for Next.js App Router with Clerk authentication." }, { "name": "nextjs-sign-up-page", "type": "registry:page", "title": "Clerk Next.js Sign Up Page (App Router)", "description": "A sign up page for Next.js App Router with Clerk authentication." }, { "name": "nextjs-waitlist-page", "type": "registry:page", "title": "Clerk Next.js Waitlist Page (App Router)", "description": "A waitlist page for Next.js App Router with Clerk authentication." }, { "name": "nextjs-aio-multistep-onboarding", "type": "registry:block", "title": "Multistep Onboarding Flow (AIO)", "description": "A multistep onboarding flow using Clerk's prebuilt component with embedded session tasks." }, { "name": "nextjs-custom-flows-multistep-onboarding", "type": "registry:block", "title": "Multistep Onboarding Flow", "description": "A custom sign-up and sign-in onboarding flow using Clerk's useSignIn and useSignUp hooks with animated step transitions." } ], "component_count": 12, "components_truncated": false, "component_types": { "registry:component": 3, "registry:file": 1, "registry:page": 4, "registry:block": 4 }, "has_logo": true, "enrichment_errors": [ "github_lookup_failed" ], "featured": true }, { "number": 33, "name": "@cognicatch", "category": "AI/chat UI", "tags": [ "ai" ], "tagline": "Adaptive Error Boundaries and graceful fallback UIs (Banners, Modals, Toasts).", "short_description": "Adaptive Error Boundaries and graceful fallback UIs (Banners, Modals, Toasts).", "description": "Production-grade React error-boundary infrastructure built for generative-UI applications. Provides AIBoundary for catching LLM hallucinations and malformed JSON payloads, BannerFallback, ModalFallback, and ToastFallback recovery UIs. Features zero-PII client-side scrubbing (emails, JWTs, API keys, credit cards redacted before telemetry), OpenTelemetry/OTLP vendor-agnostic error forwarding, and WCAG-compliant focus traps. Free for manual mode; API key required for managed telemetry. Use for: wrapping AI-generated UI trees so runtime crashes degrade gracefully instead of showing a blank screen.", "homepage": "https://cognicatch.dev", "docs": "https://cognicatch.dev", "github": "https://github.com/CogniCatch/react", "components_github": "https://github.com/CogniCatch/react/tree/main/src/components", "github_default_branch": "main", "github_stars": 7, "last_commit": "2026-05-02T21:58:36Z", "archived": false, "license": "MIT", "open_issues": 5, "registry_template": "https://cognicatch.dev/registry/{name}.json", "registry_index": "https://cognicatch.dev/registry/registry.json", "components": [ "adaptive-banner", "adaptive-fatal-error", "adaptive-toast", "adaptive-error-boundary" ], "component_items": [ { "name": "adaptive-banner", "type": "registry:component", "title": "Adaptive Banner", "description": "A graceful fallback UI banner for error handling and alerts." }, { "name": "adaptive-fatal-error", "type": "registry:component", "title": "Adaptive Fatal Error", "description": "A full-screen, accessible modal for unrecoverable crashes." }, { "name": "adaptive-toast", "type": "registry:component", "title": "Adaptive Toast", "description": "A pre-styled, recovery-ready wrapper around Sonner for error notifications." }, { "name": "adaptive-error-boundary", "type": "registry:component", "title": "Adaptive Error Boundary", "description": "A ready-to-use Error Boundary that degrades UI gracefully using toasts, banners, or modals." } ], "component_count": 4, "components_truncated": false, "component_types": { "registry:component": 4 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 34, "name": "@commercn", "category": "E-commerce/payments", "tags": [ "aesthetic" ], "tagline": "Shadcn UI Blocks for Ecommerce websites", "short_description": "Shadcn UI Blocks for Ecommerce websites", "description": "A focused set of shadcn/ui blocks specifically for e-commerce UIs. Current catalog includes cart-item variants (cart-item-01, cart-item-02) with further blocks in progress. Built with Next.js 16, React 19, TypeScript, Tailwind CSS v4, Motion animations, and Fumadocs for docs. Free and MIT-licensed. Use for: adding styled shopping-cart and checkout UI blocks to a Next.js e-commerce storefront without building cart components from scratch.", "homepage": "https://commercn.com", "docs": "https://commercn.com/docs/carts/cart-item-01", "github": "https://github.com/Logging-Studio/Commercn", "components_github": "https://github.com/Logging-Studio/Commercn/tree/main/src/components", "github_default_branch": "main", "github_stars": 72, "last_commit": "2026-02-03T06:50:17Z", "archived": false, "license": null, "open_issues": 0, "registry_template": "https://commercn.com/r/{name}.json", "registry_index": "https://commercn.com/r/registry.json", "components": [ "cart-01", "checkout-01", "checkout-02", "checkout-03", "cart-02", "category-01", "category-02", "category-03", "category-04", "order-01", "product-card-01", "product-card-02", "product-card-03", "product-detail-01", "review-01" ], "component_items": [ { "name": "cart-01", "type": "registry:block", "title": "Cart 01", "description": null }, { "name": "checkout-01", "type": "registry:block", "title": "Checkout 01", "description": null }, { "name": "checkout-02", "type": "registry:block", "title": "Checkout 02", "description": null }, { "name": "checkout-03", "type": "registry:block", "title": "Checkout 03", "description": null }, { "name": "cart-02", "type": "registry:block", "title": "Cart 02", "description": null }, { "name": "category-01", "type": "registry:block", "title": "Category 01", "description": null }, { "name": "category-02", "type": "registry:block", "title": "Category 02", "description": null }, { "name": "category-03", "type": "registry:block", "title": "Category 03", "description": null }, { "name": "category-04", "type": "registry:block", "title": "Category 04", "description": null }, { "name": "order-01", "type": "registry:block", "title": "Order 01", "description": null }, { "name": "product-card-01", "type": "registry:block", "title": "Product Card 01", "description": null }, { "name": "product-card-02", "type": "registry:block", "title": "Product Card 02", "description": null }, { "name": "product-card-03", "type": "registry:block", "title": "Product Card 03", "description": null }, { "name": "product-detail-01", "type": "registry:block", "title": "Product Detail 01", "description": null }, { "name": "review-01", "type": "registry:block", "title": "Review 01", "description": null } ], "component_count": 15, "components_truncated": false, "component_types": { "registry:block": 15 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 35, "name": "@componentry", "category": "Animated components", "tags": [ "saas", "aesthetic" ], "tagline": "Beautiful, interactive React + Tailwind components for modern product UIs.", "short_description": "Beautiful, interactive React + Tailwind components for modern product UIs.", "description": "Free, open-source React component library by Harsh Jadhav featuring beautiful, animated copy-paste components built with Tailwind CSS, TypeScript, and Framer Motion. Includes cursor-driven particle typography, dither-gradient effects, image trails, WebGL liquid backgrounds, scroll choreography, split-flap displays, pixel canvas, magnet lines, magnetic dock, and 30+ interactive components. Shadcn-compatible, MIT-licensed. Use for: adding high-visual-impact interactive animations and creative cursor/scroll effects to a product landing page or portfolio.", "homepage": "https://componentry.fun", "docs": "https://componentry.fun/docs", "github": "https://github.com/harshjdhv/componentry", "components_github": null, "github_default_branch": "main", "github_stars": 230, "last_commit": "2026-07-07T18:52:17Z", "archived": false, "license": "MIT", "open_issues": 1, "registry_template": "https://componentry.fun/r/{name}.json", "registry_index": "https://componentry.fun/r/registry.json", "components": [ "animated-gradient", "auth-modal", "border-beam", "bouncy-accordion", "circuit-board", "closing-plasma", "collection-surfer", "command-menu", "cursor-driven-particle-typography", "dither-gradient", "dither-prism-hero", "eye-tracking", "flight-status-card", "github-calendar", "hero-geometric", "hyper-text", "image-ripple-effect", "image-trail", "infinite-image-field", "interactive-hover-button", "kinetic-text-reveal", "layered-stack", "letter-cascade", "liquid-blob", "liquid-chrome", "mac-keyboard", "magnet-lines", "magnetic-dock", "matrix-rain", "music-player", "noise-texture", "orbit-card-stack", "particle-galaxy", "pixel-canvas", "pulsating-button", "ripple-transition", "scroll-based-velocity", "scroll-choreography", "scroll-split-card", "scrub-input", "shimmer-button", "showcase-card", "signature", "silk-aurora", "split-flap-display", "spotlight-card", "sticky-scroll-cards", "testimonial-marquee", "text-animate", "text-repel", "webgl-liquid", "gradient-hero-01" ], "component_items": [ { "name": "animated-gradient", "type": "registry:ui", "title": null, "description": null }, { "name": "auth-modal", "type": "registry:ui", "title": null, "description": null }, { "name": "border-beam", "type": "registry:ui", "title": null, "description": null }, { "name": "bouncy-accordion", "type": "registry:ui", "title": null, "description": null }, { "name": "circuit-board", "type": "registry:ui", "title": null, "description": null }, { "name": "closing-plasma", "type": "registry:ui", "title": null, "description": null }, { "name": "collection-surfer", "type": "registry:ui", "title": null, "description": null }, { "name": "command-menu", "type": "registry:ui", "title": null, "description": null }, { "name": "cursor-driven-particle-typography", "type": "registry:ui", "title": null, "description": null }, { "name": "dither-gradient", "type": "registry:ui", "title": null, "description": null }, { "name": "dither-prism-hero", "type": "registry:ui", "title": null, "description": null }, { "name": "eye-tracking", "type": "registry:ui", "title": null, "description": null }, { "name": "flight-status-card", "type": "registry:ui", "title": null, "description": null }, { "name": "github-calendar", "type": "registry:ui", "title": null, "description": null }, { "name": "hero-geometric", "type": "registry:ui", "title": null, "description": null }, { "name": "hyper-text", "type": "registry:ui", "title": null, "description": null }, { "name": "image-ripple-effect", "type": "registry:ui", "title": null, "description": null }, { "name": "image-trail", "type": "registry:ui", "title": null, "description": null }, { "name": "infinite-image-field", "type": "registry:ui", "title": null, "description": null }, { "name": "interactive-hover-button", "type": "registry:ui", "title": null, "description": null }, { "name": "kinetic-text-reveal", "type": "registry:ui", "title": null, "description": null }, { "name": "layered-stack", "type": "registry:ui", "title": null, "description": null }, { "name": "letter-cascade", "type": "registry:ui", "title": null, "description": null }, { "name": "liquid-blob", "type": "registry:ui", "title": null, "description": null }, { "name": "liquid-chrome", "type": "registry:ui", "title": null, "description": null }, { "name": "mac-keyboard", "type": "registry:ui", "title": null, "description": null }, { "name": "magnet-lines", "type": "registry:ui", "title": null, "description": null }, { "name": "magnetic-dock", "type": "registry:ui", "title": null, "description": null }, { "name": "matrix-rain", "type": "registry:ui", "title": null, "description": null }, { "name": "music-player", "type": "registry:ui", "title": null, "description": null }, { "name": "noise-texture", "type": "registry:ui", "title": null, "description": null }, { "name": "orbit-card-stack", "type": "registry:ui", "title": null, "description": null }, { "name": "particle-galaxy", "type": "registry:ui", "title": null, "description": null }, { "name": "pixel-canvas", "type": "registry:ui", "title": null, "description": null }, { "name": "pulsating-button", "type": "registry:ui", "title": null, "description": null }, { "name": "ripple-transition", "type": "registry:ui", "title": null, "description": null }, { "name": "scroll-based-velocity", "type": "registry:ui", "title": null, "description": null }, { "name": "scroll-choreography", "type": "registry:ui", "title": null, "description": null }, { "name": "scroll-split-card", "type": "registry:ui", "title": null, "description": null }, { "name": "scrub-input", "type": "registry:ui", "title": null, "description": null }, { "name": "shimmer-button", "type": "registry:ui", "title": null, "description": null }, { "name": "showcase-card", "type": "registry:ui", "title": null, "description": null }, { "name": "signature", "type": "registry:ui", "title": null, "description": null }, { "name": "silk-aurora", "type": "registry:ui", "title": null, "description": null }, { "name": "split-flap-display", "type": "registry:ui", "title": null, "description": null }, { "name": "spotlight-card", "type": "registry:ui", "title": null, "description": null }, { "name": "sticky-scroll-cards", "type": "registry:ui", "title": null, "description": null }, { "name": "testimonial-marquee", "type": "registry:ui", "title": null, "description": null }, { "name": "text-animate", "type": "registry:ui", "title": null, "description": null }, { "name": "text-repel", "type": "registry:ui", "title": null, "description": null }, { "name": "webgl-liquid", "type": "registry:ui", "title": null, "description": null }, { "name": "gradient-hero-01", "type": "registry:block", "title": null, "description": null } ], "component_count": 52, "components_truncated": false, "component_types": { "registry:ui": 51, "registry:block": 1 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 41, "name": "@contentbit", "category": "Uncategorized", "tags": [], "tagline": "React components that render Content Blocks: plain Markdown with schema-validated directive blocks. Built for content written by humans, CMSes, and LLMs.", "short_description": "", "description": "React components that render Content Blocks: plain Markdown with schema-validated directive blocks. Built for content written by humans, CMSes, and LLMs.", "homepage": "https://contentbit.dev", "docs": "https://contentbit.dev/docs/", "github": "https://github.com/agonist/contentbit", "components_github": "https://github.com/agonist/contentbit/tree/main/registry", "github_default_branch": "main", "github_stars": 11, "last_commit": "2026-07-07T17:42:07Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://contentbit.dev/r/{name}.json", "registry_index": "https://contentbit.dev/r/registry.json", "components": [ "content-renderer", "callout", "steps", "key-metrics", "quick-ref", "comparison", "pros-cons", "tabs", "faq", "generic-pack", "astro-content-renderer", "astro-callout", "astro-steps", "astro-key-metrics", "astro-quick-ref", "astro-comparison", "astro-pros-cons", "astro-tabs", "astro-faq", "astro-pack" ], "component_items": [ { "name": "content-renderer", "type": "registry:component", "title": "Content Renderer", "description": "Renders a validated Content Blocks document with the styled component pack." }, { "name": "callout", "type": "registry:component", "title": "Callout Block", "description": "Note, tip, warning, important, and TLDR callouts." }, { "name": "steps", "type": "registry:component", "title": "Steps Block", "description": "Numbered process steps." }, { "name": "key-metrics", "type": "registry:component", "title": "Key Metrics Block", "description": "Stat cards for scannable numbers." }, { "name": "quick-ref", "type": "registry:component", "title": "Quick Reference Block", "description": "Compact key/value reference card." }, { "name": "comparison", "type": "registry:component", "title": "Comparison Block", "description": "Two-option comparison table." }, { "name": "pros-cons", "type": "registry:component", "title": "Pros & Cons Block", "description": "Paired advantages and disadvantages." }, { "name": "tabs", "type": "registry:component", "title": "Tabs Block", "description": "Tabbed switcher for alternative methods." }, { "name": "faq", "type": "registry:component", "title": "FAQ Block", "description": "Accordion of question/answer pairs." }, { "name": "generic-pack", "type": "registry:block", "title": "Generic Pack", "description": "All Content Blocks components plus the renderer." }, { "name": "astro-content-renderer", "type": "registry:component", "title": "Content Renderer (Astro)", "description": "Renders a validated Content Blocks document with the styled component pack." }, { "name": "astro-callout", "type": "registry:component", "title": "Callout Block (Astro)", "description": "Note, tip, warning, important, and TLDR callouts." }, { "name": "astro-steps", "type": "registry:component", "title": "Steps Block (Astro)", "description": "Numbered process steps." }, { "name": "astro-key-metrics", "type": "registry:component", "title": "Key Metrics Block (Astro)", "description": "Stat cards for scannable numbers." }, { "name": "astro-quick-ref", "type": "registry:component", "title": "Quick Reference Block (Astro)", "description": "Compact key/value reference card." }, { "name": "astro-comparison", "type": "registry:component", "title": "Comparison Block (Astro)", "description": "Two-option comparison table." }, { "name": "astro-pros-cons", "type": "registry:component", "title": "Pros & Cons Block (Astro)", "description": "Paired advantages and disadvantages." }, { "name": "astro-tabs", "type": "registry:component", "title": "Tabs Block (Astro)", "description": "Tabbed switcher for alternative methods." }, { "name": "astro-faq", "type": "registry:component", "title": "FAQ Block (Astro)", "description": "Accordion of question/answer pairs." }, { "name": "astro-pack", "type": "registry:block", "title": "Astro Generic Pack", "description": "The full styled Astro pack: all 8 generic blocks plus the content renderer." } ], "component_count": 20, "components_truncated": false, "component_types": { "registry:component": 18, "registry:block": 2 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 36, "name": "@corr", "category": "Personal/portfolio registry", "tags": [ "dashboard", "aesthetic" ], "tagline": "A collection of shadcn-based React components, charts, animated components, and blocks built over time.", "short_description": "A collection of shadcn-based React components, charts, animated components, and blocks built over time.", "description": "A personal shadcn-based registry by lcorrigan704 containing React components, charts, animated elements, and blocks accumulated over time. Built as a shared scratch-pad for reusable patterns; component list is modest and evolving. Stack is standard shadcn/ui + Tailwind CSS. Free and open source. Use for: referencing a small personal design-system's implementation patterns rather than as a comprehensive production library.", "homepage": "https://ui.corr.sh", "docs": "https://ui.corr.sh", "github": "https://github.com/lcorrigan704/ui", "components_github": null, "github_default_branch": "main", "github_stars": 0, "last_commit": "2026-05-16T17:37:05Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://ui.corr.sh/r/{name}.json", "registry_index": "https://ui.corr.sh/r/registry.json", "components": [ "accordion-list", "animated-buttons", "animated-copy-button", "animated-dialog", "animated-disclosure", "animated-list", "animated-number", "animated-progress", "animated-spinner", "animated-toggle-card", "area-chart", "audit-log", "availability", "bar-chart", "carousel", "chart-empty-loading-error", "code-block", "command-palette", "component-health-panel", "composed-chart", "data-table", "date-picker-field", "destructive-gate", "action-dialog", "action-drawer", "empty-state", "file-manager", "file-upload-dropzone", "filters", "form-builder", "kanban", "key-value-list", "line-chart", "mailbox", "metric-badge", "metric-chart-card", "notice-alert", "pie-chart", "presence-fade", "preview-data-provider", "preview-link", "profile-avatar", "project-card-carousel", "radar-chart", "radial-chart", "registry-install-card", "responsive-preview-shell", "sankey-chart", "screen-size-guard", "scroll-blur", "section-tabs", "settings-page", "shimmer-skeleton", "status-page", "status-pill", "stepper", "timeline", "toast-action", "typography-effects" ], "component_items": [ { "name": "accordion-list", "type": "registry:component", "title": "Accordion List", "description": "A clean accordion list wrapper for FAQs, settings, and dense help content." }, { "name": "animated-buttons", "type": "registry:component", "title": "Animated Buttons", "description": "Animated action buttons that transition through hover, loading, and complete states." }, { "name": "animated-copy-button", "type": "registry:component", "title": "Animated Copy Button", "description": "A copy button that animates between idle and copied states." }, { "name": "animated-dialog", "type": "registry:component", "title": "Animated Dialog", "description": "A dialog wrapper with subtle Motion transitions for confirmation and form flows." }, { "name": "animated-disclosure", "type": "registry:component", "title": "Animated Disclosure", "description": "An expandable disclosure panel with vertical and horizontal motion directions." }, { "name": "animated-list", "type": "registry:component", "title": "Animated List", "description": "A generic list wrapper with Motion entry, exit, and reorder transitions." }, { "name": "animated-number", "type": "registry:component", "title": "Animated Number", "description": "A NumberFlow-powered animated number primitive for counters, timers, and metrics." }, { "name": "animated-progress", "type": "registry:component", "title": "Animated Progress", "description": "A smooth progress bar with determinate, semantic, and pending states." }, { "name": "animated-spinner", "type": "registry:component", "title": "Animated Spinner", "description": "A restrained Motion-powered spinner for buttons, cards, and async loading states." }, { "name": "animated-toggle-card", "type": "registry:component", "title": "Animated Toggle Card", "description": "Selectable cards with a shared animated active state." }, { "name": "area-chart", "type": "registry:component", "title": "Area Chart", "description": "A styled EvilCharts area chart for showing trends with filled ranges, gradients, brushes, and selection states." }, { "name": "audit-log", "type": "registry:block", "title": "Audit Log", "description": "A timestamped activity log block for registry and product events." }, { "name": "availability", "type": "registry:component", "title": "Availability", "description": "A draggable weekly availability scheduler for creating, resizing, moving, disabling, and deleting time spans." }, { "name": "bar-chart", "type": "registry:component", "title": "Bar Chart", "description": "A styled EvilCharts bar chart for comparing categories with stacked, gradient, hatched, and horizontal variants." }, { "name": "carousel", "type": "registry:component", "title": "Carousel", "description": "A center-snapping carousel primitive with responsive edge blur and button controls." }, { "name": "chart-empty-loading-error", "type": "registry:component", "title": "Chart Empty Loading Error", "description": "A standardized chart state frame for ready, loading, empty, and error states." }, { "name": "code-block", "type": "registry:component", "title": "Code Block", "description": "A copyable code block with line numbers, language selection, and lightweight language-aware syntax highlighting." }, { "name": "command-palette", "type": "registry:component", "title": "Command Palette", "description": "A reusable command dialog wrapper for grouped actions, app navigation, and searchable command menus." }, { "name": "component-health-panel", "type": "registry:component", "title": "Component Health Panel", "description": "A registry health panel for dependencies, source files, JSON URLs, and install commands." }, { "name": "composed-chart", "type": "registry:component", "title": "Composed Chart", "description": "A styled EvilCharts composed chart for mixing bars and lines in a single operational view." }, { "name": "data-table", "type": "registry:component", "title": "Data Table", "description": "A generic data table with search, sorting, row selection, CSV export, pagination, row actions, and destructive action confirmation." }, { "name": "date-picker-field", "type": "registry:component", "title": "Date Picker Field", "description": "A date picker field with local-safe date normalization and optional ISO date string output." }, { "name": "destructive-gate", "type": "registry:component", "title": "Destructive Gate", "description": "A dialog and mobile drawer confirmation that gates destructive actions behind a generated three-word phrase." }, { "name": "action-dialog", "type": "registry:component", "title": "Dialog", "description": "A compact dialog wrapper for focused confirmation and form actions." }, { "name": "action-drawer", "type": "registry:component", "title": "Drawer", "description": "A mobile-friendly drawer wrapper with title, description, content, and footer actions." }, { "name": "empty-state", "type": "registry:component", "title": "Empty State", "description": "A small empty-state wrapper around the shadcn empty primitive with action slots and visual variants." }, { "name": "file-manager", "type": "registry:block", "title": "File Manager", "description": "A file manager block with upload, list/grid layout, and item actions." }, { "name": "file-upload-dropzone", "type": "registry:component", "title": "File Upload Dropzone", "description": "A controlled drag-and-drop file upload field with selected file rows." }, { "name": "filters", "type": "registry:component", "title": "Filters", "description": "A composable filter builder with searchable fields, operators, select and multiselect values, text validation, keyboard shortcuts, and i18n labels." }, { "name": "form-builder", "type": "registry:block", "title": "Form Builder", "description": "A reusable form builder block with drag-and-drop fields, JSON definitions, previews, and keyed response data." }, { "name": "kanban", "type": "registry:component", "title": "Kanban", "description": "A composable drag-and-drop kanban board with sortable columns, sortable cards, handles, overlays, and move callbacks." }, { "name": "key-value-list", "type": "registry:component", "title": "Key Value List", "description": "A small definition-list component for metadata and registry payload details." }, { "name": "line-chart", "type": "registry:component", "title": "Line Chart", "description": "A styled EvilCharts line chart for tracking change over time with dots, glow states, brushes, and buffer lines." }, { "name": "mailbox", "type": "registry:block", "title": "Mailbox", "description": "A responsive mailbox block with folders, message lists, compose flow, confirmations, and toast feedback." }, { "name": "metric-badge", "type": "registry:component", "title": "Metric Badge", "description": "A small badge for counts, states, and operational tags with semantic tones." }, { "name": "metric-chart-card", "type": "registry:component", "title": "Metric Chart Card", "description": "A compact metric card with animated numbers, deltas, and a small line, bar, or area chart." }, { "name": "notice-alert", "type": "registry:component", "title": "Notice Alert", "description": "A restrained alert wrapper with info, success, warning, and destructive tones." }, { "name": "pie-chart", "type": "registry:component", "title": "Pie Chart", "description": "A styled EvilCharts pie chart for showing parts of a whole with labels, legends, and donut variants." }, { "name": "presence-fade", "type": "registry:component", "title": "Presence Fade", "description": "A tiny mount and unmount wrapper for fade, scale, and slide transitions." }, { "name": "preview-data-provider", "type": "registry:component", "title": "Preview Data Provider", "description": "A shared mock data provider for consistent registry demos and examples." }, { "name": "preview-link", "type": "registry:component", "title": "Preview Link", "description": "A link wrapper that shows a static page preview card on hover." }, { "name": "profile-avatar", "type": "registry:component", "title": "Profile Avatar", "description": "An animated profile avatar preview that morphs from the trigger into a focused overlay." }, { "name": "project-card-carousel", "type": "registry:block", "title": "Project Card Carousel", "description": "A responsive project carousel block with preview cards, edge blur, controls, stack badges, and contact-link handling." }, { "name": "radar-chart", "type": "registry:component", "title": "Radar Chart", "description": "A styled EvilCharts radar chart for comparing multi-metric profiles across radial axes." }, { "name": "radial-chart", "type": "registry:component", "title": "Radial Chart", "description": "A styled EvilCharts radial chart for circular totals, progress groups, and semi-radial layouts." }, { "name": "registry-install-card", "type": "registry:component", "title": "Registry Install Card", "description": "A registry install surface with copy actions, JSON links, and compact usage metrics." }, { "name": "responsive-preview-shell", "type": "registry:component", "title": "Responsive Preview Shell", "description": "A responsive preview utility with viewport controls and a smooth carousel with soft blurred edges." }, { "name": "sankey-chart", "type": "registry:component", "title": "Sankey Chart", "description": "A styled EvilCharts sankey chart for weighted flows between stages." }, { "name": "screen-size-guard", "type": "registry:component", "title": "Screen Size Guard", "description": "A responsive fallback wrapper for components that are not ready for smaller screens yet." }, { "name": "scroll-blur", "type": "registry:component", "title": "Scroll Blur", "description": "A scroll utility with top, bottom, left, and right edge blurs plus optional snap-item helpers." }, { "name": "section-tabs", "type": "registry:component", "title": "Section Tabs", "description": "A compact tabs wrapper for switching between related panels." }, { "name": "settings-page", "type": "registry:block", "title": "Settings Page", "description": "A responsive settings page block with profile, notification, and security sections." }, { "name": "shimmer-skeleton", "type": "registry:component", "title": "Shimmer Skeleton", "description": "A subtle shimmer skeleton for loading cards, lists, and table rows." }, { "name": "status-page", "type": "registry:block", "title": "Status Page", "description": "A status page block with uptime metrics, GitHub-style day bars, service filtering, and incident history." }, { "name": "status-pill", "type": "registry:component", "title": "Status Pill", "description": "A compact status badge with semantic color, icon, and label variants for operational interfaces." }, { "name": "stepper", "type": "registry:component", "title": "Stepper", "description": "A compact horizontal or vertical stepper for install, publish, and form flows." }, { "name": "timeline", "type": "registry:component", "title": "Timeline", "description": "A composable horizontal timeline with draggable slots, rows, drop validation, current-time markers, and custom slot rendering." }, { "name": "toast-action", "type": "registry:component", "title": "Toast Action", "description": "A simple sonner toast trigger with title, description, and undo action." }, { "name": "typography-effects", "type": "registry:component", "title": "Typography Effects", "description": "Motion typography utilities for shimmer text, cycling loading messages, and lyric-style active word emphasis." } ], "component_count": 59, "components_truncated": false, "component_types": { "registry:component": 52, "registry:block": 7 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 37, "name": "@coss", "category": "Design system", "tags": [ "ai", "components" ], "tagline": "A new, modern UI component library built on top of Base UI. Built for developers and AI.", "short_description": "A new, modern UI component library built on top of Base UI. Built for developers and AI.", "description": "The official Cal.com design system, formerly known as Origin UI, now under coss.com/ui. A modern, TypeScript-first component library built on Base UI (not Radix UI), designed for developers and AI-assisted tooling. Covers standard UI primitives with Cal.com's visual language — clean, minimal, developer-focused. Monorepo includes apps/origin legacy components. Free and open source. Use for: adopting the Cal.com design system's Base UI primitives when you want an alternative to Radix-based shadcn with a battle-tested real-world design system behind it.", "homepage": "https://coss.com/ui", "docs": "https://coss.com/ui/docs", "github": "https://github.com/cosscom/coss", "components_github": null, "github_default_branch": "main", "github_stars": 10204, "last_commit": "2026-07-08T06:11:41Z", "archived": false, "license": "AGPL-3.0", "open_issues": 14, "registry_template": "https://coss.com/ui/r/{name}.json", "registry_index": "https://coss.com/ui/r/registry.json", "components": [ "ui", "accordion", "alert", "alert-dialog", "autocomplete", "avatar", "badge", "breadcrumb", "button", "calendar", "card", "checkbox", "checkbox-group", "collapsible", "combobox", "command", "context-menu", "dialog", "drawer", "empty", "field", "fieldset", "form", "frame", "group", "input", "otp-field", "input-group", "kbd", "label", "menu", "meter", "number-field", "pagination", "popover", "preview-card", "progress", "radio-group", "scroll-area", "select", "separator", "sheet", "sidebar", "skeleton", "slider", "spinner", "switch", "table", "tabs", "textarea", "toast", "toggle", "toggle-group", "toolbar", "tooltip", "p-accordion-1", "p-accordion-2", "p-accordion-3", "p-accordion-4", "p-alert-1", "p-alert-2", "p-alert-3", "p-alert-4", "p-alert-5", "p-alert-6", "p-alert-7", "p-alert-dialog-1", "p-alert-dialog-2", "p-autocomplete-1", "p-autocomplete-2", "p-autocomplete-3", "p-autocomplete-4", "p-autocomplete-5", "p-autocomplete-6", "p-autocomplete-7", "p-autocomplete-8", "p-autocomplete-9", "p-autocomplete-10", "p-autocomplete-11", "p-autocomplete-12", "p-autocomplete-13", "p-autocomplete-14", "p-autocomplete-15", "p-avatar-1", "p-avatar-2", "p-avatar-3", "p-avatar-4", "p-avatar-5", "p-avatar-6", "p-avatar-7", "p-avatar-8", "p-avatar-9", "p-avatar-10", "p-avatar-11", "p-avatar-12", "p-avatar-13", "p-avatar-14", "p-badge-1", "p-badge-2", "p-badge-3" ], "component_items": [ { "name": "ui", "type": "registry:ui", "title": null, "description": null }, { "name": "accordion", "type": "registry:ui", "title": null, "description": null }, { "name": "alert", "type": "registry:ui", "title": null, "description": null }, { "name": "alert-dialog", "type": "registry:ui", "title": null, "description": null }, { "name": "autocomplete", "type": "registry:ui", "title": null, "description": null }, { "name": "avatar", "type": "registry:ui", "title": null, "description": null }, { "name": "badge", "type": "registry:ui", "title": null, "description": null }, { "name": "breadcrumb", "type": "registry:ui", "title": null, "description": null }, { "name": "button", "type": "registry:ui", "title": null, "description": null }, { "name": "calendar", "type": "registry:ui", "title": null, "description": null }, { "name": "card", "type": "registry:ui", "title": null, "description": null }, { "name": "checkbox", "type": "registry:ui", "title": null, "description": null }, { "name": "checkbox-group", "type": "registry:ui", "title": null, "description": null }, { "name": "collapsible", "type": "registry:ui", "title": null, "description": null }, { "name": "combobox", "type": "registry:ui", "title": null, "description": null }, { "name": "command", "type": "registry:ui", "title": null, "description": null }, { "name": "context-menu", "type": "registry:ui", "title": null, "description": null }, { "name": "dialog", "type": "registry:ui", "title": null, "description": null }, { "name": "drawer", "type": "registry:ui", "title": null, "description": null }, { "name": "empty", "type": "registry:ui", "title": null, "description": null }, { "name": "field", "type": "registry:ui", "title": null, "description": null }, { "name": "fieldset", "type": "registry:ui", "title": null, "description": null }, { "name": "form", "type": "registry:ui", "title": null, "description": null }, { "name": "frame", "type": "registry:ui", "title": null, "description": null }, { "name": "group", "type": "registry:ui", "title": null, "description": null }, { "name": "input", "type": "registry:ui", "title": null, "description": null }, { "name": "otp-field", "type": "registry:ui", "title": null, "description": null }, { "name": "input-group", "type": "registry:ui", "title": null, "description": null }, { "name": "kbd", "type": "registry:ui", "title": null, "description": null }, { "name": "label", "type": "registry:ui", "title": null, "description": null }, { "name": "menu", "type": "registry:ui", "title": null, "description": null }, { "name": "meter", "type": "registry:ui", "title": null, "description": null }, { "name": "number-field", "type": "registry:ui", "title": null, "description": null }, { "name": "pagination", "type": "registry:ui", "title": null, "description": null }, { "name": "popover", "type": "registry:ui", "title": null, "description": null }, { "name": "preview-card", "type": "registry:ui", "title": null, "description": null }, { "name": "progress", "type": "registry:ui", "title": null, "description": null }, { "name": "radio-group", "type": "registry:ui", "title": null, "description": null }, { "name": "scroll-area", "type": "registry:ui", "title": null, "description": null }, { "name": "select", "type": "registry:ui", "title": null, "description": null }, { "name": "separator", "type": "registry:ui", "title": null, "description": null }, { "name": "sheet", "type": "registry:ui", "title": null, "description": null }, { "name": "sidebar", "type": "registry:ui", "title": null, "description": null }, { "name": "skeleton", "type": "registry:ui", "title": null, "description": null }, { "name": "slider", "type": "registry:ui", "title": null, "description": null }, { "name": "spinner", "type": "registry:ui", "title": null, "description": null }, { "name": "switch", "type": "registry:ui", "title": null, "description": null }, { "name": "table", "type": "registry:ui", "title": null, "description": null }, { "name": "tabs", "type": "registry:ui", "title": null, "description": null }, { "name": "textarea", "type": "registry:ui", "title": null, "description": null }, { "name": "toast", "type": "registry:ui", "title": null, "description": null }, { "name": "toggle", "type": "registry:ui", "title": null, "description": null }, { "name": "toggle-group", "type": "registry:ui", "title": null, "description": null }, { "name": "toolbar", "type": "registry:ui", "title": null, "description": null }, { "name": "tooltip", "type": "registry:ui", "title": null, "description": null }, { "name": "p-accordion-1", "type": "registry:block", "title": null, "description": "Basic accordion" }, { "name": "p-accordion-2", "type": "registry:block", "title": null, "description": "Accordion with one panel open" }, { "name": "p-accordion-3", "type": "registry:block", "title": null, "description": "Accordion allowing multiple panels open" }, { "name": "p-accordion-4", "type": "registry:block", "title": null, "description": "Controlled accordion" }, { "name": "p-alert-1", "type": "registry:block", "title": null, "description": "Basic alert" } ], "component_count": 560, "components_truncated": true, "component_types": { "registry:ui": 56, "registry:block": 492, "registry:style": 2, "registry:font": 3, "registry:lib": 5, "registry:hook": 2 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 38, "name": "@creative-tim", "category": "Component library (general)", "tags": [ "ai", "aesthetic", "components" ], "tagline": "A collection of open-source UI components, blocks and AI Agents. Integrate them in v0, Lovable, Claude or in your application.", "short_description": "A collection of open-source UI components, blocks and AI Agents. Integrate them in v0, Lovable, Claude or in your application.", "description": "Component library from Creative Tim built on top of shadcn/ui, providing pre-built React components and blocks organized into Application UI (modals, account settings, etc.) and additional marketing sections. Installable via a dedicated CLI or the standard shadcn CLI. Includes an AI Agents section with v0/Lovable/Claude integration guidance. Free to use; Creative Tim's broader ecosystem includes paid premium products. Use for: teams already familiar with Creative Tim's design aesthetic who want shadcn-compatible components with AI-workflow integration.", "homepage": "https://www.creative-tim.com/ui", "docs": "https://www.creative-tim.com/ui/docs", "github": "https://github.com/creativetimofficial/ui", "components_github": null, "github_default_branch": "main", "github_stars": 11946, "last_commit": "2026-03-14T20:41:18Z", "archived": false, "license": "MIT", "open_issues": 19, "registry_template": "https://www.creative-tim.com/ui/r/{name}.json", "registry_index": null, "components": [], "component_items": [], "component_count": null, "components_truncated": false, "component_types": {}, "has_logo": true, "enrichment_errors": [ "registry_index_unresolved" ], "featured": true }, { "number": 45, "name": "@cubby-ui", "category": "Uncategorized", "tags": [], "tagline": "An opinionated component library with curated styling and simplified patterns for common use cases. Built on Base UI and Tailwind CSS 4.", "short_description": "", "description": "An opinionated component library with curated styling and simplified patterns for common use cases. Built on Base UI and Tailwind CSS 4.", "homepage": "https://www.cubby-ui.dev", "docs": "https://www.cubby-ui.dev/docs/components/button", "github": "https://github.com/joncoronel/cubby-ui", "components_github": "https://github.com/joncoronel/cubby-ui/tree/main/registry", "github_default_branch": "main", "github_stars": 29, "last_commit": "2026-07-05T23:27:26Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://www.cubby-ui.dev/r/{name}.json", "registry_index": "https://www.cubby-ui.dev/r/registry.json", "components": [ "accordion", "alert", "alert-dialog", "all", "aspect-ratio", "autocomplete", "avatar", "badge", "base-drawer", "breadcrumbs", "button", "button-group", "calendar", "card", "carousel", "checkbox", "checkbox-group", "circular-slider", "code-block", "collapsible", "combobox", "command", "context-menu", "copy-button", "cropper", "data-table", "date-picker", "date-range-picker", "dialog", "drawer", "dropdown-menu", "elevated", "fancy-button", "field", "fieldset", "filters", "form", "highlight-text", "input", "input-group", "input-otp", "kbd", "label", "marching-border", "menubar", "meter", "navigation-menu", "number-field", "otp-field", "pagination", "popover", "preview-card", "progress", "qr-code", "radio-group", "resizable", "scroll-area", "scroll-fade", "select", "separator", "sheet", "shimmer", "skeleton", "slider", "style", "switch", "table", "tabs", "textarea", "timeline", "toast", "toggle", "toggle-group", "toolbar", "tooltip", "transition-panel", "tree", "use-animated-height", "use-controllable-state", "use-fuzzy-filter", "use-list-virtualizer" ], "component_items": [ { "name": "accordion", "type": "registry:ui", "title": "Accordion", "description": "A accordion component." }, { "name": "alert", "type": "registry:ui", "title": "Alert", "description": "A alert component." }, { "name": "alert-dialog", "type": "registry:ui", "title": "Alert-dialog", "description": "A alert-dialog component." }, { "name": "all", "type": "registry:block", "title": "All Components", "description": "Install all Cubby UI components with a single command." }, { "name": "aspect-ratio", "type": "registry:ui", "title": "Aspect-ratio", "description": "A aspect-ratio component." }, { "name": "autocomplete", "type": "registry:ui", "title": "Autocomplete", "description": "A autocomplete component." }, { "name": "avatar", "type": "registry:ui", "title": "Avatar", "description": "A avatar component." }, { "name": "badge", "type": "registry:ui", "title": "Badge", "description": "A badge component." }, { "name": "base-drawer", "type": "registry:ui", "title": "Base Drawer", "description": "A base-drawer component." }, { "name": "breadcrumbs", "type": "registry:ui", "title": "Breadcrumbs", "description": "A breadcrumbs component." }, { "name": "button", "type": "registry:ui", "title": "Button", "description": "A simple button component." }, { "name": "button-group", "type": "registry:ui", "title": "Button Group", "description": "A button-group component." }, { "name": "calendar", "type": "registry:ui", "title": "Calendar", "description": "A calendar component." }, { "name": "card", "type": "registry:ui", "title": "Card", "description": "A card component." }, { "name": "carousel", "type": "registry:ui", "title": "Carousel", "description": "A carousel component." }, { "name": "checkbox", "type": "registry:ui", "title": "Checkbox", "description": "A checkbox component." }, { "name": "checkbox-group", "type": "registry:ui", "title": "Checkbox-group", "description": "A checkbox-group component." }, { "name": "circular-slider", "type": "registry:ui", "title": "Circular Slider", "description": "A circular-slider component." }, { "name": "code-block", "type": "registry:ui", "title": "Code-block", "description": "A code-block component." }, { "name": "collapsible", "type": "registry:ui", "title": "Collapsible", "description": "A collapsible component." }, { "name": "combobox", "type": "registry:ui", "title": "Combobox", "description": "A combobox component." }, { "name": "command", "type": "registry:ui", "title": "Command", "description": "A command component." }, { "name": "context-menu", "type": "registry:ui", "title": "Context-menu", "description": "A context-menu component." }, { "name": "copy-button", "type": "registry:ui", "title": "Copy Button", "description": "A copy-button component." }, { "name": "cropper", "type": "registry:ui", "title": "Cropper", "description": "A cropper component." }, { "name": "data-table", "type": "registry:ui", "title": "Data Table", "description": "A data-table component." }, { "name": "date-picker", "type": "registry:ui", "title": "Date-picker", "description": "A date-picker component." }, { "name": "date-range-picker", "type": "registry:ui", "title": "Date-range-picker", "description": "A date-range-picker component." }, { "name": "dialog", "type": "registry:ui", "title": "Dialog", "description": "A dialog component." }, { "name": "drawer", "type": "registry:ui", "title": "Drawer", "description": "A drawer component." }, { "name": "dropdown-menu", "type": "registry:ui", "title": "Dropdown-menu", "description": "A dropdown-menu component." }, { "name": "elevated", "type": "registry:lib", "title": "elevated", "description": "A utility function for elevated." }, { "name": "fancy-button", "type": "registry:ui", "title": "Fancy Button", "description": "A fancy-button component." }, { "name": "field", "type": "registry:ui", "title": "Field", "description": "A field component." }, { "name": "fieldset", "type": "registry:ui", "title": "Fieldset", "description": "A fieldset component." }, { "name": "filters", "type": "registry:ui", "title": "Filters", "description": "A filter bar of segmented pills with per-field operators and value controls." }, { "name": "form", "type": "registry:ui", "title": "Form", "description": "A form component." }, { "name": "highlight-text", "type": "registry:lib", "title": "highlightText", "description": "A utility function for highlight text." }, { "name": "input", "type": "registry:ui", "title": "Input", "description": "A input component." }, { "name": "input-group", "type": "registry:ui", "title": "Input Group", "description": "A input-group component." }, { "name": "input-otp", "type": "registry:ui", "title": "Input-otp", "description": "A input-otp component." }, { "name": "kbd", "type": "registry:ui", "title": "Kbd", "description": "A kbd component." }, { "name": "label", "type": "registry:ui", "title": "Label", "description": "A label component." }, { "name": "marching-border", "type": "registry:ui", "title": "Marching Border", "description": "A marching-border component." }, { "name": "menubar", "type": "registry:ui", "title": "Menubar", "description": "A menubar component." }, { "name": "meter", "type": "registry:ui", "title": "Meter", "description": "A meter component." }, { "name": "navigation-menu", "type": "registry:ui", "title": "Navigation-menu", "description": "A navigation-menu component." }, { "name": "number-field", "type": "registry:ui", "title": "Number Field", "description": "A number-field component." }, { "name": "otp-field", "type": "registry:ui", "title": "Otp Field", "description": "A otp-field component." }, { "name": "pagination", "type": "registry:ui", "title": "Pagination", "description": "A pagination component." }, { "name": "popover", "type": "registry:ui", "title": "Popover", "description": "A popover component." }, { "name": "preview-card", "type": "registry:ui", "title": "Preview-card", "description": "A preview-card component." }, { "name": "progress", "type": "registry:ui", "title": "Progress", "description": "A progress component." }, { "name": "qr-code", "type": "registry:ui", "title": "QR Code", "description": "A from-scratch, zero-dependency QR code generator rendered as pure scalable SVG." }, { "name": "radio-group", "type": "registry:ui", "title": "Radio-group", "description": "A radio-group component." }, { "name": "resizable", "type": "registry:ui", "title": "Resizable", "description": "A resizable component." }, { "name": "scroll-area", "type": "registry:ui", "title": "Scroll-area", "description": "A scroll-area component." }, { "name": "scroll-fade", "type": "registry:component", "title": "Scroll Fade", "description": "A CSS utility that fades the edges of any scroll container as you scroll, with no component required." }, { "name": "select", "type": "registry:ui", "title": "Select", "description": "A select component." }, { "name": "separator", "type": "registry:ui", "title": "Separator", "description": "A separator component." } ], "component_count": 81, "components_truncated": false, "component_types": { "registry:ui": 71, "registry:block": 1, "registry:lib": 2, "registry:component": 2, "registry:style": 1, "registry:hook": 4 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 39, "name": "@cult-ui", "category": "Animated components", "tags": [ "ai", "aesthetic" ], "tagline": "Cult UI is a rare, curated set of shadcn-compatible, headless and composable components—tastefully animated with Framer Motion.", "short_description": "Cult UI is a rare, curated set of shadcn-compatible, headless and composable components—tastefully animated with Framer Motion.", "description": "A curated, shadcn-compatible open-source library with 60+ tastefully animated components (direction-aware tabs, dynamic island, family button/drawer, dock, distorted glass, dither effects, canvas fractal grid, color picker, code block, lightboard, and more) and 92+ full-stack AI agent UI patterns covering streaming chat, evaluator-optimizer, orchestrator, and routing patterns. Framer Motion-driven animations. Also offers Cult Pro (premium blocks) and 6 starter templates (Next.js + Supabase/Better Auth/Stripe). Free core; freemium for Pro/templates. Use for: adding carefully crafted animated primitives or full AI-chat UI patterns to a Next.js project.", "homepage": "https://www.cult-ui.com", "docs": "https://www.cult-ui.com/docs", "github": "https://github.com/nolly-studio/cult-ui", "components_github": null, "github_default_branch": "main", "github_stars": 5776, "last_commit": "2026-05-21T19:16:22Z", "archived": false, "license": "MIT", "open_issues": 16, "registry_template": "https://cult-ui.com/r/{name}.json", "registry_index": "https://cult-ui.com/r/registry.json", "components": [ "text-animate", "cosmic-button", "texture-button", "texture-card", "timer", "shift-card", "minimal-card", "cutout-card", "dynamic-island", "direction-aware-tabs", "bg-animate-button", "border-beam-button", "family-button", "side-panel", "bg-media", "three-d-carousel", "tweet-grid", "gradient-heading", "typewriter", "animated-number", "sortable-list", "dock", "lightboard", "canvas-fractal-grid", "bg-animated-fractal-dot-grid", "bg-animated-gradient", "bg-image-texture", "popover", "floating-panel", "color-picker", "shader-lens-blur", "edge-blur", "dither-image", "popover-form", "expandable", "logo-carousel", "loading-carousel", "hover-video-player", "neumorph-eyebrow", "neumorph-button", "feature-carousel", "choice-poll", "feature-poll", "feature-voting", "vote-tally", "poll-widget", "prompt-library", "ai-instructions", "intro-disclosure", "text-gif", "stripe-bg-guides", "svg-shapes", "svg-shapes-animated", "svg-bands", "grid-beam", "youtube-video-player", "toolbar-expandable", "texture-overlay", "squiggle-arrow", "code-block", "mock-browser-window", "metal-button", "morph-surface", "distorted-glass", "family-drawer", "expandable-screen", "pixel-heading-character", "pixel-heading-word", "pixel-paragraph-words-inverse", "pixel-paragraph-words", "onboarding", "gradient-button-group", "terminal-animation", "hero-dithering", "hero-color-panel", "hero-static-radial-gradient", "hero-heatmap", "hero-liquid-metal", "text-animate-demo", "cosmic-button-demo", "texture-button-demo", "texture-card-demo", "timer-demo", "shift-card-demo", "minimal-card-demo", "cutout-card-demo", "dynamic-island-demo", "direction-aware-tabs-demo", "bg-animate-button-demo", "border-beam-button-demo", "family-button-demo", "side-panel-demo", "bg-media-demo", "bg-image-texture-demo", "three-d-carousel-demo", "tweet-grid-demo", "gradient-heading-demo", "typewriter-demo", "animated-number-demo", "sortable-list-demo" ], "component_items": [ { "name": "text-animate", "type": "registry:ui", "title": null, "description": "Animated text component with customizable reveal effects and timing" }, { "name": "cosmic-button", "type": "registry:ui", "title": null, "description": "Animated button/link with cosmic gradient border effect, renders as anchor or button" }, { "name": "texture-button", "type": "registry:ui", "title": null, "description": "Button component with texture overlay effects and customizable variants" }, { "name": "texture-card", "type": "registry:ui", "title": null, "description": "Card component with texture background and customizable styling options" }, { "name": "timer", "type": "registry:ui", "title": null, "description": "Countdown timer component with customizable duration and visual styles" }, { "name": "shift-card", "type": "registry:ui", "title": null, "description": "Card component with shift animation effects and hover interactions" }, { "name": "minimal-card", "type": "registry:ui", "title": null, "description": "Clean and minimal card component with subtle styling and hover effects" }, { "name": "cutout-card", "type": "registry:ui", "title": null, "description": "Image card with cutout corners, hover motion, inset labels, pins, and reveal actions" }, { "name": "dynamic-island", "type": "registry:ui", "title": null, "description": "iOS-style dynamic island component with expandable content and smooth animations" }, { "name": "direction-aware-tabs", "type": "registry:ui", "title": null, "description": "Tab component with direction-aware animations and smooth transitions" }, { "name": "bg-animate-button", "type": "registry:ui", "title": null, "description": "Button component with animated background effects and gradient transitions" }, { "name": "border-beam-button", "type": "registry:ui", "title": null, "description": "Shadcn Button wrapped in Border Beam: animated border glow with compact icon and text variants" }, { "name": "family-button", "type": "registry:ui", "title": null, "description": "Button component with family-style design and interactive hover effects" }, { "name": "side-panel", "type": "registry:ui", "title": null, "description": "Sliding side panel component with customizable positioning and animations" }, { "name": "bg-media", "type": "registry:ui", "title": null, "description": "Background media component with video/image support and overlay effects" }, { "name": "three-d-carousel", "type": "registry:ui", "title": null, "description": "3D carousel component with perspective effects and smooth item transitions" }, { "name": "tweet-grid", "type": "registry:ui", "title": null, "description": "Grid layout component for displaying tweet-like content cards" }, { "name": "gradient-heading", "type": "registry:ui", "title": null, "description": "Heading component with gradient text effects and customizable styling" }, { "name": "typewriter", "type": "registry:ui", "title": null, "description": "Typewriter effect component with customizable typing speed and cursor animation" }, { "name": "animated-number", "type": "registry:ui", "title": null, "description": "Number component with smooth counting animations and customizable formatting" }, { "name": "sortable-list", "type": "registry:ui", "title": null, "description": "Drag-and-drop sortable list component with smooth animations and reordering" }, { "name": "dock", "type": "registry:ui", "title": null, "description": "macOS-style dock component with hover effects and smooth animations" }, { "name": "lightboard", "type": "registry:ui", "title": null, "description": "Interactive lightboard component with customizable grid and lighting effects" }, { "name": "canvas-fractal-grid", "type": "registry:ui", "title": null, "description": "Interactive canvas-based fractal dot grid with mouse tracking and wave effects" }, { "name": "bg-animated-fractal-dot-grid", "type": "registry:ui", "title": null, "description": "Background animated fractal dot grid with performance optimization and responsive design" }, { "name": "bg-animated-gradient", "type": "registry:ui", "title": null, "description": "Animated gradient background component with customizable color transitions" }, { "name": "bg-image-texture", "type": "registry:ui", "title": null, "description": "Background texture component with multiple texture variants and customizable opacity" }, { "name": "popover", "type": "registry:ui", "title": null, "description": "Animated popover component with form support and smooth transitions" }, { "name": "floating-panel", "type": "registry:ui", "title": null, "description": "Floating panel component with backdrop blur and position-aware animations" }, { "name": "color-picker", "type": "registry:ui", "title": null, "description": "Interactive color picker component with HSL support and preset colors" }, { "name": "shader-lens-blur", "type": "registry:ui", "title": null, "description": "WebGL shader component with lens blur effects and mouse interaction" }, { "name": "edge-blur", "type": "registry:ui", "title": null, "description": "Stacked backdrop-blur layers with a gradient mask for soft top or bottom screen edges" }, { "name": "dither-image", "type": "registry:ui", "title": null, "description": "Compound Next.js image figure with CSS Bayer dither via dither-plugin, partial reveal overlays, and typed tuning props" }, { "name": "popover-form", "type": "registry:ui", "title": null, "description": "Form popover component with success states and animated transitions" }, { "name": "expandable", "type": "registry:ui", "title": null, "description": "Expandable component system with smooth animations and customizable presets" }, { "name": "logo-carousel", "type": "registry:ui", "title": null, "description": "Animated logo carousel with staggered animations and customizable columns" }, { "name": "loading-carousel", "type": "registry:ui", "title": null, "description": "Loading carousel component with smooth transitions and customizable content" }, { "name": "hover-video-player", "type": "registry:ui", "title": null, "description": "Video player component that plays on hover with smooth animations" }, { "name": "neumorph-eyebrow", "type": "registry:ui", "title": null, "description": "Neumorphic eyebrow component with soft shadow effects and modern styling" }, { "name": "neumorph-button", "type": "registry:ui", "title": null, "description": "Neumorphic button component with soft shadows and tactile interaction effects" }, { "name": "feature-carousel", "type": "registry:ui", "title": null, "description": "Feature carousel component with smooth transitions and customizable layouts" }, { "name": "choice-poll", "type": "registry:ui", "title": null, "description": "Poll component with single or multiple selection, optional results, and keyboard navigation" }, { "name": "feature-poll", "type": "registry:ui", "title": null, "description": "Feature poll component with single or multiple selection, optional results, and keyboard navigation" }, { "name": "feature-voting", "type": "registry:ui", "title": null, "description": "List of features with up-vote support, optional sorting by vote count, and controlled or uncontrolled state" }, { "name": "vote-tally", "type": "registry:ui", "title": null, "description": "List of items with up-vote support, optional sorting by vote count, and controlled or uncontrolled state" }, { "name": "poll-widget", "type": "registry:ui", "title": null, "description": "Poll widget with inline, popover, and dialog modes, optional results, and animations" }, { "name": "prompt-library", "type": "registry:ui", "title": null, "description": "Browse, insert, and manage prompt templates with categories and custom prompts" }, { "name": "ai-instructions", "type": "registry:ui", "title": null, "description": "Manage and toggle AI instructions with a popover, search, and create-dialog" }, { "name": "intro-disclosure", "type": "registry:ui", "title": null, "description": "Intro disclosure component with expandable content and smooth animations" }, { "name": "text-gif", "type": "registry:ui", "title": null, "description": "Text component with GIF-like animation effects and customizable styling" }, { "name": "stripe-bg-guides", "type": "registry:ui", "title": null, "description": "Stripe-style background guides component with animated patterns and effects" }, { "name": "svg-shapes", "type": "registry:ui", "title": null, "description": "Wide-aspect SVG shape and panel components for backgrounds and hero decorations" }, { "name": "svg-shapes-animated", "type": "registry:ui", "title": null, "description": "Scroll-triggered stroke-draw animations for wide SVG shapes and panels using Motion" }, { "name": "svg-bands", "type": "registry:ui", "title": null, "description": "Wide SVG section bands, battlement and zigzag trims, steep hero edges, and ornamental frames" }, { "name": "grid-beam", "type": "registry:ui", "title": null, "description": "Canvas grid beam animation with palette presets, SVG dividers, and composable headless pieces via useGridBeam" }, { "name": "youtube-video-player", "type": "registry:ui", "title": null, "description": "YouTube video player component with custom controls and smooth animations" }, { "name": "toolbar-expandable", "type": "registry:ui", "title": null, "description": "Expandable toolbar component with step-based navigation, smooth animations, and enhanced scrolling" }, { "name": "texture-overlay", "type": "registry:ui", "title": null, "description": "Texture overlay component with various CSS gradient patterns for adding visual texture to backgrounds" }, { "name": "squiggle-arrow", "type": "registry:ui", "title": null, "description": "A playful, hand-drawn squiggly arrow component with customizable variants, directions, and sizes" }, { "name": "code-block", "type": "registry:ui", "title": null, "description": "A beautiful code block component with tabs, copy functionality, and smooth animations" } ], "component_count": 157, "components_truncated": true, "component_types": { "registry:ui": 78, "registry:component": 79 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 40, "name": "@darx", "category": "Niche/single-purpose", "tags": [ "aesthetic" ], "tagline": "Magic 3D Tabs component featuring mouse-interactive 3D rotation, floating particles background effect, and smooth spring animations.", "short_description": "Magic 3D Tabs component featuring mouse-interactive 3D rotation, floating particles background effect, and smooth spring animations.", "description": "A single showcase component — Magic 3D Tabs — from Darshit's personal portfolio. Features mouse-interactive 3D rotation via spring physics, floating particle background effects, and smooth spring animations. Built as a React component with Tailwind CSS. Minimal scope: one experimental interactive pattern. Free and open source. Use for: pulling a specific 3D tab interaction effect when you want mouse-reactive depth without building it yourself.", "homepage": "https://darshitdev.in/arts", "docs": "https://darshitdev.in/arts", "github": "https://github.com/Darshh09/darshit-portfolio", "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://darshitdev.in/r/{name}.json", "registry_index": "https://darshitdev.in/r/registry.json", "components": [ "magic-genie-tabs" ], "component_items": [ { "name": "magic-genie-tabs", "type": "registry:component", "title": "Magic Genie Tabs", "description": "macOS-style genie animation with a sleek glass pill nav bar" } ], "component_count": 1, "components_truncated": false, "component_types": { "registry:component": 1 }, "has_logo": true, "enrichment_errors": [ "github_lookup_failed" ], "featured": false }, { "number": 48, "name": "@delego", "category": "Uncategorized", "tags": [], "tagline": "Design-system registry for Delego — intent-bound action authorization for AI agents. Theme (OKLCH) plus signature components: decision pill, signed receipt, status badge, field.", "short_description": "", "description": "Design-system registry for Delego — intent-bound action authorization for AI agents. Theme (OKLCH) plus signature components: decision pill, signed receipt, status badge, field.", "homepage": "https://github.com/Delego-Dev/registry", "docs": "https://docs.github.com/", "github": "https://github.com/Delego-Dev/registry", "components_github": "https://github.com/Delego-Dev/registry/tree/main/registry", "github_default_branch": "main", "github_stars": 1, "last_commit": "2026-06-10T12:46:45Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://raw.githubusercontent.com/Delego-Dev/registry/main/public/r/{name}.json", "registry_index": "https://raw.githubusercontent.com/Delego-Dev/registry/main/public/r/registry.json", "components": [ "delego-theme", "button", "status-badge", "decision-pill", "signed-receipt", "field" ], "component_items": [ { "name": "delego-theme", "type": "registry:theme", "title": "Delego Theme", "description": "Delego design tokens mapped onto shadcn variables (OKLCH, light + dark). Electric-indigo primary, signal-mint accent, and the protocol decision palette (allow …" }, { "name": "button", "type": "registry:ui", "title": "Button", "description": "Delego button — primary (indigo glow), secondary, ghost, outline, link, plus protocol-semantic allow/deny actions." }, { "name": "status-badge", "type": "registry:ui", "title": "Status Badge", "description": "Mono pill with leading icon + status color. Variants: allow, approval, deny, indigo (principal/audit), neutral." }, { "name": "decision-pill", "type": "registry:ui", "title": "Decision Pill", "description": "The signature Delego element: renders a Decision outcome (allow / needs_approval / deny) with its canonical icon, mono label, and color." }, { "name": "signed-receipt", "type": "registry:ui", "title": "Signed Receipt", "description": "The ownable audit visual — one hash-chained, Ed25519-signed ledger record, with the signal bar, seal, and mono kv grid." }, { "name": "field", "type": "registry:ui", "title": "Field", "description": "Labeled input with optional leading icon and mono hint, lit by the indigo focus halo. Drop-in over a native input." } ], "component_count": 6, "components_truncated": false, "component_types": { "registry:theme": 1, "registry:ui": 5 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 41, "name": "@delta", "category": "Component library (general)", "tags": [ "ai", "dashboard", "components" ], "tagline": "A shadcn registry for AI and media-rich interfaces — streaming LLM chat, zoomable images, swipeable card decks, interactive maps, plus dashboard and landing-page blocks.", "short_description": "A shadcn registry for AI and media-rich interfaces — streaming LLM chat, zoomable images, swipeable card decks, interactive maps, plus dashboard and landing-page blocks.", "description": "A modern shadcn/ui registry by Patrick Prunty covering AI and media-rich interface components: streaming LLM chat widget, zoomable images, swipeable card deck, Mapbox map pointer, QR code generator, OTP input, code block, admonition/callout, scroll-fade effect, tabs, product card, and X (Twitter) card. Also includes dashboard and landing-page section blocks. Built with React and Tailwind CSS; v0-compatible. Free and MIT-licensed. Use for: adding a curated set of AI chat, media display, and map components to a shadcn project in one registry pull.", "homepage": "https://deltacomponents.dev", "docs": "https://deltacomponents.dev/docs", "github": "https://github.com/pprunty/deltacomponents.dev", "components_github": null, "github_default_branch": "main", "github_stars": 11, "last_commit": "2026-06-29T13:21:22Z", "archived": false, "license": "MIT", "open_issues": 13, "registry_template": "https://deltacomponents.dev/r/{name}.json", "registry_index": "https://deltacomponents.dev/r/registry.json", "components": [ "index", "style", "input-otp", "navigation-menu", "code-block-icons", "code-block", "copy-button", "cambio-image", "card-deck", "admonition", "x-scrollable", "scroll-fade-effect", "tabs", "qrcode", "chat", "mapbox-pointer", "x-card", "marquee", "product-card", "ai-chat-sidebar", "testimonials", "interactive-feature-showcase", "chatbot-window", "bottom-mobile-nav", "mapbox-grid-block", "admin-inset-layout", "saas-header-layout", "saas-dashboard", "auth-form", "use-mobile", "input-otp-demo", "input-otp-pill-demo", "input-otp-separator-demo", "input-otp-form-demo", "product-card-demo", "product-card-inner-demo", "product-card-custom-demo", "product-card-size-demo", "product-card-grid-demo", "navigation-menu-demo", "x-card-demo", "x-card-basic-demo", "x-card-interactive-demo", "marquee-stacked-demo", "marquee-cards-demo", "marquee-demo", "mapbox-pointer-demo", "mapbox-pointer-style-demo", "mapbox-pointer-theme-demo", "chat-demo", "chat-previous-messages-demo", "chat-simple-demo", "code-block-demo", "code-block-package-demo", "code-block-theme-demo", "code-block-interactive-demo", "code-block-markdown-string-demo", "code-block-npx-markdown-demo", "code-block-package-manager-demo", "code-block-python-demo", "code-block-json-demo", "code-block-expand-demo", "cambio-image-demo", "cambio-image-grid-demo", "cambio-image-dismiss-on-scroll-demo", "cambio-image-motion-preset-demo", "cambio-image-icons-expand-demo", "cambio-image-close-button-demo", "qrcode-demo", "qrcode-purple-dots-demo", "qrcode-demo-interactive", "qrcode-logo-demo", "card-deck-demo", "card-deck-demo-interactive", "admonition-demo", "admonition-demo-interactive", "admonition-custom-icon-demo", "admonition-dismissible-demo", "admonition-actions-demo", "admonition-collapsible-demo", "tabs-demo", "tabs-background-demo", "tabs-no-background-demo", "tabs-sizes-demo", "tabs-with-icons-demo", "tabs-entrance-animation-demo", "tabs-in-scroll-area-demo", "card-deck-yugioh-demo", "card-deck-balatro-demo", "chat-shimmer-demo", "chat-reasoning-demo", "scroll-fade-effect-demo", "scroll-fade-effect-slider-demo" ], "component_items": [ { "name": "index", "type": "registry:style", "title": null, "description": null }, { "name": "style", "type": "registry:style", "title": null, "description": null }, { "name": "input-otp", "type": "registry:ui", "title": null, "description": null }, { "name": "navigation-menu", "type": "registry:ui", "title": null, "description": null }, { "name": "code-block-icons", "type": "registry:ui", "title": null, "description": null }, { "name": "code-block", "type": "registry:ui", "title": null, "description": null }, { "name": "copy-button", "type": "registry:ui", "title": null, "description": null }, { "name": "cambio-image", "type": "registry:ui", "title": null, "description": null }, { "name": "card-deck", "type": "registry:ui", "title": null, "description": null }, { "name": "admonition", "type": "registry:ui", "title": null, "description": null }, { "name": "x-scrollable", "type": "registry:ui", "title": null, "description": null }, { "name": "scroll-fade-effect", "type": "registry:ui", "title": null, "description": null }, { "name": "tabs", "type": "registry:ui", "title": null, "description": null }, { "name": "qrcode", "type": "registry:ui", "title": null, "description": null }, { "name": "chat", "type": "registry:ui", "title": null, "description": null }, { "name": "mapbox-pointer", "type": "registry:ui", "title": null, "description": null }, { "name": "x-card", "type": "registry:ui", "title": null, "description": null }, { "name": "marquee", "type": "registry:ui", "title": null, "description": null }, { "name": "product-card", "type": "registry:ui", "title": null, "description": null }, { "name": "ai-chat-sidebar", "type": "registry:block", "title": null, "description": "A collapsible sidebar component for AI chat applications" }, { "name": "testimonials", "type": "registry:block", "title": null, "description": "Customer testimonials grid" }, { "name": "interactive-feature-showcase", "type": "registry:block", "title": null, "description": "InteractiveFeatureShowcase block" }, { "name": "chatbot-window", "type": "registry:block", "title": null, "description": "Resizable AI chatbot interface with collapsible sidebar" }, { "name": "bottom-mobile-nav", "type": "registry:block", "title": null, "description": "BottomMobileNav block" }, { "name": "mapbox-grid-block", "type": "registry:block", "title": null, "description": "Three-column grid showcasing global locations with Mapbox maps" }, { "name": "admin-inset-layout", "type": "registry:block", "title": null, "description": "Admin dashboard layout with inset sidebar" }, { "name": "saas-header-layout", "type": "registry:block", "title": null, "description": "SaaS header layout with navigation menu" }, { "name": "saas-dashboard", "type": "registry:block", "title": null, "description": "SaaS dashboard with inset sidebar and navigation" }, { "name": "auth-form", "type": "registry:block", "title": null, "description": "Authentication form with SSO, email, passkey, and SAML options" }, { "name": "use-mobile", "type": "registry:hook", "title": null, "description": null }, { "name": "input-otp-demo", "type": "registry:example", "title": null, "description": null }, { "name": "input-otp-pill-demo", "type": "registry:example", "title": null, "description": null }, { "name": "input-otp-separator-demo", "type": "registry:example", "title": null, "description": null }, { "name": "input-otp-form-demo", "type": "registry:example", "title": null, "description": null }, { "name": "product-card-demo", "type": "registry:example", "title": null, "description": null }, { "name": "product-card-inner-demo", "type": "registry:example", "title": null, "description": null }, { "name": "product-card-custom-demo", "type": "registry:example", "title": null, "description": null }, { "name": "product-card-size-demo", "type": "registry:example", "title": null, "description": null }, { "name": "product-card-grid-demo", "type": "registry:example", "title": null, "description": null }, { "name": "navigation-menu-demo", "type": "registry:example", "title": null, "description": null }, { "name": "x-card-demo", "type": "registry:example", "title": null, "description": null }, { "name": "x-card-basic-demo", "type": "registry:example", "title": null, "description": null }, { "name": "x-card-interactive-demo", "type": "registry:example", "title": null, "description": null }, { "name": "marquee-stacked-demo", "type": "registry:example", "title": null, "description": null }, { "name": "marquee-cards-demo", "type": "registry:example", "title": null, "description": null }, { "name": "marquee-demo", "type": "registry:example", "title": null, "description": null }, { "name": "mapbox-pointer-demo", "type": "registry:example", "title": null, "description": null }, { "name": "mapbox-pointer-style-demo", "type": "registry:example", "title": null, "description": null }, { "name": "mapbox-pointer-theme-demo", "type": "registry:example", "title": null, "description": null }, { "name": "chat-demo", "type": "registry:example", "title": null, "description": null }, { "name": "chat-previous-messages-demo", "type": "registry:example", "title": null, "description": null }, { "name": "chat-simple-demo", "type": "registry:example", "title": null, "description": null }, { "name": "code-block-demo", "type": "registry:example", "title": null, "description": null }, { "name": "code-block-package-demo", "type": "registry:example", "title": null, "description": null }, { "name": "code-block-theme-demo", "type": "registry:example", "title": null, "description": null }, { "name": "code-block-interactive-demo", "type": "registry:example", "title": null, "description": null }, { "name": "code-block-markdown-string-demo", "type": "registry:example", "title": null, "description": null }, { "name": "code-block-npx-markdown-demo", "type": "registry:example", "title": null, "description": null }, { "name": "code-block-package-manager-demo", "type": "registry:example", "title": null, "description": null }, { "name": "code-block-python-demo", "type": "registry:example", "title": null, "description": null } ], "component_count": 93, "components_truncated": false, "component_types": { "registry:style": 2, "registry:ui": 17, "registry:block": 10, "registry:hook": 1, "registry:example": 63 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 42, "name": "@devl", "category": "Personal/portfolio registry", "tags": [ "components" ], "tagline": "Hand-crafted layouts and UI primitives for shipping fast.", "short_description": "Hand-crafted layouts and UI primitives for shipping fast.", "description": "A personal design scratchpad by Sean Brydon containing 159+ UI experiments built on coss-ui (Cal.com's Base UI design system) and Tailwind v4, all exposed on the shadcn registry. Components are organized by category with one-keypress source-copy. Stack: TanStack Start, coss-ui package, Base UI primitives, Tailwind CSS v4. Not a polished production library — raw POC designs from two years of UI exploration. Free and open source. Use for: browsing unconventional layout and interaction ideas built on Base UI when you want patterns that diverge from the standard Radix/shadcn ecosystem.", "homepage": "https://devl.dev", "docs": "https://devl.dev", "github": "https://github.com/sean-brydon/devl.dev", "components_github": null, "github_default_branch": "main", "github_stars": 188, "last_commit": "2026-04-27T19:21:46Z", "archived": false, "license": null, "open_issues": 0, "registry_template": "https://devl.dev/r/{name}.json", "registry_index": null, "components": [], "component_items": [], "component_count": null, "components_truncated": false, "component_types": {}, "has_logo": true, "enrichment_errors": [ "registry_index_unresolved" ], "featured": false }, { "number": 43, "name": "@diceui", "category": "Component library (general)", "tags": [ "dashboard", "components" ], "tagline": "Accessible shadcn/ui components built with React, TypeScript, and Tailwind CSS. Copy-paste ready, and customizable.", "short_description": "Accessible shadcn/ui components built with React, TypeScript, and Tailwind CSS. Copy-paste ready, and customizable.", "description": "Dice UI is an accessible shadcn/ui extension built with Radix UI primitives, React, TypeScript, and Tailwind CSS. It ships ~40 advanced components not found in the base shadcn set, including action-bar, angle-slider, avatar-group, badge-overflow, color-picker, color-swatch, combobox, compare-slider, cropper, data-grid, data-table, editable, file-upload, gauge, kanban, listbox, marquee, mask-input, masonry, media-player, mention, phone-input, QR-code, rating, responsive-dialog, scroll-spy, segmented-input, selection-toolbar, sortable, speed-dial, stepper, tags-input, time-picker, timeline, and tour. Also includes utility components (client-only, hitbox, portal, presence). All components are copy-paste installable via the shadcn CLI. Use for: filling gaps in a shadcn/ui project where complex interactive primitives like kanban boards, media players, sortable lists, or color pickers are needed without adopting a full third-party library.", "homepage": "https://www.diceui.com/", "docs": "https://www.diceui.com/docs", "github": "https://github.com/sadmann7/diceui", "components_github": null, "github_default_branch": "main", "github_stars": 2026, "last_commit": "2026-06-29T08:28:18Z", "archived": false, "license": "MIT", "open_issues": 67, "registry_template": "https://diceui.com/r/{style}/{name}.json", "registry_index": "https://diceui.com/r/registry/registry.json", "components": [ "action-bar", "angle-slider", "avatar-group", "badge-overflow", "banner", "checkbox-group", "circular-progress", "color-picker", "color-swatch", "compare-slider", "cropper", "combobox", "editable", "file-upload", "fps", "gauge", "kanban", "key-value", "listbox", "marquee", "mask-input", "masonry", "media-player", "mention", "phone-input", "relative-time-card", "responsive-dialog", "scroller", "scroll-spy", "segmented-input", "selection-toolbar", "sortable", "speed-dial", "stack", "stat", "status", "stepper", "swap", "qr-code", "rating", "tags-input", "timeline", "time-picker", "tour", "action-bar-demo", "action-bar-position-demo", "angle-slider-demo", "angle-slider-controlled-demo", "angle-slider-range-demo", "angle-slider-themes-demo", "angle-slider-form-demo", "avatar-group-demo", "avatar-group-truncation-demo", "avatar-group-rtl-demo", "avatar-group-icons-demo", "avatar-group-custom-overflow-demo", "badge-overflow-demo", "badge-overflow-multiline-demo", "badge-overflow-interactive-demo", "banner-demo", "banner-stacked-demo", "checkbox-group-demo", "checkbox-group-animated-demo", "checkbox-group-horizontal-demo", "checkbox-group-multi-selection-demo", "checkbox-group-validation-demo", "circular-progress-demo", "circular-progress-interactive-demo", "circular-progress-colors-demo", "color-picker-demo", "color-picker-controlled-demo", "color-picker-form-demo", "color-picker-inline-demo", "color-swatch-demo", "color-swatch-sizes-demo", "color-swatch-transparency-demo", "combobox-demo", "combobox-custom-filter-demo", "combobox-debounced-demo", "combobox-groups-demo", "combobox-multiple-demo", "combobox-tags-demo", "combobox-virtualized-demo", "compare-slider-demo", "compare-slider-controlled-demo", "compare-slider-customization-demo", "compare-slider-vertical-demo", "cropper-demo", "cropper-controlled-demo", "cropper-file-upload-demo", "cropper-shapes-demo", "cropper-video-demo", "data-grid-demo", "data-table-demo", "editable-demo", "editable-autosize-demo", "editable-double-click-demo", "editable-form-demo", "editable-todo-list-demo", "file-upload-demo" ], "component_items": [ { "name": "action-bar", "type": "registry:ui", "title": null, "description": null }, { "name": "angle-slider", "type": "registry:ui", "title": null, "description": null }, { "name": "avatar-group", "type": "registry:ui", "title": null, "description": null }, { "name": "badge-overflow", "type": "registry:ui", "title": null, "description": null }, { "name": "banner", "type": "registry:ui", "title": null, "description": null }, { "name": "checkbox-group", "type": "registry:ui", "title": null, "description": null }, { "name": "circular-progress", "type": "registry:ui", "title": null, "description": null }, { "name": "color-picker", "type": "registry:ui", "title": null, "description": null }, { "name": "color-swatch", "type": "registry:ui", "title": null, "description": null }, { "name": "compare-slider", "type": "registry:ui", "title": null, "description": null }, { "name": "cropper", "type": "registry:ui", "title": null, "description": null }, { "name": "combobox", "type": "registry:ui", "title": null, "description": null }, { "name": "editable", "type": "registry:ui", "title": null, "description": null }, { "name": "file-upload", "type": "registry:ui", "title": null, "description": null }, { "name": "fps", "type": "registry:ui", "title": null, "description": null }, { "name": "gauge", "type": "registry:ui", "title": null, "description": null }, { "name": "kanban", "type": "registry:ui", "title": null, "description": null }, { "name": "key-value", "type": "registry:ui", "title": null, "description": null }, { "name": "listbox", "type": "registry:ui", "title": null, "description": null }, { "name": "marquee", "type": "registry:ui", "title": null, "description": null }, { "name": "mask-input", "type": "registry:ui", "title": null, "description": null }, { "name": "masonry", "type": "registry:ui", "title": null, "description": null }, { "name": "media-player", "type": "registry:ui", "title": null, "description": null }, { "name": "mention", "type": "registry:ui", "title": null, "description": null }, { "name": "phone-input", "type": "registry:ui", "title": null, "description": null }, { "name": "relative-time-card", "type": "registry:ui", "title": null, "description": null }, { "name": "responsive-dialog", "type": "registry:ui", "title": null, "description": null }, { "name": "scroller", "type": "registry:ui", "title": null, "description": null }, { "name": "scroll-spy", "type": "registry:ui", "title": null, "description": null }, { "name": "segmented-input", "type": "registry:ui", "title": null, "description": null }, { "name": "selection-toolbar", "type": "registry:ui", "title": null, "description": null }, { "name": "sortable", "type": "registry:ui", "title": null, "description": null }, { "name": "speed-dial", "type": "registry:ui", "title": null, "description": null }, { "name": "stack", "type": "registry:ui", "title": null, "description": null }, { "name": "stat", "type": "registry:ui", "title": null, "description": null }, { "name": "status", "type": "registry:ui", "title": null, "description": null }, { "name": "stepper", "type": "registry:ui", "title": null, "description": null }, { "name": "swap", "type": "registry:ui", "title": null, "description": null }, { "name": "qr-code", "type": "registry:ui", "title": null, "description": null }, { "name": "rating", "type": "registry:ui", "title": null, "description": null }, { "name": "tags-input", "type": "registry:ui", "title": null, "description": null }, { "name": "timeline", "type": "registry:ui", "title": null, "description": null }, { "name": "time-picker", "type": "registry:ui", "title": null, "description": null }, { "name": "tour", "type": "registry:ui", "title": null, "description": null }, { "name": "action-bar-demo", "type": "registry:example", "title": null, "description": null }, { "name": "action-bar-position-demo", "type": "registry:example", "title": null, "description": null }, { "name": "angle-slider-demo", "type": "registry:example", "title": null, "description": null }, { "name": "angle-slider-controlled-demo", "type": "registry:example", "title": null, "description": null }, { "name": "angle-slider-range-demo", "type": "registry:example", "title": null, "description": null }, { "name": "angle-slider-themes-demo", "type": "registry:example", "title": null, "description": null }, { "name": "angle-slider-form-demo", "type": "registry:example", "title": null, "description": null }, { "name": "avatar-group-demo", "type": "registry:example", "title": null, "description": null }, { "name": "avatar-group-truncation-demo", "type": "registry:example", "title": null, "description": null }, { "name": "avatar-group-rtl-demo", "type": "registry:example", "title": null, "description": null }, { "name": "avatar-group-icons-demo", "type": "registry:example", "title": null, "description": null }, { "name": "avatar-group-custom-overflow-demo", "type": "registry:example", "title": null, "description": null }, { "name": "badge-overflow-demo", "type": "registry:example", "title": null, "description": null }, { "name": "badge-overflow-multiline-demo", "type": "registry:example", "title": null, "description": null }, { "name": "badge-overflow-interactive-demo", "type": "registry:example", "title": null, "description": null }, { "name": "banner-demo", "type": "registry:example", "title": null, "description": null } ], "component_count": 242, "components_truncated": true, "component_types": { "registry:ui": 44, "registry:example": 184, "registry:lib": 2, "registry:component": 8, "registry:hook": 4 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 44, "name": "@dominik-ui", "category": "Niche/single-purpose", "tags": [ "saas", "ai", "aesthetic" ], "tagline": "Opinionated components and tools for building modern AI interfaces.", "short_description": "Opinionated components and tools for building modern AI interfaces.", "description": "A minimal personal registry from developer Dominik Koch, currently containing a single component: a Braille Loader — an animated braille-pattern loading indicator with wave, typewriter, shimmer, and pulse variants rendered in React. Built with the shadcn registry format and Tailwind CSS. The registry name is dominik-portfolio, reflecting its origin as a personal project built for Dominik's AI startup Notra. Use for: adding a distinctive, accessibility-themed animated loading indicator to an AI or content-focused app where a standard spinner would feel generic.", "homepage": "https://dominikkoch.dev", "docs": "N/A", "github": "N/A", "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://dominikkoch.dev/r/{name}.json", "registry_index": "https://dominikkoch.dev/r/registry.json", "components": [ "expandable-tabs", "permission-selector", "braille-loader" ], "component_items": [ { "name": "expandable-tabs", "type": "registry:ui", "title": "Expandable Tabs", "description": "Animated icon tabs with a sliding active pill and an expanding label, built on the shadcn tooltip." }, { "name": "permission-selector", "type": "registry:ui", "title": "Permission Selector", "description": "A composable segmented permission control with an animated sliding pill — read/write levels and deny/neutral/allow toggles." }, { "name": "braille-loader", "type": "registry:ui", "title": "Braille Loader", "description": "An animated braille loading indicator with wave, typewriter, shimmer, and pulse variants." } ], "component_count": 3, "components_truncated": false, "component_types": { "registry:ui": 3 }, "has_logo": true, "enrichment_errors": [ "github_lookup_failed" ], "featured": false }, { "number": 45, "name": "@doras-ui", "category": "Component library (general)", "tags": [ "components" ], "tagline": "A collection of beautiful, reusable component blocks built with React", "short_description": "A collection of beautiful, reusable component blocks built with React", "description": "Doras UI is a React component library offering copy-paste UI blocks built on the shadcn/ui registry pattern. The site advertises full customizability and live previews, and the meta keywords reference TanStack Router, indicating modern routing support. The GitHub repo was still under construction at research time, limiting available component details. Built with React and Tailwind CSS. Use for: pulling individual shadcn-compatible blocks into a project when the library matures; currently early-stage, so verify component availability before relying on it for production work.", "homepage": "https://ui.doras.to/", "docs": "N/A", "github": "https://github.com/dorasto/ui", "components_github": "https://github.com/dorasto/ui/tree/main/registry", "github_default_branch": "main", "github_stars": 3, "last_commit": "2025-12-06T11:19:15Z", "archived": false, "license": null, "open_issues": 0, "registry_template": "https://ui.doras.to/r/{name}.json", "registry_index": null, "components": [], "component_items": [], "component_count": null, "components_truncated": false, "component_types": {}, "has_logo": true, "enrichment_errors": [ "registry_index_unresolved" ], "featured": false }, { "number": 46, "name": "@dotmatrix", "category": "Niche/single-purpose", "tags": [ "aesthetic" ], "tagline": "Production-ready dot-matrix loading components for React, featuring square, circular, and triangle animations with polished motion.", "short_description": "Production-ready dot-matrix loading components for React, featuring square, circular, and triangle animations with polished motion.", "description": "Dotmatrix is a focused shadcn registry of dot-matrix-style loading animations for React. Components are organized in a single Next.js app with loaders available in three geometric shapes — square, circular, and triangle — each with polished motion. Install via npx shadcn add from the public registry or copy-paste from the docs site. The project also exposes a public/r/registry.json for tooling discovery. Free and open source. Use for: adding a retro, high-contrast dot-matrix loading indicator to any React/Next.js app where a visually distinctive spinner is preferred over a generic spinner or skeleton.", "homepage": "https://dotmatrix.zzzzshawn.cloud", "docs": "https://dotmatrix.zzzzshawn.cloud", "github": "https://github.com/zzzzshawn/matrix", "components_github": "https://github.com/zzzzshawn/matrix/tree/main/components", "github_default_branch": "main", "github_stars": 485, "last_commit": "2026-07-03T09:54:46Z", "archived": false, "license": null, "open_issues": 2, "registry_template": "https://dotmatrix.zzzzshawn.cloud/r/{name}.json", "registry_index": "https://dotmatrix.zzzzshawn.cloud/r/registry.json", "components": [ "dotm-square-1", "dotm-square-2", "dotm-square-3", "dotm-square-4", "dotm-square-5", "dotm-square-6", "dotm-square-7", "dotm-square-8", "dotm-square-9", "dotm-square-10", "dotm-square-11", "dotm-square-12", "dotm-square-13", "dotm-square-14", "dotm-square-15", "dotm-square-16", "dotm-square-17", "dotm-square-18", "dotm-square-19", "dotm-square-20", "dotm-circular-1", "dotm-circular-2", "dotm-circular-3", "dotm-circular-4", "dotm-circular-5", "dotm-circular-6", "dotm-circular-7", "dotm-circular-8", "dotm-circular-9", "dotm-circular-10", "dotm-circular-11", "dotm-circular-12", "dotm-circular-13", "dotm-circular-14", "dotm-circular-15", "dotm-circular-16", "dotm-circular-17", "dotm-circular-18", "dotm-circular-19", "dotm-circular-20", "dotm-triangle-1", "dotm-triangle-2", "dotm-triangle-3", "dotm-triangle-4", "dotm-triangle-5", "dotm-triangle-6", "dotm-triangle-7", "dotm-triangle-8", "dotm-triangle-9", "dotm-triangle-10", "dotm-triangle-11", "dotm-triangle-12", "dotm-triangle-13", "dotm-triangle-14", "dotm-triangle-15", "dotm-triangle-16", "dotm-triangle-17", "dotm-triangle-18", "dotm-triangle-19", "dotm-triangle-20", "dotm-hex-1", "dotm-hex-2", "dotm-hex-3", "dotm-hex-4", "dotm-hex-5", "dotm-hex-6", "dotm-hex-7", "dotm-hex-8", "dotm-hex-9", "dotm-hex-10", "dotm-3x3-1", "dotm-3x3-2", "dotm-3x3-3", "dotm-3x3-4", "dotm-3x3-5", "dotm-3x3-6", "dotm-3x3-7", "dotm-3x3-8", "dotm-3x3-9", "dotm-3x3-10", "dotm-3x3-11", "dotm-3x3-12", "dotm-3x3-13", "dotm-3x3-14", "dotm-3x3-15", "dotm-3x3-16", "dotm-3x3-18", "dotm-3x3-19", "dotm-3x3-20", "dotm-3x3-21", "all" ], "component_items": [ { "name": "dotm-square-1", "type": "registry:ui", "title": "Neon Drift", "description": "Same ripple family as the icon, with a wave that sweeps from the top-right toward the bottom-left." }, { "name": "dotm-square-2", "type": "registry:ui", "title": "Pulse Ladder", "description": "Clockwise snake route: starts bottom-left up column 1, jumps to column 3 down, then column 2 up, and continues the same cycle to the right." }, { "name": "dotm-square-3", "type": "registry:ui", "title": "Core Spiral", "description": "A 4-dot tail spirals clockwise from the outer border toward the center of the 5x5 grid." }, { "name": "dotm-square-4", "type": "registry:ui", "title": "Twin Orbit", "description": "Outer ring snake moves clockwise, middle ring snake moves anticlockwise, and the center dot stays inactive." }, { "name": "dotm-square-5", "type": "registry:ui", "title": "Prism Sweep", "description": "Snake-style trail that traverses the 5x5 grid on alternating diagonals." }, { "name": "dotm-square-6", "type": "registry:ui", "title": "Flux Columns", "description": "Five simultaneous snakes: columns 1/3/5 move up while columns 2/4 move down." }, { "name": "dotm-square-7", "type": "registry:ui", "title": "Block Drop", "description": "Tetromino-like frames drop and stack in a 5x5 matrix, then flash a row-clear beat." }, { "name": "dotm-square-8", "type": "registry:ui", "title": "Strobe Stack", "description": "Each column stacks upward on a stagger (Tetris-style), the full grid blinks twice, then columns drain downward with the same stagger." }, { "name": "dotm-square-9", "type": "registry:ui", "title": "Glyph Pulse", "description": "Two synced 2×3 cells (Unicode dot order) step through clear motifs: rails, full grid, three rows, checker, horseshoes, and alternating columns." }, { "name": "dotm-square-10", "type": "registry:ui", "title": "CRT Glide", "description": "A CRT-style horizontal scanline moves down the matrix; swept rows leave a soft phosphor trail with a slight column-wise warp." }, { "name": "dotm-square-11", "type": "registry:ui", "title": "Echo Ring", "description": "Concentric diamond ripple with a soft secondary echo pulse per ring." }, { "name": "dotm-square-12", "type": "registry:ui", "title": "Origin Wave", "description": "Ripple starts at cell (2,2) and expands outward in concentric rings." }, { "name": "dotm-square-13", "type": "registry:ui", "title": "Core Rotor", "description": "Single fan blade rotating around a center hub for a clean, readable loop." }, { "name": "dotm-square-14", "type": "registry:ui", "title": "Prism Bloom", "description": "A symmetric kaleidoscope bloom cycling through clean radial motifs." }, { "name": "dotm-square-15", "type": "registry:ui", "title": "Helix Glow", "description": "Two mirrored strands with periodic bridges pulse like a compact DNA helix." }, { "name": "dotm-square-16", "type": "registry:ui", "title": "Helix Core", "description": "A narrower helix variant that stays in the center band while preserving strand/rung rhythm." }, { "name": "dotm-square-17", "type": "registry:ui", "title": "Half Helix", "description": "Single-strand helix variant that shows one side of the DNA wave." }, { "name": "dotm-square-18", "type": "registry:ui", "title": "Sound Bars", "description": "Equalizer-style vertical bars that pulse like live music levels." }, { "name": "dotm-square-19", "type": "registry:ui", "title": "Infinity Run", "description": "Dual counter-rotating heads trace a figure-eight with a soft crossover pulse at center." }, { "name": "dotm-square-20", "type": "registry:ui", "title": "Mobius Run", "description": "A bright head and tail run around the outer ring; a dimmer second train stays half a lap behind, with inner corner flashes for the twist." }, { "name": "dotm-circular-1", "type": "registry:ui", "title": "Halo Drift", "description": "A circular-masked half-helix that travels diagonally from top-left to bottom-right with a bright strand and soft adjacent trail." }, { "name": "dotm-circular-2", "type": "registry:ui", "title": "Tri Orbit", "description": "Three luminous heads orbit the circular ring at equal offsets, creating a triad chase that never overlaps into the old snake rhythm." }, { "name": "dotm-circular-3", "type": "registry:ui", "title": "Plasma Veil", "description": "A plasma-like diagonal sweep and pulsing core weave through the circular mask for a distinctly different motion signature." }, { "name": "dotm-circular-4", "type": "registry:ui", "title": "Radar Arc", "description": "A rotating radar arm scans the circular grid with a bright beam front, soft wake, and faint perimeter ring echo." }, { "name": "dotm-circular-5", "type": "registry:ui", "title": "Nova Wheel", "description": "Four rotating pinwheel blades spin through the circular matrix with a glowing center and soft trailing halo." }, { "name": "dotm-circular-6", "type": "registry:ui", "title": "Phase Orb", "description": "An off-center orbiting energy point traces a phase-shifted loop, creating a drifting orbital glow inside the circular matrix." }, { "name": "dotm-circular-7", "type": "registry:ui", "title": "Gate Shift", "description": "A scanning gate flips between vertical and horizontal sweeps, producing a crisp alternating shutter rhythm in the circular grid." }, { "name": "dotm-circular-8", "type": "registry:ui", "title": "Heart Pulse", "description": "Pulse bursts from the center with a dual-beat cadence, sending soft concentric pressure waves across the circular matrix." }, { "name": "dotm-circular-9", "type": "registry:ui", "title": "Star Compass", "description": "A cardinal beacon pattern: N/E/S/W sectors pulse in sequence with a dim opposite echo, creating a clear directional rhythm in the circular mask." }, { "name": "dotm-circular-10", "type": "registry:ui", "title": "Binary Bloom", "description": "Binary-style opacity tiers pulse in modular steps so only a few cells peak at once while others stay low, producing a crisp coded bloom." }, { "name": "dotm-circular-11", "type": "registry:ui", "title": "Lunar Breathe", "description": "A rotating crescent moon silhouette: bright lunar body, soft rim, and faint directional halo moving around the circular mask." }, { "name": "dotm-circular-12", "type": "registry:ui", "title": "Arc Beacon", "description": "A stepped 8-direction beacon beam sweeps around the circle with a dim opposite echo and diagonal spoke accents." }, { "name": "dotm-circular-13", "type": "registry:ui", "title": "Twin Helix", "description": "A circular-masked twin-helix: mirrored side strands weave inward and outward with intermittent interior bridge pulses." }, { "name": "dotm-circular-14", "type": "registry:ui", "title": "Rung Shift", "description": "A shifting DNA ladder where a bright horizontal rung steps row-by-row while side anchors sway and leave soft ghost echoes." }, { "name": "dotm-circular-15", "type": "registry:ui", "title": "Glyph Cluster", "description": "Braille-inspired grouped dot motifs cycle through rails, bridges, and cross forms inside the circular mask with crisp tiered opacity." }, { "name": "dotm-circular-16", "type": "registry:ui", "title": "Rail Scan", "description": "A braille rail scanline sweeps row-by-row between left and right cells, with near-column accents and soft trail falloff." }, { "name": "dotm-circular-17", "type": "registry:ui", "title": "Checker Shift", "description": "Braille-biased checker phases alternate in stepped shifts, keeping rails pronounced while the center cross supports readability." }, { "name": "dotm-circular-18", "type": "registry:ui", "title": "Pulse Pair", "description": "Mirrored braille dot pairs pulse from top and bottom toward the center, with a connective center-column accent." }, { "name": "dotm-circular-19", "type": "registry:ui", "title": "Orbit Cell", "description": "A bright braille cell head orbits the inner ring with a dim tail while rail columns remain softly active." }, { "name": "dotm-circular-20", "type": "registry:ui", "title": "Glyph Cycle", "description": "Distinct braille-like glyphs cycle in sequence with previous-frame ghosting for a crisp readable symbol transition." }, { "name": "dotm-triangle-1", "type": "registry:ui", "title": "Core Spokes", "description": "A triangle-masked matrix where three spoke lines originate at the center and travel outward to each triangle edge." }, { "name": "dotm-triangle-2", "type": "registry:ui", "title": "Altitude Wave", "description": "A soft altitude wave travels between apex and base while the center column remains gently present for shape readability." }, { "name": "dotm-triangle-3", "type": "registry:ui", "title": "Corner Bounce", "description": "A single head bounces between triangle corners along the perimeter path with a short fading tail." }, { "name": "dotm-triangle-4", "type": "registry:ui", "title": "Vertex Chase", "description": "Three staggered heads chase around the triangle perimeter, leaving short fading tails while all dots stay fixed in place." }, { "name": "dotm-triangle-5", "type": "registry:ui", "title": "Row Sweep", "description": "A reflected scanline sweeps from apex to base and back, animating only opacity bands across triangle rows." }, { "name": "dotm-triangle-6", "type": "registry:ui", "title": "Braille Beat", "description": "Triangle-masked braille dots fill down the left rail, then the right, then blink full and empty." }, { "name": "dotm-triangle-7", "type": "registry:ui", "title": "Oblique Weave", "description": "Diagonal harmonics keyed on row + col: bright bands glide along oblique lines through the triangle with a subtle second harmonic for texture." }, { "name": "dotm-triangle-8", "type": "registry:ui", "title": "Wing Metronome", "description": "The lower triangle splits into left and right wings that trade emphasis on a pendulum beat; apex and center pulse brightest when both sides meet in the middle." }, { "name": "dotm-triangle-9", "type": "registry:ui", "title": "Corona Tier", "description": "Eight-connected distance rings from the heart cell: a bright corona sweeps outward through discrete tiers then back, so depth reads as concentric energy shells." }, { "name": "dotm-triangle-10", "type": "registry:ui", "title": "Column Rake", "description": "A stepped head and tail snake the mask in strict column order (bottom to top per column, columns left to right), unlike perimeter chases or diagonal waves." }, { "name": "dotm-triangle-11", "type": "registry:ui", "title": "Shelf Descent", "description": "Cosine bands keyed on Manhattan distance from the apex (not the center): energy reads as horizontal tiers dropping through the triangle." }, { "name": "dotm-triangle-12", "type": "registry:ui", "title": "Skew Drift", "description": "Traveling harmonics on `row - col` so bright ridges move along NE–SW obliques, orthogonal in feel to diagonal loaders that use `row + col`." }, { "name": "dotm-triangle-13", "type": "registry:ui", "title": "Serpent Zip", "description": "A stepped snake follows row-wise serpentine order (base left→right, then alternating row directions) with a long tail — zigzag motion, not a column path." }, { "name": "dotm-triangle-14", "type": "registry:ui", "title": "Pillar Sweep", "description": "A smooth vertical beam sweeps grid columns 0→6; only triangle-masked dots respond so the silhouette lights one vertical slice at a time." }, { "name": "dotm-triangle-15", "type": "registry:ui", "title": "Tripod Handoff", "description": "Brightness hands off smoothly among the three silhouette vertices (apex, left base, right base) with Manhattan falloff — a corner-to-corner orbit, not a mod-3 …" }, { "name": "dotm-triangle-16", "type": "registry:ui", "title": "Updraft", "description": "A V-shaped thermal ridge moves through row-and-column space: brightness peaks along an inverted V so the front climbs the two lower flanks toward the apex, not…" }, { "name": "dotm-triangle-17", "type": "registry:ui", "title": "Infinity Trace", "description": "A stepped head and tail follow a single 10-cell path: left base up to the apex, down the right rim, then through (4,4) → center → (4,2) for a crossing loop." }, { "name": "dotm-triangle-18", "type": "registry:ui", "title": "Hollow Shell", "description": "The heart cell stays locked dim while every other triangle dot breathes together in phase — a hollow, ring-like pulse." }, { "name": "dotm-triangle-19", "type": "registry:ui", "title": "Pivot Ray", "description": "A Gaussian wedge of brightness rotates around the heart cell using each dot’s polar angle — a clear pivoting searchlight, not a cosine-product moiré field." }, { "name": "dotm-triangle-20", "type": "registry:ui", "title": "Twin Perimeter", "description": "Two stepped heads chase the outer perimeter path half a lap apart, each with its own tail; the heart cell stays quietly dim off the loop." } ], "component_count": 91, "components_truncated": false, "component_types": { "registry:ui": 91 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 47, "name": "@dsikeres1", "category": "Forms", "tags": [ "components" ], "tagline": "A headless, composable date & date range picker for React. 5 picker types, 15 locales, dark mode, accessible. Zero dependencies.", "short_description": "A headless, composable date & date range picker for React. 5 picker types, 15 locales, dark mode, accessible. Zero dependencies.", "description": "A headless-first, composable date and range picker library for React distributed via the shadcn registry. Offers five picker types: DatePicker, DateRangePicker, DateTimePicker, DateRangeTimePicker, and TimePicker. Supports 15 locales, keyboard navigation, ARIA accessibility, dark mode, four sizes, date constraints, range presets, and inline mode. Zero dependencies in the headless package (uses native Date/Intl). Available in four consumption modes: Tailwind v4 + shadcn/ui, Tailwind v3, built-in CSS (no Tailwind), and headless hooks. Fully TypeScript-typed. Use for: replacing a heavy date-picker dependency in a shadcn/ui project with an accessible, locale-aware solution that gives full source ownership via registry install.", "homepage": "https://dsikeres1.github.io/react-date-range-picker/", "docs": "https://dsikeres1.github.io/react-date-range-picker/docs/tailwind4/getting-started", "github": "https://github.com/dsikeres1/react-date-range-picker", "components_github": null, "github_default_branch": "main", "github_stars": 3, "last_commit": "2026-03-14T22:04:01Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://dsikeres1.github.io/react-date-range-picker/r/{name}.json", "registry_index": "https://dsikeres1.github.io/react-date-range-picker/r/registry.json", "components": [ "date-range-picker" ], "component_items": [ { "name": "date-range-picker", "type": "registry:component", "title": "Date Range Picker", "description": "Compound component date range picker suite." } ], "component_count": 1, "components_truncated": false, "component_types": { "registry:component": 1 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 48, "name": "@efferd", "category": "Blocks & sections (marketing/SaaS)", "tags": [ "saas", "dashboard" ], "tagline": "A collection of beautifully crafted Shadcn/UI blocks, designed to help developers build modern websites with ease.", "short_description": "A collection of beautifully crafted Shadcn/UI blocks, designed to help developers build modern websites with ease.", "description": "Efferd is a growing collection of production-ready shadcn/ui-based UI blocks organized into marketing and dashboard categories. Marketing blocks cover Auth, Hero, Features, Blog Sections, Contact, Call to Action, FAQs, Testimonials, Pricing, Footer, Header, Image Gallery, Integrations, Logo Cloud, and Not Found pages. Dashboard blocks include App Shell. Built on Radix UI and Tailwind CSS, TypeScript-first, WAI-ARIA compliant. Pricing is freemium with a one-time payment model (Free, Hobby, and Pro tiers). Use for: quickly assembling marketing pages or SaaS landing sites using polished, copy-paste sections without a recurring subscription cost.", "homepage": "https://efferd.com/", "docs": "https://efferd.com/docs", "github": "https://github.com/shabanhr/efferd-ui", "components_github": "https://github.com/shabanhr/efferd-ui/tree/main/registry", "github_default_branch": "main", "github_stars": 141, "last_commit": "2025-12-10T12:53:51Z", "archived": false, "license": null, "open_issues": 3, "registry_template": "https://efferd.com/r/{name}.json", "registry_index": "https://efferd.com/r/registry.json", "components": [ "index", "logo", "copy-button", "full-width-divider", "decor-icon", "grid-filler", "indicator", "lazy-image", "outline-text", "portal", "auth-divider", "infinite-slider", "progressive-blur", "text-effect", "use-scroll", "use-media-query", "use-copy-to-clipboard", "use-keypress", "apple-icon", "discord-icon", "facebook-icon", "figma-icon", "framer-icon", "github-icon", "google-icon", "google-play-icon", "instagram-icon", "linkedin-icon", "react-icon", "shadcn-icon", "slack-icon", "vercel-icon", "x-icon", "youtube-icon", "formater", "app-shell-1", "app-shell-2", "app-shell-3", "app-shell-4", "app-shell-5", "app-shell-6", "app-shell-7", "app-shell-8", "app-shell-9", "app-shell-10", "auth-1", "auth-2", "auth-3", "auth-4", "auth-5", "auth-6", "auth-7", "auth-8", "auth-9", "auth-10", "auth-11", "auth-12", "auth-13", "auth-14", "blogs-1", "blogs-2", "blogs-3", "blogs-4", "blogs-5", "contact-1", "contact-2", "contact-3", "contact-4", "contact-5", "contact-6", "contact-7", "contact-8", "contact-9", "contact-10", "contact-11", "cta-1", "cta-2", "cta-3", "cta-4", "cta-5", "cta-6", "cta-7", "cta-8", "cta-9", "cta-10", "cta-11", "cta-12", "cta-13", "cta-14", "cta-15", "cta-16", "cta-17", "cta-18", "cta-19", "cta-20", "dashboard-1", "dashboard-2", "dashboard-3", "dashboard-4", "dashboard-5" ], "component_items": [ { "name": "index", "type": "registry:style", "title": null, "description": null }, { "name": "logo", "type": "registry:component", "title": null, "description": "Efferd logo component." }, { "name": "copy-button", "type": "registry:component", "title": null, "description": "Copy button component." }, { "name": "full-width-divider", "type": "registry:component", "title": null, "description": "Full-width divider component." }, { "name": "decor-icon", "type": "registry:component", "title": null, "description": "Decor icon component." }, { "name": "grid-filler", "type": "registry:component", "title": null, "description": "Grid filler component." }, { "name": "indicator", "type": "registry:component", "title": null, "description": "Indicator component." }, { "name": "lazy-image", "type": "registry:component", "title": null, "description": "Lazy image component." }, { "name": "outline-text", "type": "registry:component", "title": null, "description": "Outline text component." }, { "name": "portal", "type": "registry:component", "title": null, "description": "react portal component." }, { "name": "auth-divider", "type": "registry:component", "title": null, "description": "Auth divider component." }, { "name": "infinite-slider", "type": "registry:component", "title": null, "description": "Infinite slider component." }, { "name": "progressive-blur", "type": "registry:component", "title": null, "description": "Progressive blur component." }, { "name": "text-effect", "type": "registry:component", "title": null, "description": "Text effect component." }, { "name": "use-scroll", "type": "registry:hook", "title": null, "description": "Use scroll hook." }, { "name": "use-media-query", "type": "registry:hook", "title": null, "description": "Use media query hook." }, { "name": "use-copy-to-clipboard", "type": "registry:hook", "title": null, "description": "Use copy to clipboard hook." }, { "name": "use-keypress", "type": "registry:hook", "title": null, "description": "Use keypress hook." }, { "name": "apple-icon", "type": "registry:component", "title": null, "description": "Apple icon" }, { "name": "discord-icon", "type": "registry:component", "title": null, "description": "Discord icon" }, { "name": "facebook-icon", "type": "registry:component", "title": null, "description": "Facebook icon" }, { "name": "figma-icon", "type": "registry:component", "title": null, "description": "Figma icon" }, { "name": "framer-icon", "type": "registry:component", "title": null, "description": "Framer icon" }, { "name": "github-icon", "type": "registry:component", "title": null, "description": "GitHub icon" }, { "name": "google-icon", "type": "registry:component", "title": null, "description": "Google icon" }, { "name": "google-play-icon", "type": "registry:component", "title": null, "description": "Google Play icon" }, { "name": "instagram-icon", "type": "registry:component", "title": null, "description": "Instagram icon" }, { "name": "linkedin-icon", "type": "registry:component", "title": null, "description": "LinkedIn icon" }, { "name": "react-icon", "type": "registry:component", "title": null, "description": "React icon" }, { "name": "shadcn-icon", "type": "registry:component", "title": null, "description": "shadcn/ui icon" }, { "name": "slack-icon", "type": "registry:component", "title": null, "description": "Slack icon" }, { "name": "vercel-icon", "type": "registry:component", "title": null, "description": "Vercel icon" }, { "name": "x-icon", "type": "registry:component", "title": null, "description": "X (Twitter) icon" }, { "name": "youtube-icon", "type": "registry:component", "title": null, "description": "YouTube icon" }, { "name": "formater", "type": "registry:component", "title": null, "description": "Formater utilities." }, { "name": "app-shell-1", "type": "registry:block", "title": null, "description": "Dashboard shell with max-width bordered frame, full-width divider, sidebar, breadcrumb header, and skeleton content grid." }, { "name": "app-shell-2", "type": "registry:block", "title": null, "description": "Full-viewport sidebar layout with breadcrumb navbar, keyboard shortcut hints, and dashboard skeleton grid." }, { "name": "app-shell-3", "type": "registry:block", "title": null, "description": "Scrollable main column with collapsible sidebar groups, breadcrumb bar, and dashboard placeholder content." }, { "name": "app-shell-4", "type": "registry:block", "title": null, "description": "Inset sidebar layout with collapsible navigation and padded main shell." }, { "name": "app-shell-5", "type": "registry:block", "title": null, "description": "Sidebar workspace with command-style search, custom trigger and theme controls, navbar strip, and latest-change row." }, { "name": "app-shell-6", "type": "registry:block", "title": null, "description": "Animated inset sidebar with org switcher, shared row, dedicated header trigger, mobile navbar, and skeleton body." }, { "name": "app-shell-7", "type": "registry:block", "title": null, "description": "Inset shell with progressive blur footer, command search, notifications popover, shared nav user, and org menu." }, { "name": "app-shell-8", "type": "registry:block", "title": null, "description": "Top app header over sidebar with projects and notifications, search, tooltip-rich trigger, and skeleton main area." }, { "name": "app-shell-9", "type": "registry:block", "title": null, "description": "Inset dashboard shell with hover-expand icon sidebar, breadcrumb header, command search, notifications popover, and user menu." }, { "name": "app-shell-10", "type": "registry:block", "title": null, "description": "App shell with project-switching sidebar, command search, latest-change footer row, custom rail, and bordered content area." }, { "name": "auth-1", "type": "registry:block", "title": null, "description": "Modern sign-in page with particle background and social buttons." }, { "name": "auth-2", "type": "registry:block", "title": null, "description": "Split sign-in layout with social buttons and email form." }, { "name": "auth-3", "type": "registry:block", "title": null, "description": "Minimal sign-in page with logo header and focused form." }, { "name": "auth-4", "type": "registry:block", "title": null, "description": "Clean sign-in screen with full-width divider and social actions." }, { "name": "auth-5", "type": "registry:block", "title": null, "description": "Modern signup page with testimonial sidebar and social sign-in." }, { "name": "auth-6", "type": "registry:block", "title": null, "description": "Sign-in layout with modern branding and compact form." }, { "name": "auth-7", "type": "registry:block", "title": null, "description": "Split sign-in page with decorative icons and social login." }, { "name": "auth-8", "type": "registry:block", "title": null, "description": "Sign-in page with flickering grid backdrop and clean form." }, { "name": "auth-9", "type": "registry:block", "title": null, "description": "Sign-in layout with subtle grid pattern and social actions." }, { "name": "auth-10", "type": "registry:block", "title": null, "description": "Sign-in page with testimonial card and email form." }, { "name": "auth-11", "type": "registry:block", "title": null, "description": "Sign-in screen with patterned backdrop and centered form." }, { "name": "auth-12", "type": "registry:block", "title": null, "description": "Signup page with avatar accents, social buttons, and email form." }, { "name": "auth-13", "type": "registry:block", "title": null, "description": "Minimal sign-in layout with logo header and clean fields." }, { "name": "auth-14", "type": "registry:block", "title": null, "description": "Sign-in page with avatar accents and polished social flow." }, { "name": "blogs-1", "type": "registry:block", "title": null, "description": "Minimalist list with dashed dividers." } ], "component_count": 201, "components_truncated": true, "component_types": { "registry:style": 1, "registry:component": 30, "registry:hook": 4, "registry:block": 166 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 49, "name": "@einui", "category": "Theming/styling", "tags": [ "dashboard", "aesthetic" ], "tagline": "Beautiful, responsive Shadcn components with frosted glass morphism. Built for modern web applications with full dark mode support.", "short_description": "Beautiful, responsive Shadcn components with frosted glass morphism. Built for modern web applications with full dark mode support.", "description": "Ein UI is a liquid-glass glassmorphism component library built with Radix UI primitives, Tailwind CSS v4, TypeScript, and React 19 (Next.js 16). It ships base components (glass-card, glass-button, glass-dialog, glass-input, glass-tabs, glass-badge, glass-avatar, glass-progress, glass-switch, glass-slider) and advanced glass components (command-palette, notification, morph-card, ripple, timeline, gauge, dock) plus calendar and clock widgets. Distributed via the shadcn registry format. Also includes an example admin panel block. Free and open source (ISC). Use for: adding a cohesive frosted-glass visual aesthetic with full dark mode to a Next.js app without hand-building every blur/backdrop-filter surface.", "homepage": "https://ui.eindev.ir", "docs": "https://ui.eindev.ir/docs", "github": "https://github.com/ehsanghaffar/einui", "components_github": "https://github.com/ehsanghaffar/einui/tree/main/registry", "github_default_branch": "main", "github_stars": 120, "last_commit": "2026-07-05T19:05:15Z", "archived": false, "license": "MIT", "open_issues": 5, "registry_template": "https://ui.eindev.ir/r/{name}.json", "registry_index": "https://ui.eindev.ir/r/registry.json", "components": [ "glass-avatar", "glass-badge", "glass-button", "glass-card", "glass-dialog", "glass-input", "glass-progress", "glass-slider", "glass-switch", "glass-tabs", "glass-tooltip", "glass-command-palette", "glass-notification", "glass-dock", "glass-gauge", "glass-morph-card", "glass-ripple", "glass-spotlight", "glass-timeline", "base-widget", "calendar-widget", "clock-widget", "weather-widget", "stats-widget", "stock-widget", "admin-panel", "glass-select", "glass-textarea", "glass-checkbox", "glass-radio", "glass-skeleton", "glass-table", "glass-breadcrumb", "glass-sheet", "glass-popover", "glass-alert-dialog", "glass-separator", "glass-scroll-area", "forgot-password-page", "login-page", "signup-page", "pricing-page" ], "component_items": [ { "name": "glass-avatar", "type": "registry:ui", "title": "Glass Avatar", "description": "Circular profile images with gradient glow effects and fallback initials for user representation." }, { "name": "glass-badge", "type": "registry:ui", "title": "Glass Badge", "description": "Small visual indicators for status, labels, or categories with frosted glass styling and color variants." }, { "name": "glass-button", "type": "registry:ui", "title": "Glass Button", "description": "Interactive button components with multiple variants, sizes, and optional glow effects." }, { "name": "glass-card", "type": "registry:ui", "title": "Glass Card", "description": "Flexible container components with frosted glass morphism effect, perfect for displaying grouped content." }, { "name": "glass-dialog", "type": "registry:ui", "title": "Glass Dialog", "description": "Modal dialog components with backdrop blur and smooth animations for confirmations and forms." }, { "name": "glass-input", "type": "registry:ui", "title": "Glass Input", "description": "Form input components with focus glow animations and glass morphism styling." }, { "name": "glass-progress", "type": "registry:ui", "title": "Glass Progress", "description": "Visual indicators for task completion with animated gradient fill and glow effects." }, { "name": "glass-slider", "type": "registry:ui", "title": "Glass Slider", "description": "Range input controls with gradient track, glow effects, and smooth thumb interaction." }, { "name": "glass-switch", "type": "registry:ui", "title": "Glass Switch", "description": "Toggle controls for binary options with smooth transitions and glow effects when activated." }, { "name": "glass-tabs", "type": "registry:ui", "title": "Glass Tabs", "description": "Tabbed interface components with smooth transitions and glass morphism styling." }, { "name": "glass-tooltip", "type": "registry:ui", "title": "Glass Tooltip", "description": "Contextual information popups with glass morphism styling and smooth animations on hover." }, { "name": "glass-command-palette", "type": "registry:component", "title": "Glass Command Palette", "description": "A spotlight-style command palette with keyboard navigation, search filtering, customizable positioning, and glass morphism styling." }, { "name": "glass-notification", "type": "registry:component", "title": "Glass Notification", "description": "A customizable notification system with glass morphism styling, allowing for different types of messages and actions." }, { "name": "glass-dock", "type": "registry:component", "title": "Glass Dock", "description": "A dock component with glass morphism styling and smooth animations." }, { "name": "glass-gauge", "type": "registry:component", "title": "Glass Gauge", "description": "A gauge component with glass morphism styling, suitable for displaying progress or performance metrics." }, { "name": "glass-morph-card", "type": "registry:component", "title": "Glass Morph Card", "description": "A card component with a morphing glass effect, suitable for displaying content in a visually appealing way." }, { "name": "glass-ripple", "type": "registry:component", "title": "Glass Ripple", "description": "A ripple effect component that can be applied to various elements for a dynamic interaction experience." }, { "name": "glass-spotlight", "type": "registry:component", "title": "Glass Spotlight", "description": "A spotlight component that highlights specific areas of the UI with a glass morphism effect." }, { "name": "glass-timeline", "type": "registry:component", "title": "Glass Timeline", "description": "A timeline component with glass morphism styling, suitable for displaying events or processes in a chronological order." }, { "name": "base-widget", "type": "registry:ui", "title": "Base Widget", "description": "base widgets component" }, { "name": "calendar-widget", "type": "registry:component", "title": "Calendar Widgets", "description": "Calendar widgets for displaying dates, events, and scheduling information." }, { "name": "clock-widget", "type": "registry:component", "title": "Clock Widgets", "description": "Clock widgets including analog, digital, world clock, stopwatch, and timer with liquid glass styling." }, { "name": "weather-widget", "type": "registry:component", "title": "Weather Widgets", "description": "Weather widgets for displaying temperature, conditions, forecasts, and hourly data with liquid glass styling." }, { "name": "stats-widget", "type": "registry:component", "title": "Stats Widgets", "description": "Statistics and metrics widgets for displaying data, comparisons, and progress with liquid glass styling." }, { "name": "stock-widget", "type": "registry:component", "title": "Stock Widgets", "description": "Stock market widgets for displaying stock prices, trends, and news with liquid glass styling." }, { "name": "admin-panel", "type": "registry:block", "title": "Admin Panel", "description": "A complete admin dashboard built with liquid glass components." }, { "name": "glass-select", "type": "registry:component", "title": "Glass Select", "description": "A liquid glass styled select dropdown with frosted glass styling." }, { "name": "glass-textarea", "type": "registry:component", "title": "Glass Textarea", "description": "A liquid glass styled textarea with focus glow effects." }, { "name": "glass-checkbox", "type": "registry:component", "title": "Glass Checkbox", "description": "A liquid glass styled checkbox with animated check indicator." }, { "name": "glass-radio", "type": "registry:component", "title": "Glass Radio Group", "description": "A liquid glass styled radio group with animated selection." }, { "name": "glass-skeleton", "type": "registry:component", "title": "Glass Skeleton", "description": "A liquid glass styled skeleton loading component with shimmer." }, { "name": "glass-table", "type": "registry:component", "title": "Glass Table", "description": "A liquid glass styled table for displaying tabular data." }, { "name": "glass-breadcrumb", "type": "registry:component", "title": "Glass Breadcrumb", "description": "A liquid glass styled breadcrumb navigation component." }, { "name": "glass-sheet", "type": "registry:component", "title": "Glass Sheet", "description": "A liquid glass styled sheet/drawer with slide animations." }, { "name": "glass-popover", "type": "registry:component", "title": "Glass Popover", "description": "A liquid glass styled popover for floating content." }, { "name": "glass-alert-dialog", "type": "registry:component", "title": "Glass Alert Dialog", "description": "A liquid glass styled alert dialog for confirmations." }, { "name": "glass-separator", "type": "registry:component", "title": "Glass Separator", "description": "A liquid glass styled separator/divider component." }, { "name": "glass-scroll-area", "type": "registry:component", "title": "Glass Scroll Area", "description": "A liquid glass styled custom scrollbar component." }, { "name": "forgot-password-page", "type": "registry:block", "title": "Forgot Password Page", "description": "A forgot password recovery page with email submission and confirmation state, including helpful tips and support contact." }, { "name": "login-page", "type": "registry:block", "title": "Login Page", "description": "A complete login page with email and password authentication, password visibility toggle, remember me option, and social login buttons." }, { "name": "signup-page", "type": "registry:block", "title": "Sign Up Page", "description": "A complete sign up page with multi-step validation, password strength indicator, confirm password matching, and terms agreement checkbox." }, { "name": "pricing-page", "type": "registry:block", "title": "Pricing Page", "description": "A modern pricing page with multiple plan tiers, billing toggle, feature comparison, FAQ section, and call-to-action buttons." } ], "component_count": 42, "components_truncated": false, "component_types": { "registry:ui": 12, "registry:component": 25, "registry:block": 5 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 50, "name": "@eldoraui", "category": "Animated components", "tags": [ "saas", "aesthetic" ], "tagline": "An open-source, modern UI component library for React, built with TypeScript, Tailwind CSS, and Framer Motion. Eldora UI offers beautifully crafted, reusable components designed for performance and elegance.", "short_description": "An open-source, modern UI component library for React, built with TypeScript, Tailwind CSS, and Framer Motion. Eldora UI offers beautifully crafted, reusable components designed for performance and elegance.", "description": "Eldora UI is an animation-focused React component library supported by Vercel OSS. Built with TypeScript, Tailwind CSS, and Framer Motion. Components span device mockups (browser, iPad, iPhone 17 Pro, MacBook Pro, Safari), animated badges, animated lists, card-flip hover, Clerk OTP, Cobe globe, GitHub inline comments, grids, integrations, terminal, testimonial slider, animated frameworks, logo timeline, map, several text animation primitives (blur-in, fade, font-weight, gradual spacing, letter pull-up, multi-direction slide, scale-letter, separate-away, wavy, word pull-up), and animated backgrounds (hacker, novatrix, photon beam). Free and open source (MIT). Use for: building visually rich SaaS landing pages or portfolio sites where Framer Motion animations and device mockup components are core to the design.", "homepage": "https://eldoraui.site", "docs": "https://eldoraui.site/docs", "github": "https://github.com/karthikmudunuri/eldoraui", "components_github": null, "github_default_branch": "main", "github_stars": 1945, "last_commit": "2026-04-18T14:56:19Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://eldoraui.site/r/{name}.json", "registry_index": "https://eldoraui.site/r/registry.json", "components": [ "index", "safari-browser", "macbook-pro", "iphone-17-pro", "ipad", "browser", "cobe-globe", "github-inline-comments", "animated-badge", "grid", "clerk-otp", "marquee", "integrations", "terminal", "testimonal-slider", "map", "svg-ripple-effect", "animated-frameworks", "blur-in-text", "fade-text", "gradual-spacing-text", "letter-pull-up-text", "multi-direction-slide-text", "seperate-away-text", "wavy-text", "word-pull-up-text", "novatrix-background", "photon-beam", "hacker-background", "card-flip-hover", "scale-letter-text", "font-weight-text", "animated-grid-pattern", "live-button", "animated-shiny-button", "animated-list", "orbit-rotation", "logo-timeline", "dock-text", "holographic-card", "safari-browser-demo", "macbook-pro-demo", "iphone-17-pro-demo", "ipad-demo", "browser-demo", "browser-demo-2", "cobe-globe-demo", "cobe-globe-demo-2", "cobe-globe-demo-3", "cobe-globe-demo-4", "cobe-globe-demo-5", "github-inline-comments-demo", "animated-badge-demo", "grid-demo", "grid-demo-2", "grid-demo-3", "grid-demo-4", "grid-demo-5", "clerk-otp-demo", "clerk-otp-demo-2", "integrations-demo", "integrations-demo-2", "terminal-demo", "testimonal-slider-demo", "map-demo", "svg-ripple-effect-demo", "svg-ripple-effect-demo-2", "animated-frameworks-demo", "blur-in-text-demo", "fade-text-demo", "fade-text-demo-2", "fade-text-demo-3", "gradual-spacing-text-demo", "letter-pull-up-text-demo", "multi-direction-slide-text-demo", "seperate-away-text-demo", "wavy-text-demo", "word-pull-up-text-demo", "novatrix-background-demo", "novatrix-background-demo-2", "photon-beam-demo", "hacker-background-demo", "hacker-background-demo-2", "card-flip-hover-demo", "scale-letter-text-demo", "font-weight-text-demo", "animated-grid-pattern-demo", "live-button-demo", "animated-shiny-button-demo", "animated-list-demo", "orbit-rotation-demo", "logo-timeline-demo", "logo-timeline-demo-2", "dock-text-demo", "dock-text-demo-2", "holographic-card-demo", "holographic-card-demo-2", "holographic-card-demo-3", "utils", "header-01" ], "component_items": [ { "name": "index", "type": "registry:style", "title": null, "description": null }, { "name": "safari-browser", "type": "registry:ui", "title": "safari-browser", "description": "A safari browser component." }, { "name": "macbook-pro", "type": "registry:ui", "title": "macbook-pro", "description": "A MacBook Pro SVG component." }, { "name": "iphone-17-pro", "type": "registry:ui", "title": "iphone-17-pro", "description": "An iPhone 17 Pro SVG component." }, { "name": "ipad", "type": "registry:ui", "title": "ipad", "description": "An iPad SVG component." }, { "name": "browser", "type": "registry:ui", "title": "browser", "description": "A browser SVG component." }, { "name": "cobe-globe", "type": "registry:ui", "title": "cobe-globe", "description": "A cobe globe component." }, { "name": "github-inline-comments", "type": "registry:ui", "title": "github-inline-comments", "description": "A github inline comments component." }, { "name": "animated-badge", "type": "registry:ui", "title": "animated-badge", "description": "An animated badge component." }, { "name": "grid", "type": "registry:ui", "title": "grid", "description": "A grid component." }, { "name": "clerk-otp", "type": "registry:ui", "title": "clerk-otp", "description": "A clerk OTP component." }, { "name": "marquee", "type": "registry:ui", "title": "marquee", "description": "A performant, customizable marquee (scrolling text/content) component." }, { "name": "integrations", "type": "registry:ui", "title": "integrations", "description": "An integrations component." }, { "name": "terminal", "type": "registry:ui", "title": "terminal", "description": "A terminal component." }, { "name": "testimonal-slider", "type": "registry:ui", "title": "testimonal-slider", "description": "A testimonial slider component." }, { "name": "map", "type": "registry:ui", "title": "map", "description": "An animated map component with location markers." }, { "name": "svg-ripple-effect", "type": "registry:ui", "title": "svg-ripple-effect", "description": "An SVG ripple effect component." }, { "name": "animated-frameworks", "type": "registry:ui", "title": "animated-frameworks", "description": "An animated frameworks component." }, { "name": "blur-in-text", "type": "registry:ui", "title": "blur-in-text", "description": "A blur in text component." }, { "name": "fade-text", "type": "registry:ui", "title": "fade-text", "description": "A combined fade text component with support for in, up, and down directions." }, { "name": "gradual-spacing-text", "type": "registry:ui", "title": "gradual-spacing-text", "description": "A gradual spacing text component." }, { "name": "letter-pull-up-text", "type": "registry:ui", "title": "letter-pull-up-text", "description": "A letter pull up text component." }, { "name": "multi-direction-slide-text", "type": "registry:ui", "title": "multi-direction-slide-text", "description": "A multi direction slide text component." }, { "name": "seperate-away-text", "type": "registry:ui", "title": "seperate-away-text", "description": "A seperate away text component." }, { "name": "wavy-text", "type": "registry:ui", "title": "wavy-text", "description": "A wavy text component." }, { "name": "word-pull-up-text", "type": "registry:ui", "title": "word-pull-up-text", "description": "A word pull up text component." }, { "name": "novatrix-background", "type": "registry:ui", "title": "novatrix-background", "description": "A novatrix background component." }, { "name": "photon-beam", "type": "registry:ui", "title": "photon-beam", "description": "A photon beam background component with animated light trails." }, { "name": "hacker-background", "type": "registry:ui", "title": "hacker-background", "description": "A hacker background component." }, { "name": "card-flip-hover", "type": "registry:ui", "title": "card-flip-hover", "description": "A card flip hover component." }, { "name": "scale-letter-text", "type": "registry:ui", "title": "scale-letter-text", "description": "A scale letter text component." }, { "name": "font-weight-text", "type": "registry:ui", "title": "font-weight-text", "description": "A font weight text component." }, { "name": "animated-grid-pattern", "type": "registry:ui", "title": "animated-grid-pattern", "description": "An animated grid pattern component." }, { "name": "live-button", "type": "registry:ui", "title": "live-button", "description": "A live button component." }, { "name": "animated-shiny-button", "type": "registry:ui", "title": "animated-shiny-button", "description": "An animated shiny button component." }, { "name": "animated-list", "type": "registry:ui", "title": "animated-list", "description": "An animated list component." }, { "name": "orbit-rotation", "type": "registry:ui", "title": "orbit-rotation", "description": "An orbit rotation component with customizable icons." }, { "name": "logo-timeline", "type": "registry:ui", "title": "logo-timeline", "description": "An animated logo timeline component with horizontal scrolling logos." }, { "name": "dock-text", "type": "registry:ui", "title": "dock-text", "description": "A dock text component with interactive hover effects." }, { "name": "holographic-card", "type": "registry:ui", "title": "holographic-card", "description": "An interactive card with a holographic gradient and mouse‑reactive tilt effect." }, { "name": "safari-browser-demo", "type": "registry:example", "title": "safari-browser-demo", "description": "Example showing a safari-browser-demo component." }, { "name": "macbook-pro-demo", "type": "registry:example", "title": "macbook-pro-demo", "description": "Example showing a macbook-pro-demo component." }, { "name": "iphone-17-pro-demo", "type": "registry:example", "title": "iphone-17-pro-demo", "description": "Example showing a iphone-17-pro-demo component." }, { "name": "ipad-demo", "type": "registry:example", "title": "ipad-demo", "description": "Example showing a ipad-demo component." }, { "name": "browser-demo", "type": "registry:example", "title": "browser-demo", "description": "Example showing a browser-demo component." }, { "name": "browser-demo-2", "type": "registry:example", "title": "browser-demo-2", "description": "Example showing a browser-demo-2 component." }, { "name": "cobe-globe-demo", "type": "registry:example", "title": "cobe-globe-demo", "description": "Example showing a cobe-globe-demo component." }, { "name": "cobe-globe-demo-2", "type": "registry:example", "title": "cobe-globe-demo-2", "description": "Example showing a cobe-globe-demo-2 component." }, { "name": "cobe-globe-demo-3", "type": "registry:example", "title": "cobe-globe-demo-3", "description": "Example showing a cobe-globe-demo-3 component." }, { "name": "cobe-globe-demo-4", "type": "registry:example", "title": "cobe-globe-demo-4", "description": "Example showing a cobe-globe-demo-4 component." }, { "name": "cobe-globe-demo-5", "type": "registry:example", "title": "cobe-globe-demo-5", "description": "Example showing a cobe-globe-demo-5 component." }, { "name": "github-inline-comments-demo", "type": "registry:example", "title": "github-inline-comments-demo", "description": "Example showing a github-inline-comments-demo component." }, { "name": "animated-badge-demo", "type": "registry:example", "title": "animated-badge-demo", "description": "Example showing a animated-badge-demo component." }, { "name": "grid-demo", "type": "registry:example", "title": "grid-demo", "description": "Example showing a grid-demo component." }, { "name": "grid-demo-2", "type": "registry:example", "title": "grid-demo-2", "description": "Example showing a grid-demo-2 component." }, { "name": "grid-demo-3", "type": "registry:example", "title": "grid-demo-3", "description": "Example showing a grid-demo-3 component." }, { "name": "grid-demo-4", "type": "registry:example", "title": "grid-demo-4", "description": "Example showing a grid-demo-4 component." }, { "name": "grid-demo-5", "type": "registry:example", "title": "grid-demo-5", "description": "Example showing a grid-demo-5 component." }, { "name": "clerk-otp-demo", "type": "registry:example", "title": "clerk-otp-demo", "description": "Example showing a clerk-otp-demo component." }, { "name": "clerk-otp-demo-2", "type": "registry:example", "title": "clerk-otp-demo-2", "description": "Example showing a clerk-otp-demo-2 component." } ], "component_count": 115, "components_truncated": true, "component_types": { "registry:style": 1, "registry:ui": 39, "registry:example": 58, "registry:lib": 1, "registry:block": 16 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 51, "name": "@elements", "category": "Component library (general)", "tags": [ "saas", "ai", "components" ], "tagline": "Full-stack shadcn/ui components that go beyond UI. Add auth, monetization, uploads, and AI to your app in seconds.", "short_description": "Full-stack shadcn/ui components that go beyond UI. Add auth, monetization, uploads, and AI to your app in seconds.", "description": "Elements by Crafter Station is a full-stack shadcn registry for Next.js and TypeScript that goes beyond visual UI. It bundles 154 theme-adaptive brand logos, 6 Clerk auth flow components (sign-in, sign-up, org switcher, waitlist), 37 AI/chat elements for the Vercel AI SDK (chat, reasoning, tool calls, streaming), 12 Claude Code automation components, 5 Polar monetization components (pricing cards, badges, license keys), 7 UploadThing upload components, 5 Upstash rate-limiting/caching components, 7 GitHub stats components, 9 dev-tool components (JSON viewer, webhook tester), 24 CC0 sound effects, 6 theme switchers, 6 loaders, and 2 PDF utilities. Free, MIT licensed. Use for: rapidly wiring auth, payments, AI chat, and file uploads into a Next.js app using registry-installed, source-owned blocks rather than npm packages.", "homepage": "https://www.tryelements.dev", "docs": "https://www.tryelements.dev/docs", "github": "https://github.com/crafter-station/elements", "components_github": "https://github.com/crafter-station/elements/tree/main/registry", "github_default_branch": "main", "github_stars": 511, "last_commit": "2026-05-17T00:16:54Z", "archived": false, "license": "MIT", "open_issues": 4, "registry_template": "https://www.tryelements.dev/r/{name}.json", "registry_index": "https://www.tryelements.dev/r/registry.json", "components": [ "ably-logo", "agent-context", "agent-roster", "agent-status", "agentic-coding", "agentmail-logo", "ai-badge", "ai-services", "algolia-logo", "amp-logo", "anthropic-logo", "antigravity-logo", "api-response-viewer", "apple-logo", "artifact", "astro-logo", "auth0-logo", "aws-all", "aws-amplify", "aws-analytics", "aws-api-gateway", "aws-appsync", "aws-athena", "aws-bedrock", "aws-cloudformation", "aws-cloudfront", "aws-cloudwatch", "aws-codebuild", "aws-codecommit", "aws-codedeploy", "aws-codepipeline", "aws-cognito", "aws-compute", "aws-database", "aws-devtools", "aws-dynamodb", "aws-ec2", "aws-ecs", "aws-eks", "aws-elastic-beanstalk", "aws-eventbridge", "aws-fargate", "aws-glue", "aws-iam", "aws-kinesis", "aws-kms", "aws-lambda", "aws-logo", "aws-messaging", "aws-ml", "aws-monitoring", "aws-networking", "aws-rds", "aws-redshift", "aws-route53", "aws-s3", "aws-sagemaker", "aws-secrets-manager", "aws-security", "aws-serverless", "aws-sns", "aws-sqs", "aws-step-functions", "aws-storage", "aws-vpc", "axiom-logo", "bash-logo", "beincrypto-logo", "better-auth-logo", "biome-logo", "braintrust-logo", "browser-use-logo", "browserbase-logo", "bun-logo", "bytedance-logo", "cerebras-logo", "chain-of-thought", "chat", "chat-input", "claude-code-logo", "claude-logo", "clerk-logo", "clerk-oauth-buttons", "clerk-org-switcher", "clerk-sign-in", "clerk-sign-up", "clerk-user-button", "clerk-waitlist", "cli-output", "cline-logo", "cloud-infrastructure", "cloudflare-logo", "cloudinary-logo", "code-diff-viewer", "codex-logo", "cohere-logo", "composio-logo", "confirmation", "continue-logo", "conversation-tree" ], "component_items": [ { "name": "ably-logo", "type": "registry:ui", "title": "Ably Logo", "description": "Ably logo with dark/light mode support" }, { "name": "agent-context", "type": "registry:ui", "title": "AI Agent Context", "description": "Display and optionally edit agent context data with type indicators, nested object support, and collapsible sections. Visualizes user/team context for AI agent…" }, { "name": "agent-roster", "type": "registry:ui", "title": "AI Agent Roster", "description": "Display a directory of AI agents with status indicators, match patterns, and selection support. Supports grid and list layouts for multi-agent orchestration UI…" }, { "name": "agent-status", "type": "registry:ui", "title": "AI Agent Status", "description": "Display current agent handling a request with status indicators, animated pulse for active states, and handoff visualization for multi-agent workflows." }, { "name": "agentic-coding", "type": "registry:block", "title": "Agentic Coding", "description": "AI coding agents, IDEs, and copilots" }, { "name": "agentmail-logo", "type": "registry:block", "title": "AgentMail Logo", "description": "AgentMail logo with icon variant and dark/light modes" }, { "name": "ai-badge", "type": "registry:block", "title": "AI Badge", "description": "Interactive 3D badge component with Atropos effect, customizable branding, QR code, and AI avatar support" }, { "name": "ai-services", "type": "registry:block", "title": "AI Services", "description": "Major AI service providers and LLM platforms" }, { "name": "algolia-logo", "type": "registry:ui", "title": "Algolia Logo", "description": "Algolia logo with dark/light mode support" }, { "name": "amp-logo", "type": "registry:ui", "title": "Amp Logo", "description": "Amp (by Sourcegraph) coding agent logo with icon and wordmark variants" }, { "name": "anthropic-logo", "type": "registry:ui", "title": "Anthropic Logo", "description": "Anthropic logo component with theme-adaptive colors" }, { "name": "antigravity-logo", "type": "registry:ui", "title": "Antigravity Logo", "description": "Google Antigravity agentic IDE logo with icon and color variants" }, { "name": "api-response-viewer", "type": "registry:ui", "title": "API Response Viewer", "description": "HTTP response viewer with tabbed Body, Headers, and Timing display" }, { "name": "apple-logo", "type": "registry:ui", "title": "Apple Logo", "description": "Apple logo component with theme-adaptive colors" }, { "name": "artifact", "type": "registry:ui", "title": "Ai Artifact", "description": "TODO: Add description" }, { "name": "astro-logo", "type": "registry:block", "title": "Astro Logo", "description": "Astro web framework logo with icon and icon-mono variants" }, { "name": "auth0-logo", "type": "registry:ui", "title": "Auth0 Logo", "description": "Auth0 logo with dark/light mode support" }, { "name": "aws-all", "type": "registry:block", "title": "AWS All Services", "description": "Complete collection of AWS service logos" }, { "name": "aws-amplify", "type": "registry:ui", "title": "AWS Amplify Logo", "description": "AWS Amplify service logo component with official brand colors" }, { "name": "aws-analytics", "type": "registry:block", "title": "AWS Analytics", "description": "AWS analytics service logos" }, { "name": "aws-api-gateway", "type": "registry:ui", "title": "Amazon API Gateway Logo", "description": "Amazon API Gateway service logo component with official brand colors" }, { "name": "aws-appsync", "type": "registry:ui", "title": "AWS AppSync Logo", "description": "AWS AppSync service logo component with official brand colors" }, { "name": "aws-athena", "type": "registry:ui", "title": "Amazon Athena Logo", "description": "Amazon Athena service logo component with official brand colors" }, { "name": "aws-bedrock", "type": "registry:ui", "title": "Amazon Bedrock Logo", "description": "Amazon Bedrock service logo component with official brand colors" }, { "name": "aws-cloudformation", "type": "registry:ui", "title": "AWS CloudFormation Logo", "description": "AWS CloudFormation service logo component with official brand colors" }, { "name": "aws-cloudfront", "type": "registry:ui", "title": "Amazon CloudFront Logo", "description": "Amazon CloudFront service logo component with official brand colors" }, { "name": "aws-cloudwatch", "type": "registry:ui", "title": "Amazon CloudWatch Logo", "description": "Amazon CloudWatch service logo component with official brand colors" }, { "name": "aws-codebuild", "type": "registry:ui", "title": "AWS CodeBuild Logo", "description": "AWS CodeBuild service logo component with official brand colors" }, { "name": "aws-codecommit", "type": "registry:ui", "title": "AWS CodeCommit Logo", "description": "AWS CodeCommit service logo component with official brand colors" }, { "name": "aws-codedeploy", "type": "registry:ui", "title": "AWS CodeDeploy Logo", "description": "AWS CodeDeploy service logo component with official brand colors" }, { "name": "aws-codepipeline", "type": "registry:ui", "title": "AWS CodePipeline Logo", "description": "AWS CodePipeline service logo component with official brand colors" }, { "name": "aws-cognito", "type": "registry:ui", "title": "Amazon Cognito Logo", "description": "Amazon Cognito service logo component with official brand colors" }, { "name": "aws-compute", "type": "registry:block", "title": "AWS Compute", "description": "AWS compute service logos" }, { "name": "aws-database", "type": "registry:block", "title": "AWS Database", "description": "AWS database service logos" }, { "name": "aws-devtools", "type": "registry:block", "title": "AWS Developer Tools", "description": "AWS developer tool logos" }, { "name": "aws-dynamodb", "type": "registry:ui", "title": "Amazon DynamoDB Logo", "description": "Amazon DynamoDB service logo component with official brand colors" }, { "name": "aws-ec2", "type": "registry:ui", "title": "Amazon EC2 Logo", "description": "Amazon EC2 service logo component with official brand colors" }, { "name": "aws-ecs", "type": "registry:ui", "title": "Amazon ECS Logo", "description": "Amazon ECS service logo component with official brand colors" }, { "name": "aws-eks", "type": "registry:ui", "title": "Amazon EKS Logo", "description": "Amazon EKS service logo component with official brand colors" }, { "name": "aws-elastic-beanstalk", "type": "registry:ui", "title": "AWS Elastic Beanstalk Logo", "description": "AWS Elastic Beanstalk service logo component with official brand colors" }, { "name": "aws-eventbridge", "type": "registry:ui", "title": "Amazon EventBridge Logo", "description": "Amazon EventBridge service logo component with official brand colors" }, { "name": "aws-fargate", "type": "registry:ui", "title": "AWS Fargate Logo", "description": "AWS Fargate service logo component with official brand colors" }, { "name": "aws-glue", "type": "registry:ui", "title": "AWS Glue Logo", "description": "AWS Glue service logo component with official brand colors" }, { "name": "aws-iam", "type": "registry:ui", "title": "AWS IAM Logo", "description": "AWS IAM service logo component with official brand colors" }, { "name": "aws-kinesis", "type": "registry:ui", "title": "Amazon Kinesis Logo", "description": "Amazon Kinesis service logo component with official brand colors" }, { "name": "aws-kms", "type": "registry:ui", "title": "AWS KMS Logo", "description": "AWS KMS service logo component with official brand colors" }, { "name": "aws-lambda", "type": "registry:ui", "title": "AWS Lambda Logo", "description": "AWS Lambda service logo component with official brand colors" }, { "name": "aws-logo", "type": "registry:ui", "title": "AWS Logo", "description": "AWS logo component with brand orange and white" }, { "name": "aws-messaging", "type": "registry:block", "title": "AWS Messaging", "description": "AWS messaging service logos" }, { "name": "aws-ml", "type": "registry:block", "title": "AWS Machine Learning", "description": "AWS ML service logos" }, { "name": "aws-monitoring", "type": "registry:block", "title": "AWS Monitoring", "description": "AWS monitoring service logos" }, { "name": "aws-networking", "type": "registry:block", "title": "AWS Networking", "description": "AWS networking service logos" }, { "name": "aws-rds", "type": "registry:ui", "title": "Amazon RDS Logo", "description": "Amazon RDS service logo component with official brand colors" }, { "name": "aws-redshift", "type": "registry:ui", "title": "Amazon Redshift Logo", "description": "Amazon Redshift service logo component with official brand colors" }, { "name": "aws-route53", "type": "registry:ui", "title": "Amazon Route 53 Logo", "description": "Amazon Route 53 service logo component with official brand colors" }, { "name": "aws-s3", "type": "registry:ui", "title": "Amazon S3 Logo", "description": "Amazon S3 service logo component with official brand colors" }, { "name": "aws-sagemaker", "type": "registry:ui", "title": "Amazon SageMaker Logo", "description": "Amazon SageMaker service logo component with official brand colors" }, { "name": "aws-secrets-manager", "type": "registry:ui", "title": "AWS Secrets Manager Logo", "description": "AWS Secrets Manager service logo component with official brand colors" }, { "name": "aws-security", "type": "registry:block", "title": "AWS Security", "description": "AWS security service logos" }, { "name": "aws-serverless", "type": "registry:block", "title": "AWS Serverless", "description": "AWS serverless service logos" } ], "component_count": 359, "components_truncated": true, "component_types": { "registry:ui": 260, "registry:block": 96, "registry:lib": 2, "registry:hook": 1 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 52, "name": "@elevenlabs-ui", "category": "AI/chat UI", "tags": [ "ai" ], "tagline": "A collection of Open Source agent and audio components that you can customize and extend.", "short_description": "A collection of Open Source agent and audio components that you can customize and extend.", "description": "ElevenLabs UI is an open-source shadcn-compatible component library by ElevenLabs purpose-built for audio and AI agent applications. It ships orbs, waveform visualizers, voice-agent interfaces, audio players, and related interactive components. Installable via the official @elevenlabs/cli or via npx shadcn add. Requires Node 18+, shadcn/ui initialized, and Tailwind CSS. Built with React and Next.js. Free and MIT licensed. Use for: building AI voice agent UIs or conversational audio apps that need ready-made waveform and orb components tightly integrated with the ElevenLabs speech platform.", "homepage": "https://ui.elevenlabs.io", "docs": "https://ui.elevenlabs.io/docs", "github": "https://github.com/elevenlabs/ui", "components_github": null, "github_default_branch": "main", "github_stars": 2304, "last_commit": "2026-05-15T22:09:08Z", "archived": false, "license": "MIT", "open_issues": 25, "registry_template": "https://ui.elevenlabs.io/r/{name}.json", "registry_index": null, "components": [], "component_items": [], "component_count": null, "components_truncated": false, "component_types": {}, "has_logo": true, "enrichment_errors": [ "registry_index_unresolved" ], "featured": true }, { "number": 53, "name": "@emerald-ui", "category": "Animated components", "tags": [ "aesthetic" ], "tagline": "Emerald UI - collection of components built with Motion, GSAP, Tailwind CSS and shadcn/ui.", "short_description": "Emerald UI - collection of components built with Motion, GSAP, Tailwind CSS and shadcn/ui.", "description": "Emerald UI is a dual-purpose platform combining an inspirational website-design gallery with a CLI-installable shadcn component registry. Motion (Framer Motion) components include 3D marquee, animated dropdown, animated input, animated number, buttons, cards, flip-card, tooltip-cat, footer, gradient file upload, hero, parallax image, pricing, subscribe input, and text animations. GSAP components add color text reveal, fancy text hover, interactive team, link hover, magnetic effect, and scroll text reveal variants. The gallery uses Payload CMS v3, Supabase auth, and Cloudflare R2. Built on Next.js + React 19, Tailwind CSS v4. Free, MIT licensed. Use for: sourcing GSAP and Framer Motion-powered interactive components for high-motion marketing or portfolio sites, or browsing curated site designs for creative inspiration.", "homepage": "https://emerald-ui.com", "docs": "https://emerald-ui.com/docs", "github": "https://github.com/Shatlyk1011/emerald-ui", "components_github": "https://github.com/Shatlyk1011/emerald-ui/tree/main/src/registry", "github_default_branch": "main", "github_stars": 5, "last_commit": "2026-06-28T14:56:09Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://emerald-ui.com/r/{name}.json", "registry_index": null, "components": [], "component_items": [], "component_count": null, "components_truncated": false, "component_types": {}, "has_logo": true, "enrichment_errors": [ "registry_index_unresolved" ], "featured": false }, { "number": 62, "name": "@ericts", "category": "Uncategorized", "tags": [], "tagline": "Motion-focused shadcn-compatible components, hooks, and blocks for polished React interfaces.", "short_description": "", "description": "Motion-focused shadcn-compatible components, hooks, and blocks for polished React interfaces.", "homepage": "https://ui.ericts.com", "docs": "https://ui.ericts.com/docs", "github": "https://github.com/EricTsai83/ericts-ui", "components_github": "https://github.com/EricTsai83/ericts-ui/tree/main/registry", "github_default_branch": "main", "github_stars": 3, "last_commit": "2026-07-04T18:01:07Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://ui.ericts.com/r/{name}.json", "registry_index": "https://ui.ericts.com/r/registry.json", "components": [ "smooth-height", "copy-button", "status-button", "status-badge", "floating-select", "expandable-toolbar", "check-animation", "jitter-animation", "squeeze-animation", "heartbeat-animation", "projected-shadow-animation", "otp-input", "highlight-tabs", "expandable-tabs", "expanding-button", "navigation-menu", "text-morph", "expandable-modal", "context-cursor", "feedback-popover", "multi-step", "adaptive-drawer", "staggered-entrance", "use-reduced-motion", "use-element-height", "use-element-size-map", "use-scroll-anchor" ], "component_items": [ { "name": "smooth-height", "type": "registry:ui", "title": "Smooth Height Layout", "description": "A Motion-powered layout primitive that observes content size and animates height changes." }, { "name": "copy-button", "type": "registry:ui", "title": "Copy Button", "description": "A shadcn Button-based clipboard control with animated copy and success states." }, { "name": "status-button", "type": "registry:ui", "title": "Status Button", "description": "A shadcn Button-based action that transitions through idle, loading, and success states." }, { "name": "status-badge", "type": "registry:ui", "title": "Status Badge", "description": "A compact animated badge for status labels with icon and text slot transitions." }, { "name": "floating-select", "type": "registry:ui", "title": "Floating Select", "description": "A single-button floating select that expands into an animated option list." }, { "name": "expandable-toolbar", "type": "registry:ui", "title": "Expandable Toolbar", "description": "A controlled or uncontrolled toolbar primitive that measures its action slot and expands from either side." }, { "name": "check-animation", "type": "registry:ui", "title": "Check Animation", "description": "A pure SVG checkmark animation that draws a square or circle before the check." }, { "name": "jitter-animation", "type": "registry:ui", "title": "Jitter Animation", "description": "A jitter animation primitive plus a ready-made vibration icon." }, { "name": "squeeze-animation", "type": "registry:ui", "title": "Squeeze Animation", "description": "A squeeze animation primitive plus a ready-made SVG card icon." }, { "name": "heartbeat-animation", "type": "registry:ui", "title": "Heartbeat Animation", "description": "A Motion-powered heartbeat primitive with a projected shadow layer and reduced-motion support." }, { "name": "projected-shadow-animation", "type": "registry:ui", "title": "Projected Shadow Animation", "description": "A CSS-powered primitive that layers an element with projected and contact shadows, then gathers them on hover or active state." }, { "name": "otp-input", "type": "registry:ui", "title": "OTP Input", "description": "A fixed-slot one-time passcode input with paste, autofill, error shake, and animated success feedback." }, { "name": "highlight-tabs", "type": "registry:ui", "title": "Highlight Tabs", "description": "A Motion-powered tab list with a shared highlight indicator and keyboard navigation." }, { "name": "expandable-tabs", "type": "registry:ui", "title": "Expandable Tabs", "description": "A DynamicIsland-style toolbar whose icon tabs expand into actionable menu or content panels, with full keyboard and ARIA support." }, { "name": "expanding-button", "type": "registry:ui", "title": "Expanding Button", "description": "A compact icon button that morphs — growing in width and height from its corner — into a floating panel holding arbitrary content. The transformation is the po…" }, { "name": "navigation-menu", "type": "registry:ui", "title": "Navigation Menu", "description": "A Base UI navigation menu with centered popups, animated viewport sizing, and shadcn-style composition." }, { "name": "text-morph", "type": "registry:ui", "title": "Morphing Text", "description": "A Motion-powered text primitive that morphs matching characters between string updates." }, { "name": "expandable-modal", "type": "registry:ui", "title": "Expandable Dialog", "description": "A shared-layout dialog that expands list items into an accessible detail view." }, { "name": "context-cursor", "type": "registry:ui", "title": "Context Cursor", "description": "A scoped custom cursor for pointer-rich surfaces where each target can register its own label, icon, and interaction intent." }, { "name": "feedback-popover", "type": "registry:ui", "title": "Feedback Popover", "description": "A Motion-powered feedback popover that expands from a trigger, supports keyboard submission, and confirms receipt inline." }, { "name": "multi-step", "type": "registry:ui", "title": "Multi-Step Flow", "description": "A Motion-powered multi-step container that slides between steps and animates height changes." }, { "name": "adaptive-drawer", "type": "registry:ui", "title": "Adaptive Drawer", "description": "A shadcn Drawer that measures panel content and animates height changes." }, { "name": "staggered-entrance", "type": "registry:ui", "title": "Staggered List", "description": "A CSS-powered staggered entrance primitive for lists, cards, steps, rows, and search results." }, { "name": "use-reduced-motion", "type": "registry:hook", "title": "useReducedMotion", "description": "A client-safe React hook for reading prefers-reduced-motion and reacting to preference changes." }, { "name": "use-element-height", "type": "registry:hook", "title": "useElementHeight", "description": "A client-safe React hook that measures an element's height with ResizeObserver so a container can animate between content heights." }, { "name": "use-element-size-map", "type": "registry:hook", "title": "useElementSizeMap", "description": "A client-safe React hook that measures multiple keyed element sizes with ResizeObserver so animated shells can morph to active content." }, { "name": "use-scroll-anchor", "type": "registry:hook", "title": "useScrollAnchor", "description": "A client-safe React hook that parks a selected item at a fixed anchor point in a scroll container, with a configurable easing and duration — the click-to-scrol…" } ], "component_count": 27, "components_truncated": false, "component_types": { "registry:ui": 23, "registry:hook": 4 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 63, "name": "@evex", "category": "Uncategorized", "tags": [], "tagline": "Installable AI agent recipes for Eve apps, including PR review, data analysis, and workflow automation agents.", "short_description": "", "description": "Installable AI agent recipes for Eve apps, including PR review, data analysis, and workflow automation agents.", "homepage": "https://evex.sh", "docs": "https://evex.sh/docs", "github": "https://github.com/TommyBez/evex", "components_github": "https://github.com/TommyBez/evex/tree/main/registry", "github_default_branch": "main", "github_stars": 17, "last_commit": "2026-07-05T12:52:55Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://evex.sh/r/{name}.json", "registry_index": "https://evex.sh/r/registry.json", "components": [ "brand-visual-asset-generator", "branded-seo-page-builder", "code-reviewer", "eve-agent-builder", "linear-operations-agent", "openui-assistant", "postgres-data-analyst", "programmatic-seo-agent", "supabase-data-analyst", "x-draft-assistant", "x-hot-topic-digest" ], "component_items": [ { "name": "brand-visual-asset-generator", "type": "registry:item", "title": "Brand Visual Asset Generator", "description": "Generate brand-aligned SVG asset packs for SaaS products using Context.dev brand extraction and a Quiver Arrow SVG tool." }, { "name": "branded-seo-page-builder", "type": "registry:item", "title": "Branded SEO Page Builder", "description": "Generate an on-brand, SEO-optimized HTML page from a domain using Context.dev brand, content, and styleguide data." }, { "name": "code-reviewer", "type": "registry:item", "title": "Code Reviewer", "description": "Review GitHub pull requests from a native GitHub App channel. Mention `@code-reviewer` on a pull request to publish a GitHub review with inline comments, optio…" }, { "name": "eve-agent-builder", "type": "registry:item", "title": "Eve Agent Builder", "description": "An Eve coding agent that creates Eve agents, runs their checks, deploys them to Vercel, and verifies the live routes." }, { "name": "linear-operations-agent", "type": "registry:item", "title": "Linear Operations Agent", "description": "An Eve agent for Linear operations across Linear, Slack, and scheduled runs." }, { "name": "openui-assistant", "type": "registry:item", "title": "OpenUI Assistant", "description": "An Eve agent that streams OpenUI Lang generative UI using the official openuiChatLibrary, with demo weather, stock, and search tools from the openui-chat examp…" }, { "name": "postgres-data-analyst", "type": "registry:item", "title": "Postgres Data Analyst", "description": "An Eve-native Slack analyst for a single Postgres database. It answers Slack mentions and DMs, inspects schema metadata, and runs bounded read-only SQL through…" }, { "name": "programmatic-seo-agent", "type": "registry:item", "title": "Programmatic SEO Agent", "description": "Weekly scheduled agent that grows a product's organic traffic with programmatic SEO: it checks the product's GitHub repository out into its sandbox, discovers …" }, { "name": "supabase-data-analyst", "type": "registry:item", "title": "Supabase Data Analyst", "description": "A Slack-native Eve analyst for a single Supabase project that only runs read-only SQL queries. It exposes just supabase__list_tables and supabase__execute_sql …" }, { "name": "x-draft-assistant", "type": "registry:item", "title": "X Draft Assistant", "description": "A scheduled Eve agent that scans a configured set of X (Twitter) profiles every day, surfaces hot topics from their recent posts, researches each topic with th…" }, { "name": "x-hot-topic-digest", "type": "registry:item", "title": "X Hot Topic Digest", "description": "A scheduled Eve agent that scans a configured set of X (Twitter) profiles every day, surfaces hot topics from their recent posts, researches each topic with th…" } ], "component_count": 11, "components_truncated": false, "component_types": { "registry:item": 11 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 54, "name": "@evilbuttons", "category": "Animated components", "tags": [ "aesthetic" ], "tagline": "A shadcn/ui registry featuring a collection of animated buttons built with Motion. Each component is designed to add punchy, interactive feedback to your UI with minimal setup.", "short_description": "A shadcn/ui registry featuring a collection of animated buttons built with Motion. Each component is designed to add punchy, interactive feedback to your UI with minimal setup.", "description": "Evil Buttons is a focused shadcn registry of ~18 Motion-powered (motion.dev) animated button and interactive components. Named variants include aqua-button, brutal-button, chrome-button, click-powerup, command-button, copy-button, dither-button, evil-eye-button, frame-button, glitch-button, grid-button, highlight-button, minimal-button, movie-pass, reveal-button, shiny-button, sticky-button, and troll-button. Each is installable via npx shadcn add @evilbuttons/. Built with React, Tailwind CSS, and TypeScript; dark mode ready. Free, MIT licensed. Use for: injecting punchy, motion-driven button interactions into an existing shadcn/ui project with minimal setup and zero design from scratch.", "homepage": "https://evilbuttons.radiumcoders.com/docs", "docs": "https://evilbuttons.radiumcoders.com/docs", "github": "https://github.com/radiumcoders/evil-buttons", "components_github": "https://github.com/radiumcoders/evil-buttons/tree/main/components", "github_default_branch": "main", "github_stars": 66, "last_commit": "2026-07-02T16:39:25Z", "archived": false, "license": "Apache-2.0", "open_issues": 0, "registry_template": "https://evilbuttons.radiumcoders.com/r/{name}.json", "registry_index": "https://evilbuttons.radiumcoders.com/r/index.json", "components": [ "click-powerup", "sticky", "shiny-button", "movie-pass", "minimal", "grid-button", "dither-button", "evil-eye-button", "troll-button", "chrome-button", "brutal-button", "aqua-button", "3d-button", "frame-button", "highlight-button", "glitch-button", "command-button", "copy-button", "reveal-button", "demonic-button", "hold-button", "captcha-button", "doubt-button", "slide-to-detonate", "morph-status-button", "cooldown-button", "pill-button", "confetti-button", "hold-confirm-button" ], "component_items": [ { "name": "click-powerup", "type": "registry:ui", "title": "ClickPowerUp", "description": "An animated button wrapper with corner brackets, patterned fill, and tap feedback." }, { "name": "sticky", "type": "registry:ui", "title": "StickyButton", "description": "A magnetic button that follows cursor movement with spring physics." }, { "name": "shiny-button", "type": "registry:ui", "title": "ShinyButton", "description": "A glossy, gradient-styled button with a layered inner glow and press feedback." }, { "name": "movie-pass", "type": "registry:ui", "title": "MoviePassButton", "description": "A ticket-style button like a cinema stub." }, { "name": "minimal", "type": "registry:ui", "title": "MinimalButton", "description": "A sleek, minimal button with a subtle repeating linear gradient pattern." }, { "name": "grid-button", "type": "registry:ui", "title": "GridButton", "description": "A retro-styled button with a pixelated grid icon and tactile press feedback." }, { "name": "dither-button", "type": "registry:ui", "title": "DitherButton", "description": "A button with an animated 4x4 ordered-dither wave background and a knockout label." }, { "name": "evil-eye-button", "type": "registry:ui", "title": "EvilEyeButton", "description": "A button with a React Bits evil eye shader background and a fiery readable label." }, { "name": "troll-button", "type": "registry:ui", "title": "TrollButton", "description": "A button that flees from the user's cursor." }, { "name": "chrome-button", "type": "registry:ui", "title": "ChromeButton", "description": "A button with an animated liquid chrome background." }, { "name": "brutal-button", "type": "registry:ui", "title": "BrutalButton", "description": "A NeoBrutalism style button with sharp shadows and stark borders." }, { "name": "aqua-button", "type": "registry:ui", "title": "AquaButton", "description": "A glossy pill button inspired by Apple's Aqua interface, with layered highlights and a soft inner glow." }, { "name": "3d-button", "type": "registry:ui", "title": "ThreeDButton", "description": "A minimal 3D button with a clean deck-style press and sliding click sheen." }, { "name": "frame-button", "type": "registry:ui", "title": "FrameButton", "description": "A futuristic button with animated corner frames and tactile motion interactions." }, { "name": "highlight-button", "type": "registry:ui", "title": "HighlightButton", "description": "A button with a mouse-following highlight that darkens light surfaces and expands on click." }, { "name": "glitch-button", "type": "registry:ui", "title": "GlitchButton", "description": "A button with randomized RGB-split glitch bursts, a scanline overlay, and a flickering label." }, { "name": "command-button", "type": "registry:ui", "title": "CommandButton", "description": "A button that binds a keyboard shortcut globally and pulses with a subtle flash animation when the shortcut fires." }, { "name": "copy-button", "type": "registry:ui", "title": "CopyButton", "description": "A button that copies a value to the clipboard and transitions through idle, copied, and error states with animated icon swaps." }, { "name": "reveal-button", "type": "registry:ui", "title": "RevealButton", "description": "A button that reveals a hidden secret value on hold or toggle, with a blur-in animation and an eye icon indicator." }, { "name": "demonic-button", "type": "registry:ui", "title": "DemonicButton", "description": "A hold-to-charge button: keep pressing to slowly strain the devil horns out while it trembles, spits embers, and flashes between black and blood-red like a fil…" }, { "name": "hold-button", "type": "registry:ui", "title": "HoldButton", "description": "A hold-to-confirm button whose inner fill grows from 0 to 100%; release early to shake and abort, hold to the end to fire the action." }, { "name": "captcha-button", "type": "registry:ui", "title": "CaptchaButton", "description": "A button that makes you pass an absurd 'select all the evil' emoji captcha before the real action fires." }, { "name": "doubt-button", "type": "registry:ui", "title": "DoubtButton", "description": "An escalating-confirmation button that makes you click through increasingly absurd, guilt-tripping prompts before the real action finally fires." }, { "name": "slide-to-detonate", "type": "registry:ui", "title": "SlideToDetonate", "description": "A slide-to-confirm safety gate that makes you drag a handle across a fuse before the real action detonates." }, { "name": "morph-status-button", "type": "registry:ui", "title": "MorphStatusButton", "description": "A single button that morphs through idle, loading, success, and error states in place, with no layout shift." }, { "name": "cooldown-button", "type": "registry:ui", "title": "CooldownButton", "description": "A button that locks itself behind a draining radial timer after each click to stop spam and double-submits, taunting you while you wait." }, { "name": "pill-button", "type": "registry:ui", "title": "PillButton", "description": "A compact pill toggle that slides between two labeled faces with a rolling hover label animation." }, { "name": "confetti-button", "type": "registry:ui", "title": "ConfettiButton", "description": "A plain shadcn button that pops on click and fires a confetti celebration burst." }, { "name": "hold-confirm-button", "type": "registry:ui", "title": "HoldConfirmButton", "description": "A hold-to-confirm pill button that shrinks while pressed and draws a circular progress ring around it using Motion styleEffect and svgEffect." } ], "component_count": 29, "components_truncated": false, "component_types": { "registry:ui": 29 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 55, "name": "@evilcharts", "category": "Charts/data viz", "tags": [ "dashboard" ], "tagline": "EvilCharts is an open-source chart UI website built with shadcn and Recharts, beautifully designed and handcrafted.", "short_description": "EvilCharts is an open-source chart UI website built with shadcn and Recharts, beautifully designed and handcrafted.", "description": "EvilCharts is an open-source chart UI library built on shadcn/ui and Recharts. It provides handcrafted, visually styled chart components across eight types: area, line, bar, composed, radar, pie, radial, and Sankey charts. The docs site also ships UI utilities including a background component, tooltip, and legend, plus a chart-config system for consistent theming. Free and MIT licensed, distributed via the shadcn registry. Use for: adding Recharts-powered charts with opinionated, on-brand styling to a shadcn/ui project when the default shadcn chart appearance needs more visual polish without writing custom Recharts configuration from scratch.", "homepage": "https://evilcharts.com", "docs": "https://evilcharts.com/docs", "github": "https://github.com/legions-developer/evilcharts", "components_github": "https://github.com/legions-developer/evilcharts/tree/main/src/registry", "github_default_branch": "main", "github_stars": 2554, "last_commit": "2026-05-21T19:26:43Z", "archived": false, "license": "MIT", "open_issues": 2, "registry_template": "https://evilcharts.com/r/{name}.json", "registry_index": "https://evilcharts.com/r/registry.json", "components": [ "chart", "tooltip", "legend", "dot", "evil-brush", "background", "area-chart", "line-chart", "bar-chart", "composed-chart", "pie-chart", "radial-chart", "radar-chart", "sankey-chart", "ex-area-chart", "ex-gradient-colors-area-chart", "ex-gradient-colors-bump-area-chart", "ex-loading-state-area-chart", "ex-default-type-area-chart", "ex-stacked-type-area-chart", "ex-expanded-type-area-chart", "ex-bump-curve-type-area-chart", "ex-step-curve-type-area-chart", "ex-monotoney-curve-type-area-chart", "ex-solid-stroke-area-chart", "ex-dashed-stroke-area-chart", "ex-animated-dashed-stroke-area-chart", "ex-gradient-area-variant-area-chart", "ex-gradient-reverse-area-variant-area-chart", "ex-solid-area-variant-area-chart", "ex-dotted-area-variant-area-chart", "ex-lines-area-variant-area-chart", "ex-hatched-area-variant-area-chart", "ex-line-chart", "ex-gradient-colors-line-chart", "ex-gradient-colors-bump-line-chart", "ex-loading-state-line-chart", "ex-bump-curve-type-line-chart", "ex-step-curve-type-line-chart", "ex-monotoney-curve-type-line-chart", "ex-solid-stroke-line-chart", "ex-dashed-stroke-line-chart", "ex-animated-dashed-stroke-line-chart", "ex-glowing-desktop-line-chart", "ex-glowing-mobile-line-chart", "ex-buffer-line-chart", "ex-bg-dots-line-chart", "ex-bg-grid-line-chart", "ex-bg-cross-hatch-line-chart", "ex-bg-diagonal-lines-line-chart", "ex-bg-plus-line-chart", "ex-bg-falling-triangles-line-chart", "ex-bg-4-pointed-star-line-chart", "ex-bg-tiny-checkers-line-chart", "ex-bg-overlapping-circles-line-chart", "ex-bg-wiggle-lines-line-chart", "ex-bg-bubbles-line-chart", "ex-buffer-bar-chart", "ex-bar-chart", "ex-gradient-colors-bar-chart", "ex-loading-state-bar-chart", "ex-default-variant-bar-chart", "ex-hatched-variant-bar-chart", "ex-duotone-variant-bar-chart", "ex-duotone-reverse-variant-bar-chart", "ex-gradient-variant-bar-chart", "ex-stripped-variant-bar-chart", "ex-stacked-type-bar-chart", "ex-percent-type-bar-chart", "ex-horizontal-layout-bar-chart", "ex-hover-highlight-bar-chart", "ex-glowing-desktop-bar-chart", "ex-glowing-mobile-bar-chart", "ex-composed-chart", "ex-gradient-colors-composed-chart", "ex-loading-state-composed-chart", "ex-hatched-variant-composed-chart", "ex-duotone-variant-composed-chart", "ex-gradient-variant-composed-chart", "ex-stripped-variant-composed-chart", "ex-dashed-stroke-composed-chart", "ex-animated-dashed-stroke-composed-chart", "ex-bump-curve-composed-chart", "ex-dots-composed-chart", "ex-hover-highlight-composed-chart", "ex-glowing-composed-chart", "ex-pie-chart", "ex-gradient-colors-pie-chart", "ex-donut-pie-chart", "ex-padded-pie-chart", "ex-overlapping-padded-pie-chart", "ex-labels-pie-chart", "ex-loading-state-pie-chart", "ex-glowing-pie-chart", "ex-radial-chart", "ex-semi-variant-radial-chart", "ex-gradient-colors-radial-chart", "ex-loading-state-radial-chart", "ex-glowing-radial-chart", "ex-radar-chart" ], "component_items": [ { "name": "chart", "type": "registry:component", "title": null, "description": null }, { "name": "tooltip", "type": "registry:component", "title": null, "description": null }, { "name": "legend", "type": "registry:component", "title": null, "description": null }, { "name": "dot", "type": "registry:component", "title": null, "description": null }, { "name": "evil-brush", "type": "registry:component", "title": null, "description": null }, { "name": "background", "type": "registry:component", "title": null, "description": null }, { "name": "area-chart", "type": "registry:component", "title": null, "description": "Area chart component" }, { "name": "line-chart", "type": "registry:component", "title": null, "description": "Line chart component" }, { "name": "bar-chart", "type": "registry:component", "title": null, "description": "Bar chart component" }, { "name": "composed-chart", "type": "registry:component", "title": null, "description": "Composed chart component combining bar and line charts" }, { "name": "pie-chart", "type": "registry:component", "title": null, "description": "Pie chart component with donut, gradient, and glow effects" }, { "name": "radial-chart", "type": "registry:component", "title": null, "description": "Radial bar chart component with full and semi-circle variants" }, { "name": "radar-chart", "type": "registry:component", "title": null, "description": "Radar chart component with filled and lines variants" }, { "name": "sankey-chart", "type": "registry:component", "title": null, "description": "Sankey chart component for visualizing flow data with nodes and links" }, { "name": "ex-area-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-gradient-colors-area-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-gradient-colors-bump-area-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-loading-state-area-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-default-type-area-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-stacked-type-area-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-expanded-type-area-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-bump-curve-type-area-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-step-curve-type-area-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-monotoney-curve-type-area-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-solid-stroke-area-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-dashed-stroke-area-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-animated-dashed-stroke-area-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-gradient-area-variant-area-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-gradient-reverse-area-variant-area-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-solid-area-variant-area-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-dotted-area-variant-area-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-lines-area-variant-area-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-hatched-area-variant-area-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-line-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-gradient-colors-line-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-gradient-colors-bump-line-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-loading-state-line-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-bump-curve-type-line-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-step-curve-type-line-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-monotoney-curve-type-line-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-solid-stroke-line-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-dashed-stroke-line-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-animated-dashed-stroke-line-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-glowing-desktop-line-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-glowing-mobile-line-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-buffer-line-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-bg-dots-line-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-bg-grid-line-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-bg-cross-hatch-line-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-bg-diagonal-lines-line-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-bg-plus-line-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-bg-falling-triangles-line-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-bg-4-pointed-star-line-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-bg-tiny-checkers-line-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-bg-overlapping-circles-line-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-bg-wiggle-lines-line-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-bg-bubbles-line-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-buffer-bar-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-bar-chart", "type": "registry:block", "title": null, "description": null }, { "name": "ex-gradient-colors-bar-chart", "type": "registry:block", "title": null, "description": null } ], "component_count": 129, "components_truncated": true, "component_types": { "registry:component": 14, "registry:block": 115 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 56, "name": "@exabase", "category": "Design system", "tags": [ "ai", "components" ], "tagline": "A collection of UI components based on the exaBase Design System, built with React and Tailwind CSS.", "short_description": "A collection of UI components based on the exaBase Design System, built with React and Tailwind CSS.", "description": "ExaBase Design is the official UI component collection from ExaWizards (a Japanese AI company), built as a shadcn-compatible registry. It covers a comprehensive set of ~50+ components organized into styles (colors, elevation, rounded) and components: accordion, alert, alert-dialog, aspect-ratio, autocomplete, avatar, badge, breadcrumb, button, button-group, calendar, card, carousel, checkbox, collapsible, combobox, command, context-menu, data-table, date-picker, dialog, drawer, dropdown-menu, empty, field, hover-card, input, input-group, input-otp, item, kbd, label, menubar, navigation-menu, pagination, popover, progress, radio-group, resizable, scroll-area, select, separator, sheet, sidebar, skeleton, slider, spinner, switch, table, tabs, textarea, toast, toggle, toggle-group, and tooltip. Built on Radix UI and Tailwind CSS v4. Use for: adopting a professionally maintained, enterprise-grade shadcn design system with a complete component set and documented theming tokens.", "homepage": "https://exawizards.com/exabase/design/", "docs": "https://exawizards.com/exabase/design/docs/", "github": "N/A", "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://exawizards.com/exabase/design/registry/{name}.json", "registry_index": "https://exawizards.com/exabase/design/registry/registry.json", "components": [ "base", "accordion", "alert", "alert-dialog", "aspect-ratio", "autocomplete", "avatar", "badge", "breadcrumb", "button", "button-group", "calendar", "card", "carousel", "chart", "checkbox", "collapsible", "combobox", "command", "context-menu", "dialog", "drawer", "dropdown-menu", "empty", "field", "hover-card", "icon", "input", "input-group", "input-otp", "item", "kbd", "label", "menubar", "navigation-menu", "pagination", "popover", "progress", "radio-group", "resizable", "scroll-area", "select", "separator", "sheet", "sidebar", "skeleton", "slider", "spinner", "switch", "table", "tabs", "textarea", "toast", "toggle", "toggle-group", "tooltip", "use-mobile", "utils", "font-inter", "font-noto-sans-jp", "fonts" ], "component_items": [ { "name": "base", "type": "registry:base", "title": null, "description": null }, { "name": "accordion", "type": "registry:ui", "title": null, "description": null }, { "name": "alert", "type": "registry:ui", "title": null, "description": null }, { "name": "alert-dialog", "type": "registry:ui", "title": null, "description": null }, { "name": "aspect-ratio", "type": "registry:ui", "title": null, "description": null }, { "name": "autocomplete", "type": "registry:ui", "title": null, "description": null }, { "name": "avatar", "type": "registry:ui", "title": null, "description": null }, { "name": "badge", "type": "registry:ui", "title": null, "description": null }, { "name": "breadcrumb", "type": "registry:ui", "title": null, "description": null }, { "name": "button", "type": "registry:ui", "title": null, "description": null }, { "name": "button-group", "type": "registry:ui", "title": null, "description": null }, { "name": "calendar", "type": "registry:ui", "title": null, "description": null }, { "name": "card", "type": "registry:ui", "title": null, "description": null }, { "name": "carousel", "type": "registry:ui", "title": null, "description": null }, { "name": "chart", "type": "registry:ui", "title": null, "description": null }, { "name": "checkbox", "type": "registry:ui", "title": null, "description": null }, { "name": "collapsible", "type": "registry:ui", "title": null, "description": null }, { "name": "combobox", "type": "registry:ui", "title": null, "description": null }, { "name": "command", "type": "registry:ui", "title": null, "description": null }, { "name": "context-menu", "type": "registry:ui", "title": null, "description": null }, { "name": "dialog", "type": "registry:ui", "title": null, "description": null }, { "name": "drawer", "type": "registry:ui", "title": null, "description": null }, { "name": "dropdown-menu", "type": "registry:ui", "title": null, "description": null }, { "name": "empty", "type": "registry:ui", "title": null, "description": null }, { "name": "field", "type": "registry:ui", "title": null, "description": null }, { "name": "hover-card", "type": "registry:ui", "title": null, "description": null }, { "name": "icon", "type": "registry:ui", "title": null, "description": null }, { "name": "input", "type": "registry:ui", "title": null, "description": null }, { "name": "input-group", "type": "registry:ui", "title": null, "description": null }, { "name": "input-otp", "type": "registry:ui", "title": null, "description": null }, { "name": "item", "type": "registry:ui", "title": null, "description": null }, { "name": "kbd", "type": "registry:ui", "title": null, "description": null }, { "name": "label", "type": "registry:ui", "title": null, "description": null }, { "name": "menubar", "type": "registry:ui", "title": null, "description": null }, { "name": "navigation-menu", "type": "registry:ui", "title": null, "description": null }, { "name": "pagination", "type": "registry:ui", "title": null, "description": null }, { "name": "popover", "type": "registry:ui", "title": null, "description": null }, { "name": "progress", "type": "registry:ui", "title": null, "description": null }, { "name": "radio-group", "type": "registry:ui", "title": null, "description": null }, { "name": "resizable", "type": "registry:ui", "title": null, "description": null }, { "name": "scroll-area", "type": "registry:ui", "title": null, "description": null }, { "name": "select", "type": "registry:ui", "title": null, "description": null }, { "name": "separator", "type": "registry:ui", "title": null, "description": null }, { "name": "sheet", "type": "registry:ui", "title": null, "description": null }, { "name": "sidebar", "type": "registry:ui", "title": null, "description": null }, { "name": "skeleton", "type": "registry:ui", "title": null, "description": null }, { "name": "slider", "type": "registry:ui", "title": null, "description": null }, { "name": "spinner", "type": "registry:ui", "title": null, "description": null }, { "name": "switch", "type": "registry:ui", "title": null, "description": null }, { "name": "table", "type": "registry:ui", "title": null, "description": null }, { "name": "tabs", "type": "registry:ui", "title": null, "description": null }, { "name": "textarea", "type": "registry:ui", "title": null, "description": null }, { "name": "toast", "type": "registry:ui", "title": null, "description": null }, { "name": "toggle", "type": "registry:ui", "title": null, "description": null }, { "name": "toggle-group", "type": "registry:ui", "title": null, "description": null }, { "name": "tooltip", "type": "registry:ui", "title": null, "description": null }, { "name": "use-mobile", "type": "registry:hook", "title": null, "description": null }, { "name": "utils", "type": "registry:lib", "title": null, "description": null }, { "name": "font-inter", "type": "registry:font", "title": "Inter", "description": null }, { "name": "font-noto-sans-jp", "type": "registry:font", "title": "Noto Sans JP", "description": null } ], "component_count": 61, "components_truncated": false, "component_types": { "registry:base": 1, "registry:ui": 56, "registry:hook": 1, "registry:lib": 1, "registry:font": 2 }, "has_logo": true, "enrichment_errors": [ "github_lookup_failed" ], "featured": false }, { "number": 67, "name": "@extend", "category": "Uncategorized", "tags": [], "tagline": "A collection of UI components for building document agents and human-in-the-loop review workflows.", "short_description": "", "description": "A collection of UI components for building document agents and human-in-the-loop review workflows.", "homepage": "https://ui.extend.ai", "docs": "https://ui.extend.ai/ui/docs", "github": "https://github.com/extend-hq/ui", "components_github": null, "github_default_branch": "main", "github_stars": 1271, "last_commit": "2026-07-07T19:20:08Z", "archived": false, "license": null, "open_issues": 6, "registry_template": "https://ui.extend.ai/r/{name}.json", "registry_index": "https://ui.extend.ai/r/registry.json", "components": [ "utils", "use-mobile", "accordion", "alert", "aspect-ratio", "autocomplete", "badge", "breadcrumb", "button", "card", "collapsible", "color-picker", "command", "dialog", "dropdown-menu", "input", "group", "kbd", "popover", "scroll-area", "select", "separator", "sheet", "sidebar", "skeleton", "sonner", "spinner", "tabs", "tooltip", "toggle", "resizable", "pdf-block-resizable-shell", "file-upload", "file-thumbnail", "file-system", "file-system-block", "pdf-viewer", "docx-viewer", "docx-editor", "xlsx-viewer", "xlsx-editor", "csv-viewer", "pdf-dropzone", "layout-blocks", "layout-blocks-block", "e-signature", "bounding-box-citations", "schema-builder", "bounding-box-citations-block", "document-splits", "document-splits-block", "excel-editor", "docx-editor-block", "document-viewer-sidebar" ], "component_items": [ { "name": "utils", "type": "registry:lib", "title": "Utils", "description": "Shared class name helper used by Extend UI registry components." }, { "name": "use-mobile", "type": "registry:hook", "title": "Use Mobile", "description": "A media query hook for mobile responsive UI." }, { "name": "accordion", "type": "registry:ui", "title": "Accordion", "description": "A vertically stacked set of expandable content panels." }, { "name": "alert", "type": "registry:ui", "title": "Alert", "description": "A callout for displaying contextual messages." }, { "name": "aspect-ratio", "type": "registry:ui", "title": "Aspect Ratio", "description": "A small wrapper for preserving media aspect ratios." }, { "name": "autocomplete", "type": "registry:ui", "title": "Autocomplete", "description": "An autocomplete input built on Base UI primitives." }, { "name": "badge", "type": "registry:ui", "title": "Badge", "description": "A compact label for status, metadata, and categorization." }, { "name": "breadcrumb", "type": "registry:ui", "title": "Breadcrumb", "description": "Navigation breadcrumbs for page hierarchy." }, { "name": "button", "type": "registry:ui", "title": "Button", "description": "A polymorphic button primitive with variants, sizes, and loading state." }, { "name": "card", "type": "registry:ui", "title": "Card", "description": "A flexible container primitive for grouped content." }, { "name": "collapsible", "type": "registry:ui", "title": "Collapsible", "description": "A disclosure primitive for expandable content." }, { "name": "color-picker", "type": "registry:ui", "title": "Color Picker", "description": "A compact popover color picker with hex, RGB, CSS, and HSL input formats." }, { "name": "command", "type": "registry:ui", "title": "Command", "description": "A command menu surface powered by cmdk." }, { "name": "dialog", "type": "registry:ui", "title": "Dialog", "description": "An accessible modal dialog built on Base UI." }, { "name": "dropdown-menu", "type": "registry:ui", "title": "Dropdown Menu", "description": "A dropdown menu built on Base UI menu primitives." }, { "name": "input", "type": "registry:ui", "title": "Input", "description": "A styled text input built on Base UI." }, { "name": "group", "type": "registry:ui", "title": "Group", "description": "A connected control group primitive for buttons, inputs, separators, and text addons." }, { "name": "kbd", "type": "registry:ui", "title": "Kbd", "description": "A keyboard shortcut display primitive." }, { "name": "popover", "type": "registry:ui", "title": "Popover", "description": "A floating popover built on Base UI." }, { "name": "scroll-area", "type": "registry:ui", "title": "Scroll Area", "description": "A custom scroll area built on Base UI." }, { "name": "select", "type": "registry:ui", "title": "Select", "description": "A select control built on Base UI." }, { "name": "separator", "type": "registry:ui", "title": "Separator", "description": "A visual separator built on Base UI." }, { "name": "sheet", "type": "registry:ui", "title": "Sheet", "description": "A side sheet built on Base UI dialog primitives." }, { "name": "sidebar", "type": "registry:ui", "title": "Sidebar", "description": "A responsive application sidebar with menu, rail, and provider primitives." }, { "name": "skeleton", "type": "registry:ui", "title": "Skeleton", "description": "A loading placeholder with shimmer animation." }, { "name": "sonner", "type": "registry:ui", "title": "Sonner", "description": "A themed toast provider for Sonner." }, { "name": "spinner", "type": "registry:ui", "title": "Spinner", "description": "A compact loading spinner using Hugeicons." }, { "name": "tabs", "type": "registry:ui", "title": "Tabs", "description": "A tabs primitive built on Base UI." }, { "name": "tooltip", "type": "registry:ui", "title": "Tooltip", "description": "A tooltip primitive built on Base UI." }, { "name": "toggle", "type": "registry:ui", "title": "Toggle", "description": "A two-state command button and grouped toggle controls." }, { "name": "resizable", "type": "registry:ui", "title": "Resizable", "description": "Resizable panel primitives using react-resizable-panels." }, { "name": "pdf-block-resizable-shell", "type": "registry:component", "title": "PDF Block Resizable Shell", "description": "A reusable resizable left document viewer and right review panel shell for PDF-style blocks." }, { "name": "file-upload", "type": "registry:ui", "title": "File Upload", "description": "A drag-and-drop file upload surface with accepted file type icons and a compact file list." }, { "name": "file-thumbnail", "type": "registry:ui", "title": "File Thumbnail", "description": "A compact file preview thumbnail shell for externally generated images, loading states, and fallback states." }, { "name": "file-system", "type": "registry:ui", "title": "File System (Finder)", "description": "A macOS Finder-style file browser for flat object-store manifests with icon, list, column, and gallery views." }, { "name": "file-system-block", "type": "registry:block", "title": "File System (Finder)", "description": "A Finder-style file browser block that opens PDF, DOCX, XLSX, and image files in large viewer dialogs." }, { "name": "pdf-viewer", "type": "registry:ui", "title": "PDF Viewer", "description": "A PDF viewer with page virtualization, thumbnails, search, zoom, rotation, upload, and page overlay hooks." }, { "name": "docx-viewer", "type": "registry:ui", "title": "DOCX Viewer", "description": "A DOCX viewer with upload, zoom, theme controls, and read-only rendering." }, { "name": "docx-editor", "type": "registry:ui", "title": "DOCX Editor", "description": "An experimental DOCX editor with a Word-style toolbar, page thumbnails, import, export, and live document mutation." }, { "name": "xlsx-viewer", "type": "registry:ui", "title": "Excel Viewer", "description": "An XLSX viewer with workbook loading, thumbnails, sheet tabs, upload, zoom, and theme controls." }, { "name": "xlsx-editor", "type": "registry:ui", "title": "Excel Editor", "description": "An experimental XLSX editor with formula input, undo and redo, sheet controls, export, and live workbook mutation." }, { "name": "csv-viewer", "type": "registry:ui", "title": "CSV Viewer", "description": "A CSV and TSV viewer with parsing, upload, search, zoom, theme-aware grid rendering, and Glide Data Grid." }, { "name": "pdf-dropzone", "type": "registry:block", "title": "PDF Dropzone", "description": "A PDF-only upload dropzone that opens the dropped file in the shared PDF viewer." }, { "name": "layout-blocks", "type": "registry:ui", "title": "Layout Blocks", "description": "A structured layout review panel with typed blocks and confidence cards." }, { "name": "layout-blocks-block", "type": "registry:block", "title": "Layout Blocks", "description": "A structured layout review block with confidence cards and PDF region overlays." }, { "name": "e-signature", "type": "registry:block", "title": "E-Signature", "description": "A PDF signature review block with field overlays and signing actions." }, { "name": "bounding-box-citations", "type": "registry:ui", "title": "Bounding Box Citations", "description": "An extraction citation panel connected to source bounding boxes and editable values." }, { "name": "schema-builder", "type": "registry:ui", "title": "Schema Builder", "description": "A JSON schema builder with form and JSON views for extraction schemas." }, { "name": "bounding-box-citations-block", "type": "registry:block", "title": "Bounding Box Citations", "description": "An extraction citation block linked to source PDF bounding boxes." }, { "name": "document-splits", "type": "registry:ui", "title": "Document Splits", "description": "A split-group review panel for organizing pages into output documents." }, { "name": "document-splits-block", "type": "registry:block", "title": "Document Splits", "description": "A split-group review block for organizing PDF pages into output documents." }, { "name": "excel-editor", "type": "registry:block", "title": "Excel Editor", "description": "A full Excel editor block with workbook upload, cell formatting, merge tools, sheets, zoom, and export controls." }, { "name": "docx-editor-block", "type": "registry:block", "title": "DOCX Editor", "description": "A full DOCX editor block with a Word-style toolbar, page thumbnails, and export controls." }, { "name": "document-viewer-sidebar", "type": "registry:ui", "title": "Document Viewer Sidebar", "description": "Shared thumbnail sidebar behavior for document viewers, including viewer-width responsive overlay and inline modes." } ], "component_count": 54, "components_truncated": false, "component_types": { "registry:lib": 1, "registry:hook": 1, "registry:ui": 43, "registry:component": 1, "registry:block": 8 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 57, "name": "@fab-ui", "category": "Component library (general)", "tags": [ "aesthetic", "components" ], "tagline": "A collection of beautifully designed UI components for building modern web applications.", "short_description": "A collection of beautifully designed UI components for building modern web applications.", "description": "Fab UI is a shadcn-compatible component registry built entirely on Base UI (headless, accessible primitives) rather than Radix UI, with Tailwind CSS v4 and React 19. Offers 39 components across four categories: Form (button, checkbox, checkbox-group, combobox, field, fieldset, form, input, input-group, label, number-field, radio, select, slider, switch, textarea, toggle), Overlay (alert-dialog, context-menu, dialog, dropdown-menu, popover, preview-card, tooltip), Layout (accordion, card, collapsible, scroll-area, separator, tabs, toolbar), and Data Display (avatar, badge, meter, progress). Special components include autocomplete, toggle-group, and two liquid-metal animated components (button and avatar) using Paper Design shaders. WCAG-compliant, copy-paste owned. Free, MIT licensed. Use for: building an accessible, Base UI-based component set with Tailwind v4 that bypasses Radix UI while still following the shadcn copy-paste ownership model.", "homepage": "https://fab-ui.com", "docs": "https://fab-ui.com/docs", "github": "https://github.com/triatetarta/fab-ui", "components_github": "https://github.com/triatetarta/fab-ui/tree/staging/registry", "github_default_branch": "staging", "github_stars": 53, "last_commit": "2026-07-07T12:01:33Z", "archived": false, "license": "MIT", "open_issues": 11, "registry_template": "https://fab-ui.com/r/{name}.json", "registry_index": "https://fab-ui.com/r/registry.json", "components": [ "accordion", "alert-dialog", "autocomplete", "avatar", "badge", "button", "card", "checkbox", "checkbox-group", "collapsible", "combobox", "context-menu", "dialog", "drawer", "dropdown-menu", "field", "fieldset", "form", "input", "input-group", "label", "liquid-metal-avatar", "liquid-metal-button", "liquid-metal-card", "mesh-gradient-card", "meter", "navigation-menu", "number-field", "popover", "hover-card", "progress", "radio-group", "scroll-area", "select", "separator", "slider", "switch", "tabs", "textarea", "toggle-group", "toggle", "toolbar", "tooltip", "utils" ], "component_items": [ { "name": "accordion", "type": "registry:ui", "title": "Accordion", "description": null }, { "name": "alert-dialog", "type": "registry:ui", "title": "Alert Dialog", "description": null }, { "name": "autocomplete", "type": "registry:ui", "title": "Autocomplete", "description": null }, { "name": "avatar", "type": "registry:ui", "title": "Avatar", "description": null }, { "name": "badge", "type": "registry:ui", "title": "Badge", "description": null }, { "name": "button", "type": "registry:ui", "title": "Button", "description": null }, { "name": "card", "type": "registry:ui", "title": "Card", "description": null }, { "name": "checkbox", "type": "registry:ui", "title": "Checkbox", "description": null }, { "name": "checkbox-group", "type": "registry:ui", "title": "Checkbox Group", "description": null }, { "name": "collapsible", "type": "registry:ui", "title": "Collapsible", "description": null }, { "name": "combobox", "type": "registry:ui", "title": "Combobox", "description": null }, { "name": "context-menu", "type": "registry:ui", "title": "Context Menu", "description": null }, { "name": "dialog", "type": "registry:ui", "title": "Dialog", "description": null }, { "name": "drawer", "type": "registry:ui", "title": "Drawer", "description": null }, { "name": "dropdown-menu", "type": "registry:ui", "title": "Dropdown Menu", "description": null }, { "name": "field", "type": "registry:ui", "title": "Field", "description": null }, { "name": "fieldset", "type": "registry:ui", "title": "Fieldset", "description": null }, { "name": "form", "type": "registry:ui", "title": "Form", "description": null }, { "name": "input", "type": "registry:ui", "title": "Input", "description": null }, { "name": "input-group", "type": "registry:ui", "title": "Input Group", "description": null }, { "name": "label", "type": "registry:ui", "title": "Label", "description": null }, { "name": "liquid-metal-avatar", "type": "registry:ui", "title": "Liquid Metal Avatar", "description": null }, { "name": "liquid-metal-button", "type": "registry:ui", "title": "Liquid Metal Button", "description": null }, { "name": "liquid-metal-card", "type": "registry:ui", "title": "Liquid Metal Card", "description": null }, { "name": "mesh-gradient-card", "type": "registry:ui", "title": "Mesh Gradient Card", "description": null }, { "name": "meter", "type": "registry:ui", "title": "Meter", "description": null }, { "name": "navigation-menu", "type": "registry:ui", "title": "Navigation Menu", "description": null }, { "name": "number-field", "type": "registry:ui", "title": "Number Field", "description": null }, { "name": "popover", "type": "registry:ui", "title": "Popover", "description": null }, { "name": "hover-card", "type": "registry:ui", "title": "Hover Card", "description": null }, { "name": "progress", "type": "registry:ui", "title": null, "description": null }, { "name": "radio-group", "type": "registry:ui", "title": "Radio Group", "description": null }, { "name": "scroll-area", "type": "registry:ui", "title": "Scroll Area", "description": null }, { "name": "select", "type": "registry:ui", "title": "Select", "description": null }, { "name": "separator", "type": "registry:ui", "title": "Separator", "description": null }, { "name": "slider", "type": "registry:ui", "title": "Slider", "description": null }, { "name": "switch", "type": "registry:ui", "title": "Switch", "description": null }, { "name": "tabs", "type": "registry:ui", "title": "Tabs", "description": null }, { "name": "textarea", "type": "registry:ui", "title": "Textarea", "description": null }, { "name": "toggle-group", "type": "registry:ui", "title": "Toggle Group", "description": null }, { "name": "toggle", "type": "registry:ui", "title": "Toggle", "description": null }, { "name": "toolbar", "type": "registry:ui", "title": "Toolbar", "description": null }, { "name": "tooltip", "type": "registry:ui", "title": "Tooltip", "description": null }, { "name": "utils", "type": "registry:lib", "title": null, "description": null } ], "component_count": 44, "components_truncated": false, "component_types": { "registry:ui": 43, "registry:lib": 1 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 58, "name": "@flightcn", "category": "Maps", "tags": [ "aesthetic" ], "tagline": "Flight routes on interactive maps with great-circle arcs, airport markers, multi-leg journeys, and optional animation, built for mapcn.", "short_description": "Flight routes on interactive maps with great-circle arcs, airport markers, multi-leg journeys, and optional animation, built for mapcn.", "description": "Flightcn is a specialized shadcn registry component set for rendering flight-route and satellite-orbit visualizations on MapLibre-powered maps via the mapcn ecosystem. It provides FlightAirport (single airport marker from IATA code), FlightRoute (great-circle arc between two airports), FlightRoutes (multiple independent routes), FlightMultileg (connected multi-leg journeys), and SatelliteOrbit (globe-based orbital ground tracks with animated markers and custom SVG support). Includes a built-in airport registry with IATA code, name, city, country, and coordinates. Handles antimeridian, hover states, animated paths, and optional airport labels. Use for: adding interactive great-circle flight maps or satellite orbit overlays to a Next.js/MapLibre project that already uses mapcn, with minimal custom geographic math.", "homepage": "https://flightcn.yencheng.dev", "docs": "https://flightcn.yencheng.dev/docs/flight", "github": "https://github.com/ridemountainpig/flightcn", "components_github": "https://github.com/ridemountainpig/flightcn/tree/main/src/registry", "github_default_branch": "main", "github_stars": 129, "last_commit": "2026-05-04T01:02:47Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://flightcn.yencheng.dev/r/{name}.json", "registry_index": "https://flightcn.yencheng.dev/r/registry.json", "components": [ "flight", "satellite" ], "component_items": [ { "name": "flight", "type": "registry:ui", "title": "Flight", "description": "A flight route visualization component with airport markers, great-circle arc lines, and a built-in 515-airport database." }, { "name": "satellite", "type": "registry:ui", "title": "Satellite", "description": "A globe-based satellite orbit overlay with animated motion, ground tracks, and custom SVG marker support." } ], "component_count": 2, "components_truncated": false, "component_types": { "registry:ui": 2 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 59, "name": "@flowkit-ui", "category": "Niche/single-purpose", "tags": [ "components" ], "tagline": "Opinionated, accessible components on Base UI and shadcn-style primitives — starting with a Creatable Combobox.", "short_description": "Opinionated, accessible components on Base UI and shadcn-style primitives — starting with a Creatable Combobox.", "description": "Flowkit UI is a small, opinionated shadcn-compatible component registry built on Base UI (not Radix UI) primitives, targeting UI patterns that standard shadcn does not cover. Currently it ships a Creatable Combobox — a combobox where users can type to create new options on the fly. The project is positioned as a growing library of reusable patterns for common team-level rebuilds. Built with React, Tailwind CSS, and TypeScript. Free and MIT licensed. Use for: dropping a fully accessible Base UI-backed creatable combobox into a shadcn project without writing the create-new-option logic from scratch, and watching for future Base UI primitive patterns as the registry grows.", "homepage": "https://flowkit-ui.vzkiss.com", "docs": "https://flowkit-ui.vzkiss.com/docs", "github": "https://github.com/vzkiss/flowkit-ui", "components_github": "https://github.com/vzkiss/flowkit-ui/tree/main/src/components", "github_default_branch": "main", "github_stars": 10, "last_commit": "2026-04-22T20:11:36Z", "archived": false, "license": "MIT", "open_issues": 1, "registry_template": "https://flowkit-ui.vzkiss.com/r/{name}.json", "registry_index": "https://flowkit-ui.vzkiss.com/r/registry.json", "components": [ "creatable-combobox" ], "component_items": [ { "name": "creatable-combobox", "type": "registry:component", "title": "Creatable Combobox", "description": "Combobox with creatable items, built on Base UI and shadcn-style primitives (combobox, input group, button)." } ], "component_count": 1, "components_truncated": false, "component_types": { "registry:component": 1 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 60, "name": "@fluid", "category": "AI/chat UI", "tags": [ "ai", "aesthetic" ], "tagline": "Fluid components used exclusively in service of functional clarity. Proximity hover, spring animations, font-weight transitions, and animated focus rings.", "short_description": "Fluid components used exclusively in service of functional clarity. Proximity hover, spring animations, font-weight transitions, and animated focus rings.", "description": "Fluid Functionalism is a ~22-component shadcn registry focused on motion-as-information: every animation makes a state change legible rather than decorative. Components use Framer Motion springs, proximity-hover highlights, and font-weight transitions. Notable AI-oriented components include ThinkingIndicator (morphing SVG status), ThinkingSteps (chain-of-thought display), InputMessage (auto-resizing chat composer), and AskUserQuestions (stepped single/multi-select question flow). Also includes accordion, badge, button, checkbox-group, color-picker (HEX/RGB/HSL/OKLCH, eyedropper), dialog, dropdown, input-group, radio-group, select, slider, surfaces (8 elevation levels), switch, table, tabs, tabs-subtle, and tooltip. Built on Radix UI, Tailwind CSS v4, and React 19. Free, MIT licensed. Use for: building AI chat and agent interfaces where interaction feedback needs to feel calm and precise, or adding a spring-physics design language to a shadcn project.", "homepage": "https://www.fluidfunctionalism.com", "docs": "https://www.fluidfunctionalism.com/docs", "github": "https://github.com/mickadesign/fluid-functionalism", "components_github": "https://github.com/mickadesign/fluid-functionalism/tree/main/registry", "github_default_branch": "main", "github_stars": 561, "last_commit": "2026-07-06T23:51:54Z", "archived": false, "license": "MIT", "open_issues": 8, "registry_template": "https://www.fluidfunctionalism.com/r/{name}.json", "registry_index": "https://www.fluidfunctionalism.com/r/registry.json", "components": [ "surfaces", "utils", "springs", "font-weight", "surface-context", "surface-classes", "elevated", "shape-context", "icon-context", "icon-map", "use-proximity-hover", "use-touch-primary", "use-merge-split", "accordion", "accordion-base", "ask-user-questions", "badge", "button", "button-base", "dropdown", "dropdown-base", "checkbox-group", "checkbox-group-base", "radio-group", "radio-group-base", "dialog", "dialog-base", "mobile-drawer", "mobile-drawer-base", "input-copy", "input-group", "input-message", "file-thumbnail", "chat-message", "tabs-subtle", "tabs-subtle-base", "switch", "switch-base", "table", "slider", "slider-base", "tabs", "tabs-base", "thinking-indicator", "scroll-area", "scroll-area-base", "select", "select-base", "tooltip", "tooltip-base", "thinking-steps", "thinking-steps-base", "color-picker" ], "component_items": [ { "name": "surfaces", "type": "registry:theme", "title": "Surfaces", "description": "Eight-level surface and shadow ladder for elevation. Light: two color steps then flat white, differentiated by shadow. Dark: additive white-opacity ladder with…" }, { "name": "utils", "type": "registry:lib", "title": "Utilities", "description": "Utility function for merging Tailwind CSS classes with clsx and tailwind-merge." }, { "name": "springs", "type": "registry:lib", "title": "Spring Animations", "description": "Spring animation token presets for Framer Motion (fast, moderate, slow)." }, { "name": "font-weight", "type": "registry:lib", "title": "Font Weight Tokens", "description": "Variable font weight tokens for Inter (normal, medium, semibold, bold) using font-variation-settings." }, { "name": "surface-context", "type": "registry:lib", "title": "Surface Context", "description": "React context that tracks the current substrate elevation level. Elevated components (Dropdown, Select, etc.) read it via useSurface() and render at substrate …" }, { "name": "surface-classes", "type": "registry:lib", "title": "Surface Class Lookup", "description": "Static lookup tables for bg-surface-N and shadow-surface-N utilities. Required because Tailwind v4 cannot detect template-literal class names." }, { "name": "elevated", "type": "registry:lib", "title": "Elevated", "description": "Elevation primitive. Wraps the read-substrate / compute-level / apply-classes / re-provide-context pattern into one component. Pulls in the surface theme token…" }, { "name": "shape-context", "type": "registry:lib", "title": "Shape Context", "description": "React context provider for runtime shape variant switching (pill or rounded). Controls border-radius across all Fluid Functionalism components." }, { "name": "icon-context", "type": "registry:lib", "title": "Icon Context", "description": "React context provider for runtime icon library switching with Lucide fallback." }, { "name": "icon-map", "type": "registry:lib", "title": "Icon Map", "description": "Canonical icon name mapping across Lucide, Tabler, Phosphor, HugeIcons, and Untitled UI." }, { "name": "use-proximity-hover", "type": "registry:hook", "title": "useProximityHover", "description": "React hook for proximity-based hover detection. Tracks the closest item to the mouse cursor within a container, enabling smooth animated background indicators." }, { "name": "use-touch-primary", "type": "registry:hook", "title": "useTouchPrimary", "description": "Detects touch-primary devices (coarse pointer + touch points), updating live on pointer-mode and media-query changes. Adapted from Lina (https://lina.sameer.sh…" }, { "name": "use-merge-split", "type": "registry:hook", "title": "useMergeSplitBlocks", "description": "React hook + renderer for the selected-background merge/split animation. When one row bridges or splits two contiguous selected runs, their inner edges glide t…" }, { "name": "accordion", "type": "registry:ui", "title": "Accordion", "description": "Collapsible accordion with animated height transitions, spring-animated chevron, and proximity hover in grouped mode. Built on Radix UI Accordion." }, { "name": "accordion-base", "type": "registry:ui", "title": "Accordion (Base UI)", "description": "Collapsible accordion with animated height transitions, spring-animated chevron, and proximity hover in grouped mode. Base UI flavor." }, { "name": "ask-user-questions", "type": "registry:ui", "title": "Ask User Questions", "description": "Stepped question flow with numbered options, keyboard shortcuts (1–9), single or multi-select, inline 'other' text input, optional skip, proximity-based hover,…" }, { "name": "badge", "type": "registry:ui", "title": "Badge", "description": "Compact label with solid and dot variants, Tailwind color palette, and three sizes." }, { "name": "button", "type": "registry:ui", "title": "Button", "description": "Animated button with variants (primary, secondary, tertiary, ghost), icon support, loading spinner, and fluid font-weight transitions on hover." }, { "name": "button-base", "type": "registry:ui", "title": "Button (Base UI)", "description": "Animated button with variants (primary, secondary, tertiary, ghost), icon support, loading spinner, and fluid font-weight transitions on hover. Base UI flavor." }, { "name": "dropdown", "type": "registry:ui", "title": "Dropdown", "description": "Dropdown menu with proximity hover, animated selection indicator, inline panel or triggered popup with collision-aware positioning, typeahead, and close-on-sel…" }, { "name": "dropdown-base", "type": "registry:ui", "title": "Dropdown", "description": "Dropdown menu with proximity hover, animated selection indicator, inline panel or triggered popup with collision-aware positioning, typeahead, and close-on-sel…" }, { "name": "checkbox-group", "type": "registry:ui", "title": "Checkbox Group", "description": "Animated checkbox group with proximity hover, contiguous selection merging, and spring-animated check marks. Built on Radix UI Checkbox." }, { "name": "checkbox-group-base", "type": "registry:ui", "title": "Checkbox Group (Base UI)", "description": "Animated checkbox group with proximity hover, contiguous selection merging, and spring-animated check marks. Base UI flavor." }, { "name": "radio-group", "type": "registry:ui", "title": "Radio Group", "description": "Animated radio group with proximity hover, spring-animated selection dot, and optional Radix UI integration. Supports both controlled index and value-based API…" }, { "name": "radio-group-base", "type": "registry:ui", "title": "Radio Group (Base UI)", "description": "Animated radio group with proximity hover, spring-animated selection dot. Base UI flavor." }, { "name": "dialog", "type": "registry:ui", "title": "Dialog", "description": "Animated modal dialog with spring-based scale and opacity transitions. Built on Radix UI Dialog with overlay, header, footer, title, and description sub-compon…" }, { "name": "dialog-base", "type": "registry:ui", "title": "Dialog (Base UI)", "description": "Animated modal dialog with spring-based scale and opacity transitions. Base UI flavor." }, { "name": "mobile-drawer", "type": "registry:ui", "title": "Mobile Drawer", "description": "Slide-in navigation drawer with scrim, focus trap, and scroll lock. Radix flavor." }, { "name": "mobile-drawer-base", "type": "registry:ui", "title": "Mobile Drawer", "description": "Slide-in navigation drawer with scrim, focus trap, and scroll lock. Base UI flavor." }, { "name": "input-copy", "type": "registry:ui", "title": "Input Copy", "description": "Read-only input with a copy-to-clipboard button and animated check feedback. Supports optional label and shape context." }, { "name": "input-group", "type": "registry:ui", "title": "Input Group", "description": "Grouped input fields with proximity-based highlighting, animated label transitions, optional icons, and error states." }, { "name": "input-message", "type": "registry:ui", "title": "Input Message", "description": "Chat-style message composer with auto-resizing textarea, drag-and-drop file attachments (PNG / JPEG / PDF), flexible left/right action slots, and a built-in se…" }, { "name": "file-thumbnail", "type": "registry:ui", "title": "File Thumbnail", "description": "Read-only square preview of a File. Images render via object-cover; PDFs render their first page via pdfjs; a spinner shows while either resolves. Adapts its c…" }, { "name": "chat-message", "type": "registry:ui", "title": "Chat Message", "description": "A single chat transcript entry with baked-in entrance and layout motion. Right-aligned accent bubble for the user, left-aligned muted bubble for the assistant,…" }, { "name": "tabs-subtle", "type": "registry:ui", "title": "Tabs Subtle", "description": "Horizontal tab navigation with proximity hover, animated pill selection indicator, and fluid font-weight transitions. Radix flavor." }, { "name": "tabs-subtle-base", "type": "registry:ui", "title": "Tabs Subtle", "description": "Horizontal tab navigation with proximity hover, animated pill selection indicator, and fluid font-weight transitions. Base UI flavor." }, { "name": "switch", "type": "registry:ui", "title": "Switch", "description": "Animated toggle switch with spring-based thumb animation and fluid font-weight label transitions. Built on Radix UI Switch." }, { "name": "switch-base", "type": "registry:ui", "title": "Switch (Base UI)", "description": "Animated toggle switch with spring-based thumb animation and fluid font-weight label transitions. Base UI flavor." }, { "name": "table", "type": "registry:ui", "title": "Table", "description": "Animated table with proximity-based row hover highlighting and fluid border transitions. Includes TableHeader, TableBody, TableRow, TableHead, and TableCell su…" }, { "name": "slider", "type": "registry:ui", "title": "Slider", "description": "Animated slider with spring-snapped thumb, step dots, range mode, and click-to-edit value display. Built on Radix UI Slider." }, { "name": "slider-base", "type": "registry:ui", "title": "Slider (Base UI)", "description": "Animated slider with spring-snapped thumb, step dots, range mode, and click-to-edit value display. Base UI flavor." }, { "name": "tabs", "type": "registry:ui", "title": "Tabs", "description": "Segmented control tabs with sliding active indicator, proximity hover, and spring animations. Built on Radix UI Tabs." }, { "name": "tabs-base", "type": "registry:ui", "title": "Tabs (Base UI)", "description": "Segmented control tabs with sliding active indicator, proximity hover, and spring animations. Base UI flavor." }, { "name": "thinking-indicator", "type": "registry:ui", "title": "Thinking Indicator", "description": "Animated loading indicator with morphing SVG path (circle to infinity loop) and shimmer text rotation. Cycles through customizable status words." }, { "name": "scroll-area", "type": "registry:ui", "title": "Scroll Area", "description": "Scroll container with a restyled overlay scrollbar that stays discoverable on hover and follows the shape system. Falls back to native overflow scrolling on to…" }, { "name": "scroll-area-base", "type": "registry:ui", "title": "Scroll Area (Base UI)", "description": "Scroll container with a restyled overlay scrollbar that stays discoverable on hover and follows the shape system. Falls back to native overflow scrolling on to…" }, { "name": "select", "type": "registry:ui", "title": "Select", "description": "Animated select menu with collision-aware positioning, typeahead, proximity hover, spring-animated popover, and animated checkmark. Radix flavor." }, { "name": "select-base", "type": "registry:ui", "title": "Select", "description": "Animated select menu with collision-aware positioning, typeahead, proximity hover, spring-animated popover, and animated checkmark. Base UI flavor." }, { "name": "tooltip", "type": "registry:ui", "title": "Tooltip", "description": "Floating tooltip with spring-based animations, configurable placement, and rich content support." }, { "name": "tooltip-base", "type": "registry:ui", "title": "Tooltip (Base UI)", "description": "Floating tooltip with spring-based animations, configurable placement, and rich content support. Base UI flavor." }, { "name": "thinking-steps", "type": "registry:ui", "title": "Thinking Steps", "description": "Collapsible AI reasoning steps with animated expand/collapse, per-step icons, sources, and nested details. Radix flavor." }, { "name": "thinking-steps-base", "type": "registry:ui", "title": "Thinking Steps", "description": "Collapsible AI reasoning steps with animated expand/collapse, per-step icons, sources, and nested details. Base UI flavor." }, { "name": "color-picker", "type": "registry:ui", "title": "Color Picker", "description": "Color picker with HEX, RGB, HSL, and OKLCH formats, alpha channel, optional swatches, and a popover trigger. Built on Base UI's Popover, Menu, and NumberField …" } ], "component_count": 53, "components_truncated": false, "component_types": { "registry:theme": 1, "registry:lib": 9, "registry:hook": 3, "registry:ui": 40 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 61, "name": "@flx", "category": "Blocks & sections (marketing/SaaS)", "tags": [ "saas" ], "tagline": "A collection of customizable UI blocks with interactive live previews", "short_description": "A collection of customizable UI blocks with interactive live previews", "description": "Flexnative (flx) is an open-source library of UI blocks and patterns for product interfaces, built on shadcn/ui and Tailwind CSS. Blocks cover page sections — hero, content, carousel, showcase, bento-grids, logos, testimonials, scroll effects, and sticky-scroll-media. Patterns provide smaller UI compositions: avatar, breadcrumb, button, dialog, input, item, popover, select, tabs, and tooltip. All components include interactive live previews and are copy-paste installable via the shadcn registry. Free, MIT licensed. Use for: assembling SaaS or product marketing pages quickly by combining pre-built page sections with composable UI patterns, without starting layout from zero.", "homepage": "https://ui.flexnative.com", "docs": "https://ui.flexnative.com", "github": "https://github.com/felipemenezes098/ui-flx", "components_github": "https://github.com/felipemenezes098/ui-flx/tree/main/registry", "github_default_branch": "main", "github_stars": 27, "last_commit": "2026-07-07T22:21:13Z", "archived": false, "license": "AGPL-3.0", "open_issues": 0, "registry_template": "https://ui.flexnative.com/r/{name}.json", "registry_index": "https://ui.flexnative.com/r/registry.json", "components": [ "bento-grids-01", "carousel-01", "carousel-03", "carousel-02", "content-06", "content-09", "content-02", "content-07", "content-05", "content-01", "content-04", "cta-01", "hero-01", "hero-02", "hero-03", "hero-04", "hero-05", "hero-06", "hero-07", "hero-08", "hero-09", "hero-10", "logos-01", "scroll-01", "cta", "dynamic-icon", "testimonials-01", "accordion-01", "accordion-02", "accordion-03", "accordion-04", "accordion-05", "accordion-06", "accordion-07", "accordion-09", "accordion-10", "accordion-11", "accordion-12", "accordion-13", "accordion-14", "accordion-15", "accordion-16", "avatar-01", "avatar-02", "avatar-03", "avatar-04", "avatar-05", "avatar-06", "avatar-07", "avatar-08", "avatar-09", "avatar-10", "avatar-11", "avatar-12", "avatar-13", "badge-01", "badge-02", "badge-03", "badge-04", "badge-05", "badge-06", "badge-07", "badge-08", "badge-09", "badge-10", "badge-11", "badge-12", "badge-13", "banner-01", "banner-02", "banner-03", "banner-04", "banner-06", "banner-07", "banner-09", "banner-11", "banner-12", "banner-14", "breadcrumb-01", "breadcrumb-02", "breadcrumb-03", "breadcrumb-04", "breadcrumb-05", "breadcrumb-06", "breadcrumb-07", "breadcrumb-08", "breadcrumb-09", "button-01", "button-02", "button-03", "button-04", "button-05", "button-06", "button-07", "button-08", "button-09", "button-10", "button-11", "button-12", "button-13" ], "component_items": [ { "name": "bento-grids-01", "type": "registry:block", "title": "Bento grids 01", "description": "Three-column bento: primary tile (two-thirds) with title, description, CTA and media, plus supporting image cards." }, { "name": "carousel-01", "type": "registry:block", "title": "Carousel 01", "description": "Auto-scroll carousel that pauses on item hover and reveals title." }, { "name": "carousel-03", "type": "registry:block", "title": "Carousel 03", "description": "A carousel of cards with a title and description." }, { "name": "carousel-02", "type": "registry:block", "title": "Carousel 02", "description": "A carousel of media with a title and description." }, { "name": "content-06", "type": "registry:block", "title": "Content 06", "description": "Two-column split with serif headline, supporting copy, optional CTA, and a media panel." }, { "name": "content-09", "type": "registry:block", "title": "Content 09", "description": "Two-column icon card grid with serif section header and subtle entrance motion." }, { "name": "content-02", "type": "registry:block", "title": "Content 02", "description": "A grid of media cards with a section header and item details below each image." }, { "name": "content-07", "type": "registry:block", "title": "Content 07", "description": "Two-column grid with serif header, media on top, copy, and optional CTA per column." }, { "name": "content-05", "type": "registry:block", "title": "Content 05", "description": "A focus grid with items that can be focused and dimmed." }, { "name": "content-01", "type": "registry:block", "title": "Content 01", "description": "List of items: select one to reveal its description and media." }, { "name": "content-04", "type": "registry:block", "title": "Content 04", "description": "Two-column card grid with a serif section header, copy above each image, and subtle entrance motion." }, { "name": "cta-01", "type": "registry:block", "title": "Call to Action 01", "description": "A centered text block with a title, description, and CTA." }, { "name": "hero-01", "type": "registry:block", "title": "Hero 01", "description": "A centered serif hero with a soft gradient wash, pill CTA, and a floating integration cloud." }, { "name": "hero-02", "type": "registry:block", "title": "Hero 02", "description": "A left-aligned serif hero with a media panel: an image backdrop with a floating dashboard mockup on top." }, { "name": "hero-03", "type": "registry:block", "title": "Hero 03", "description": "A centered hero with dual CTAs and an image that fades into the page below the copy." }, { "name": "hero-04", "type": "registry:block", "title": "Hero 04", "description": "A two-column editorial hero with a soft background wash and a layered collage of two overlapping images." }, { "name": "hero-05", "type": "registry:block", "title": "Hero 05", "description": "An editorial hero with a left tagline, right-aligned headline and copy, and a full-width image below." }, { "name": "hero-06", "type": "registry:block", "title": "Hero 06", "description": "A split product hero with dual CTA, a compact logo row, and the Spot 01 illustration." }, { "name": "hero-07", "type": "registry:block", "title": "Hero 07", "description": "An editorial hero with a full-width image above, a top-aligned tagline, and right-aligned headline and copy below." }, { "name": "hero-08", "type": "registry:block", "title": "Hero 08", "description": "A split hero with a bold headline, avatar social proof, and two image cards with invertible overlay text and CTAs." }, { "name": "hero-09", "type": "registry:block", "title": "Hero 09", "description": "A centered real-estate hero with a search bar, a masked architecture image that fades into the page, and a split closing statement." }, { "name": "hero-10", "type": "registry:block", "title": "Hero 10", "description": "A centered hero with a highlighted headline, dual CTAs, social proof, and a fanned collage of three overlapping images." }, { "name": "logos-01", "type": "registry:block", "title": "Logos 01", "description": "Logo carousel with auto-scroll, edge gradient and minimalist style." }, { "name": "scroll-01", "type": "registry:block", "title": "Scroll 01", "description": "Sticky media that changes as you scroll through text content." }, { "name": "cta", "type": "registry:block", "title": "CTA (Call to Action)", "description": "Shared CTA component with link and button variant" }, { "name": "dynamic-icon", "type": "registry:block", "title": "Dynamic Icon", "description": "A dynamic icon component with a name and size." }, { "name": "testimonials-01", "type": "registry:block", "title": "Testimonials 01", "description": "A single testimonial with quote, avatar, author name and role." }, { "name": "accordion-01", "type": "registry:block", "title": "Basic", "description": "Only one section open at a time, type=\"single\" collapsible. The default behavior." }, { "name": "accordion-02", "type": "registry:block", "title": "Multiple", "description": "type=\"multiple\" keeps several sections open at once." }, { "name": "accordion-03", "type": "registry:block", "title": "With icons", "description": "Leading icon beside each trigger label." }, { "name": "accordion-04", "type": "registry:block", "title": "FAQ", "description": "A titled question-and-answer list." }, { "name": "accordion-05", "type": "registry:block", "title": "Separated cards", "description": "Each item is a bordered card with spacing between them." }, { "name": "accordion-06", "type": "registry:block", "title": "Plus / minus icon", "description": "Plus icon on each trigger that turns into a minus when open, instead of a chevron." }, { "name": "accordion-07", "type": "registry:block", "title": "Left chevron", "description": "Rotating chevron placed before the label instead of after it." }, { "name": "accordion-09", "type": "registry:block", "title": "Rich content", "description": "Lists, links, and a button inside the panel body." }, { "name": "accordion-10", "type": "registry:block", "title": "Disabled item", "description": "One trigger disabled while the others stay interactive." }, { "name": "accordion-11", "type": "registry:block", "title": "Nested", "description": "An accordion rendered inside another panel body." }, { "name": "accordion-12", "type": "registry:block", "title": "Ghost", "description": "Borderless minimal rows with an active color on open." }, { "name": "accordion-13", "type": "registry:block", "title": "Filled trigger", "description": "Each trigger sits on a muted, rounded background." }, { "name": "accordion-14", "type": "registry:block", "title": "Expand all", "description": "Controlled value with expand-all / collapse-all buttons." }, { "name": "accordion-15", "type": "registry:block", "title": "Settings sections", "description": "Grouped switch rows revealed inside each panel." }, { "name": "accordion-16", "type": "registry:block", "title": "With subtitle", "description": "Two-line trigger pairing a title with helper text." }, { "name": "avatar-01", "type": "registry:block", "title": "Basic", "description": "Image avatar with an initials fallback." }, { "name": "avatar-02", "type": "registry:block", "title": "Fallback initials", "description": "Missing image falls back to initials." }, { "name": "avatar-03", "type": "registry:block", "title": "Icon fallback", "description": "Generic user icon when there is no image or name." }, { "name": "avatar-04", "type": "registry:block", "title": "Sizes", "description": "Small, default, and large sizes side-by-side." }, { "name": "avatar-05", "type": "registry:block", "title": "Colored fallback", "description": "Tinted initials fallbacks using semantic tokens." }, { "name": "avatar-06", "type": "registry:block", "title": "Status badge", "description": "Presence dot in the corner showing online, away, or offline." }, { "name": "avatar-07", "type": "registry:block", "title": "Badge with icon", "description": "Verified check icon inside the AvatarBadge." }, { "name": "avatar-08", "type": "registry:block", "title": "With name", "description": "Avatar beside a name and email, forming a user row." }, { "name": "avatar-09", "type": "registry:block", "title": "Group", "description": "Overlapping AvatarGroup stack of members." }, { "name": "avatar-10", "type": "registry:block", "title": "Group with count", "description": "Overlapping group with a +N count for the remaining members." }, { "name": "avatar-11", "type": "registry:block", "title": "Group with tooltip", "description": "Hover each avatar in the group to reveal its name." }, { "name": "avatar-12", "type": "registry:block", "title": "Loading skeleton", "description": "Skeleton placeholder while the avatar loads." }, { "name": "avatar-13", "type": "registry:block", "title": "Icon on top", "description": "Icon badge pinned to the top-right corner." }, { "name": "badge-01", "type": "registry:block", "title": "Basic", "description": "A single default badge." }, { "name": "badge-02", "type": "registry:block", "title": "Variants", "description": "All six variants side-by-side: default, secondary, destructive, outline, ghost, link." }, { "name": "badge-03", "type": "registry:block", "title": "With icon", "description": "Leading verified icon before the label." }, { "name": "badge-04", "type": "registry:block", "title": "With status dot", "description": "A colored presence dot beside an outline label." }, { "name": "badge-05", "type": "registry:block", "title": "Status colors", "description": "Tinted success, warning, error, and info states." } ], "component_count": 440, "components_truncated": true, "component_types": { "registry:block": 440 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 62, "name": "@fonttrio", "category": "Theming/styling", "tags": [ "aesthetic" ], "tagline": "Curated font pairing registry for shadcn. Three fonts. One command. Install perfectly configured typography (heading + body + mono) with shadcn add. Includes editorial-grade type scales, CSS variables, and a live preview site.", "short_description": "Curated font pairing registry for shadcn. Three fonts. One command. Install perfectly configured typography (heading + body + mono) with shadcn add. Includes editorial-grade type scales, CSS variables, and a live preview site.", "description": "Fonttrio is a curated font-pairing registry for shadcn/ui projects. It offers 49 font pairings, each bundling a heading font, body font, and monospace font that work together harmoniously. Installing a pairing (e.g., npx shadcn add @fonttrio/editorial) sets up --font-heading, --font-body, and --font-mono CSS variables plus an editorial-grade type scale with predefined heading sizes, line heights, letter-spacing, and font weights. Covers styles from editorial to corporate and minimal to bold. Integrates with Next.js font loading and Google Fonts. Free and open source. Use for: instantly establishing a professional, cohesive typography system in a shadcn/ui project with a single CLI command instead of manually configuring Next.js font imports, CSS variables, and type scales.", "homepage": "https://www.fonttrio.xyz", "docs": "https://kapishdima-fonttrio.mintlify.app/introduction", "github": "https://github.com/kapishdima/fonttrio", "components_github": "https://github.com/kapishdima/fonttrio/tree/main/registry", "github_default_branch": "main", "github_stars": 431, "last_commit": "2026-05-27T08:47:49Z", "archived": false, "license": "MIT", "open_issues": 2, "registry_template": "https://www.fonttrio.xyz/r/{name}.json", "registry_index": null, "components": [], "component_items": [], "component_count": null, "components_truncated": false, "component_types": {}, "has_logo": true, "enrichment_errors": [ "registry_index_unresolved" ], "featured": true }, { "number": 63, "name": "@forgeui", "category": "Animated components", "tags": [ "saas", "dashboard", "aesthetic" ], "tagline": "Beautifully designed components that you can copy and paste into your apps. Accessible. Customizable. Open Source.", "short_description": "Beautifully designed components that you can copy and paste into your apps. Accessible. Customizable. Open Source.", "description": "ForgeUI is an animation-first React component library built with Next.js, TypeScript, Tailwind CSS, and Framer Motion. Components include animated-form, animated-otp, bot-detection, framework-agnostic, fraud-card, notification-center, security-card, vault-lock, and visual background effects (auralis, chromatic-fluid, cloudscape, cosmicrift, lumadrift, velaris, velora). Also provides animated-tabs, expandable-card, notification-panel, onboard-card, social-card, spectrum-switcher, stack-ripple, stats-card, text-morph, text-reveal, and text-shimmer. Distributed via the shadcn registry. Source is available for personal and commercial use but redistribution as a UI library is prohibited. Use for: adding distinctive motion-enhanced forms, OTP inputs, and animated background effects to product landing pages or dashboards when visual differentiation and micro-interactions are the priority.", "homepage": "https://forgeui.in/", "docs": "https://forgeui.in/docs/introduction", "github": "https://github.com/AmanShakya0018/forgeui", "components_github": "https://github.com/AmanShakya0018/forgeui/tree/main/registry", "github_default_branch": "main", "github_stars": 183, "last_commit": "2026-06-14T16:00:57Z", "archived": false, "license": null, "open_issues": 3, "registry_template": "https://forgeui.in/r/{name}.json", "registry_index": "https://forgeui.in/r/registry.json", "components": [ "animated-form", "animated-tabs", "animated-otp", "bot-detection", "expandable-card", "framework-agnostic", "fraud-card", "notification-center", "notification-panel", "onboard-card", "security-card", "social-card", "stats-card", "spectrum-switcher", "text-reveal", "text-morph", "text-shimmer", "stack-ripple", "vault-lock", "cloudscape", "lumadrift", "cosmicrift", "chromatic-fluid", "velora", "velaris", "auralis", "nebulore", "noctylis" ], "component_items": [ { "name": "animated-form", "type": "registry:ui", "title": "Animated Form", "description": "Animated form mimicking account creation with progressive name/password animation and completion checkmarks." }, { "name": "animated-tabs", "type": "registry:ui", "title": "Animated Tabs", "description": "witch tabs smoothly with motion-based underline or highlight effects." }, { "name": "animated-otp", "type": "registry:ui", "title": "Animated OTP", "description": "Looping animated OTP input with glowing digit transitions to simulate secure, timed authentication flow." }, { "name": "bot-detection", "type": "registry:ui", "title": "Bot Detection", "description": "Animated radar-style component that simulates real-time bot detection using glowing pulses and scanning motion." }, { "name": "expandable-card", "type": "registry:ui", "title": "Expandable Card", "description": "Interactive UI component to expand cards with smooth animations and detailed content using layout transitions." }, { "name": "framework-agnostic", "type": "registry:ui", "title": "Framework Agnostic", "description": "Visually demonstrates cross-framework adaptability using animated stack icons and a glowing pipeline effect." }, { "name": "fraud-card", "type": "registry:ui", "title": "Fraud Card", "description": "A security alert card inspired by Clerk's landing page, showcasing blocked emails with smooth hover animations." }, { "name": "notification-center", "type": "registry:ui", "title": "Notification Center", "description": "Beautifully animated mobile UI showcasing notifications with hover-triggered transitions and customizable content blocks." }, { "name": "notification-panel", "type": "registry:ui", "title": "Notification Panel", "description": "A collapsible notification panel displaying recent alerts with icons, timestamps, and smooth animated transitions." }, { "name": "onboard-card", "type": "registry:ui", "title": "Onboard Card", "description": "Animated onboarding progress card showing three steps with visual loaders, transitions, and completion indicators." }, { "name": "security-card", "type": "registry:ui", "title": "Security Card", "description": "Dynamic security identity card with animated verification, glowing avatar outline, and infinite character scramble stream." }, { "name": "social-card", "type": "registry:ui", "title": "Social Card", "description": "An animated profile card showing name, avatar, and social links on hover." }, { "name": "stats-card", "type": "registry:ui", "title": "Stats Card", "description": "A dynamic stats card comparing two individuals with avatars, data points, and animated background graph." }, { "name": "spectrum-switcher", "type": "registry:ui", "title": "Spectrum Switcher", "description": "Interactive spectrum switcher with animated gradients, smooth dropdown transitions, and selectable themed color palettes." }, { "name": "text-reveal", "type": "registry:ui", "title": "Text Reveal", "description": "A stylish effect that sequentially fades in text on page load, creating a dynamic reveal." }, { "name": "text-morph", "type": "registry:ui", "title": "Text Morph", "description": "A React component that animates rotating text characters using Motion, customizable by words, interval, styling, and animation timing." }, { "name": "text-shimmer", "type": "registry:ui", "title": "Text Shimmer", "description": "A React component that creates an animated text shimmer effect using Motion, customizable by tag, duration, spread, delay, and repeat delay." }, { "name": "stack-ripple", "type": "registry:ui", "title": "Stack Ripple", "description": "Animated stacked notification cards ripple open with smooth transitions, showing messages, signups, and billing reminders." }, { "name": "vault-lock", "type": "registry:ui", "title": "Vault Lock", "description": "Animated vault showcasing secure password input with motion effects and interactive hover-based unlock behavior." }, { "name": "cloudscape", "type": "registry:ui", "title": "Cloudscape", "description": "A WebGL-powered animated cloud gradient that creates a soft, flowing sky-like background using layered noise and color blending." }, { "name": "lumadrift", "type": "registry:ui", "title": "Lumadrift", "description": "A WebGL-powered animated gradient that produces smooth, flowing light patterns using procedural noise and color blending." }, { "name": "cosmicrift", "type": "registry:ui", "title": "Cosmicrift", "description": "A WebGL-powered animated cosmic background featuring a procedural starfield with twinkling effects and flowing nebula-like wave distortions, rendered in real t…" }, { "name": "chromatic-fluid", "type": "registry:ui", "title": "Chromatic Fluid", "description": "A WebGL-powered animated fluid effect featuring procedural noise, chromatic glint highlights, and dynamic lighting with film grain." }, { "name": "velora", "type": "registry:ui", "title": "Velora", "description": "A WebGL-powered animated radial light effect featuring swirling color streaks, 3D noise-based flow, and dynamic color transitions with film grain." }, { "name": "velaris", "type": "registry:ui", "title": "Velaris", "description": "A WebGL-powered animated background featuring layered simplex noise, multi-color blending, vignette glow, and subtle film grain effects." }, { "name": "auralis", "type": "registry:ui", "title": "Auralis", "description": "A WebGL-powered animated background featuring layered simplex noise, glowing light effects, vignette, and subtle film grain for a dramatic ambiance." }, { "name": "nebulore", "type": "registry:ui", "title": "Nebulore", "description": "A WebGL-powered animated nebula background featuring flowing aurora ribbons, domain-warped simplex noise, and customizable color glow with film grain." }, { "name": "noctylis", "type": "registry:ui", "title": "Noctylis", "description": "A WebGL-powered nocturnal glow background featuring chained simplex noise layers, soft violet light blooms, vignette, and film grain." } ], "component_count": 28, "components_truncated": false, "component_types": { "registry:ui": 28 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 64, "name": "@formcn", "category": "Forms", "tags": [ "ai" ], "tagline": "Build production-ready forms with a few clicks using shadcn components and modern tools.", "short_description": "Build production-ready forms with a few clicks using shadcn components and modern tools.", "description": "A shadcn/ui-based form builder that generates production-ready single-step and multi-step form code without AI inconsistency. Outputs React components using shadcn primitives, Zod validation (client and server), and Tailwind CSS. Includes Formcn AI scaffolding to auto-generate field configurations, support for stepper, tag-input, and standard form controls, plus a one-command shadcn registry install. Free and open-source. Use for: rapidly scaffolding validated, accessible forms in Next.js projects without hand-writing repetitive form boilerplate.", "homepage": "https://formcn.dev", "docs": "https://formcn.dev", "github": "https://github.com/Ali-Hussein-dev/formcn", "components_github": "https://github.com/Ali-Hussein-dev/formcn/tree/main/registry", "github_default_branch": "main", "github_stars": 491, "last_commit": "2026-06-13T10:15:08Z", "archived": false, "license": null, "open_issues": 10, "registry_template": "https://formcn.dev/r/{name}.json", "registry_index": "https://formcn.dev/r/registry.json", "components": [ "tag-input", "password", "multi-select", "rating", "file-upload", "use-file-upload", "use-multi-step-viewer", "multi-step-viewer", "stepper" ], "component_items": [ { "name": "tag-input", "type": "registry:component", "title": "Tag Input", "description": "Tag input component" }, { "name": "password", "type": "registry:component", "title": "Password", "description": "Password input with show/hide toggle" }, { "name": "multi-select", "type": "registry:component", "title": "Multi-select", "description": "Multi-select dropdown" }, { "name": "rating", "type": "registry:component", "title": "Rating", "description": "Rating component" }, { "name": "file-upload", "type": "registry:component", "title": "File Input", "description": "File upload component" }, { "name": "use-file-upload", "type": "registry:hook", "title": "file upload hook", "description": "state management hook for file upload component" }, { "name": "use-multi-step-viewer", "type": "registry:hook", "title": "Multi-step viewer hook", "description": "Multi-step viewer hook" }, { "name": "multi-step-viewer", "type": "registry:component", "title": "Multi-step form", "description": "Multi-step form" }, { "name": "stepper", "type": "registry:component", "title": "Stepper", "description": "Stepper component" } ], "component_count": 9, "components_truncated": false, "component_types": { "registry:component": 7, "registry:hook": 2 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 65, "name": "@framecn", "category": "Animated components", "tags": [ "saas", "ai", "aesthetic" ], "tagline": "Beautiful videos, made simple. Ready to use, customizable video components for React.", "short_description": "Beautiful videos, made simple. Ready to use, customizable video components for React.", "description": "A shadcn-compatible registry of 64 programmatic video compositions for React, built on the Editframe rendering engine. Compositions include Hero Device Assemble, AI Generation Canvas, Browser Flow, Terminal to Browser Deploy, Product Launch Trailer, Pricing Tier Focus, Changelog Bite, and more — all covering SaaS and developer storytelling scenarios. Free and open-source, TypeScript/Next.js, installable via npx shadcn add. Use for: embedding high-quality animated video sequences or motion narratives inside React/Next.js apps without a video editing tool.", "homepage": "https://framecn.vercel.app", "docs": "https://framecn.vercel.app/docs", "github": "https://github.com/shadcn-labs/framecn", "components_github": "https://github.com/shadcn-labs/framecn/tree/main/registry", "github_default_branch": "main", "github_stars": 101, "last_commit": "2026-07-06T11:34:07Z", "archived": false, "license": "MIT", "open_issues": 1, "registry_template": "https://framecn.vercel.app/r/{name}.json", "registry_index": "https://framecn.vercel.app/r/registry.json", "components": [ "blur-reveal", "typewriter", "inline-highlight", "text-fade-replace", "strikethrough-replace", "staggered-fade-up", "masked-slide-reveal", "tracking-in", "shimmer-sweep", "marker-highlight", "slot-machine-roll", "matrix-decode", "rgb-glitch-text", "infinite-marquee", "mesh-gradient-bg", "dynamic-grid", "spring-pop-in", "simulated-cursor", "pulsing-indicator", "directional-wipe", "device-mockup-zoom", "zoom-through-transition", "staggered-bento-grid", "chat-to-preview-layout", "bounding-box-selector", "animated-line-chart", "animated-bar-chart", "terminal-simulator", "code-diff-wipe", "toast-notification", "drag-and-drop-flow", "progress-steps", "morphing-modal", "data-flow-pipes", "cursor-flow", "code-accordion", "glass-code-block", "spotlight-card", "perspective-marquee", "success-confetti", "frosted-glass-wipe", "kinetic-type-mask", "spatial-push", "grid-pixelate-wipe", "chromatic-aberration-wipe", "hero-device-assemble", "ecosystem-constellation", "ai-generation-canvas", "live-code-compilation", "landing-code-showcase", "pipeline-journey", "dashboard-populate", "terminal-to-browser-deploy", "browser-flow", "pricing-tier-focus", "infinite-bento-pan", "ai-generate-overlay", "image-expand-to-fullscreen", "swipe-transition-wipe", "product-launch-trailer", "caption-highlight", "caption-pill-karaoke", "caption-kinetic-slam", "caption-clip-wipe", "caption-editorial-emphasis", "caption-emoji-pop", "caption-glitch-rgb", "caption-gradient-fill", "caption-matrix-decode", "caption-neon-accent", "caption-neon-glow", "caption-parallax-layers", "caption-particle-burst", "caption-texture", "caption-weight-shift", "confetti", "logo-enter", "backdrop", "top-down-letters", "blur-out-up", "focus-blur-resolve", "per-character-rise", "scale-down-fade", "shader-color-panels", "shader-dithering", "shader-dot-orbit", "shader-god-rays", "shader-grain-gradient", "shader-liquid-metal", "shader-mesh-gradient", "shader-metaballs", "shader-neuro-noise", "shader-perlin-noise", "shader-pulsing-border", "shader-simplex-noise", "shader-smoke-ring", "shader-spiral", "shader-swirl", "shader-voronoi", "shader-warp" ], "component_items": [ { "name": "blur-reveal", "type": "registry:component", "title": "Blur Reveal", "description": "Text fades in from a heavy blur into sharp focus." }, { "name": "typewriter", "type": "registry:component", "title": "Typewriter", "description": "Character-by-character text reveal with a deterministic blinking cursor." }, { "name": "inline-highlight", "type": "registry:component", "title": "Inline Highlight", "description": "Animates one word inside a sentence from a base color to a brand color." }, { "name": "text-fade-replace", "type": "registry:component", "title": "Text Fade Replace", "description": "Cross-fades between two strings on the same line without layout shift." }, { "name": "strikethrough-replace", "type": "registry:component", "title": "Strikethrough Replace", "description": "Draws a strike line across old text then reveals new text in its place." }, { "name": "staggered-fade-up", "type": "registry:component", "title": "Staggered Fade Up", "description": "Words fade in and slide up one after another with a configurable delay." }, { "name": "masked-slide-reveal", "type": "registry:component", "title": "Masked Slide Reveal", "description": "Words slide up out of an invisible horizontal mask, one after another." }, { "name": "tracking-in", "type": "registry:component", "title": "Tracking In", "description": "Letter-spacing collapses and blur clears with a springy motion." }, { "name": "shimmer-sweep", "type": "registry:component", "title": "Shimmer Sweep", "description": "Light shine sweeps across muted text via background-clip:text." }, { "name": "marker-highlight", "type": "registry:component", "title": "Marker Highlight", "description": "Colored marker block draws behind a phrase as the text color shifts." }, { "name": "slot-machine-roll", "type": "registry:component", "title": "Slot Machine Roll", "description": "Vertical reel scrolls characters from one value to another." }, { "name": "matrix-decode", "type": "registry:component", "title": "Matrix Decode", "description": "Random scramble resolves left-to-right into the target text." }, { "name": "rgb-glitch-text", "type": "registry:component", "title": "RGB Glitch Text", "description": "Three RGB-offset text copies jitter for a brief glitch window." }, { "name": "infinite-marquee", "type": "registry:component", "title": "Infinite Marquee", "description": "Seamlessly looping horizontal text strip with optional stroke style." }, { "name": "mesh-gradient-bg", "type": "registry:component", "title": "Mesh Gradient Background", "description": "Living gradient with amorphous color blobs slowly drifting across the frame." }, { "name": "dynamic-grid", "type": "registry:component", "title": "Dynamic Grid", "description": "Subtle moving grid background with configurable cell size and direction." }, { "name": "spring-pop-in", "type": "registry:component", "title": "Spring Pop In", "description": "Elastic spring-driven scale-in wrapper for any child element." }, { "name": "simulated-cursor", "type": "registry:component", "title": "Simulated Cursor", "description": "Animated mouse cursor moving between waypoints with click ripple feedback." }, { "name": "pulsing-indicator", "type": "registry:component", "title": "Pulsing Indicator", "description": "Continuous pulsing dot with ping ring for loading or live states." }, { "name": "directional-wipe", "type": "registry:component", "title": "Directional Wipe", "description": "Slide one scene in while pushing the other out." }, { "name": "device-mockup-zoom", "type": "registry:component", "title": "Device Mockup Zoom", "description": "Pull back from a UI to reveal it inside a device frame." }, { "name": "zoom-through-transition", "type": "registry:component", "title": "Zoom Through Transition", "description": "Aggressively scale into the center of an element." }, { "name": "staggered-bento-grid", "type": "registry:component", "title": "Staggered Bento Grid", "description": "Cards pop into a bento grid one after another with a spring." }, { "name": "chat-to-preview-layout", "type": "registry:component", "title": "Chat to Preview Layout", "description": "Two-column layout where chat shrinks and preview expands." }, { "name": "bounding-box-selector", "type": "registry:component", "title": "Bounding Box Selector", "description": "Figma-style selection rectangle appears around any element." }, { "name": "animated-line-chart", "type": "registry:component", "title": "Animated Line Chart", "description": "Line chart whose SVG path draws on from left to right with a leading dot." }, { "name": "animated-bar-chart", "type": "registry:component", "title": "Animated Bar Chart", "description": "Bars spring up from the baseline in a staggered cascade." }, { "name": "terminal-simulator", "type": "registry:component", "title": "Terminal Simulator", "description": "Terminal window that types out commands and rolls old lines off the top." }, { "name": "code-diff-wipe", "type": "registry:component", "title": "Code Diff Wipe", "description": "Before/after code reveal via clip-path wipe with a handle marker." }, { "name": "toast-notification", "type": "registry:component", "title": "Toast Notification", "description": "System-style toast pops in, holds, then slides out." }, { "name": "drag-and-drop-flow", "type": "registry:component", "title": "Drag and Drop Flow", "description": "Simulated file drag into a dropzone followed by upload progress." }, { "name": "progress-steps", "type": "registry:component", "title": "Progress Steps", "description": "Multi-step pipeline with sequentially activating nodes and filling lines." }, { "name": "morphing-modal", "type": "registry:component", "title": "Morphing Modal", "description": "A bento card lifts off the grid and blooms into a full-screen modal driven by a single heavy spring." }, { "name": "data-flow-pipes", "type": "registry:component", "title": "Data Flow Pipes", "description": "Glowing data packets travel along SVG bezier pipes between system nodes, leaving fading trails." }, { "name": "cursor-flow", "type": "registry:component", "title": "Cursor Flow", "description": "A realistic mouse that arcs along cubic Bezier paths, pauses, and clicks targets that dip in response." }, { "name": "code-accordion", "type": "registry:component", "title": "Code Accordion", "description": "A code window that springs a range of lines closed and replaces them with a \"N lines collapsed\" placeholder." }, { "name": "glass-code-block", "type": "registry:component", "title": "Glass Code Block", "description": "A premium frosted-glass code editor window with a regex tokenizer and line-by-line stagger reveal." }, { "name": "spotlight-card", "type": "registry:component", "title": "Spotlight Card", "description": "A card with a moonlight-cool radial spotlight that follows a synthetic cursor and lights up its microborder." }, { "name": "perspective-marquee", "type": "registry:component", "title": "Perspective Marquee", "description": "A 3D-tilted infinite marquee with depth-of-field blur on items rolling toward the horizon." }, { "name": "success-confetti", "type": "registry:component", "title": "Success Confetti", "description": "Deterministic seeded confetti burst with optional headline." }, { "name": "frosted-glass-wipe", "type": "registry:component", "title": "Frosted Glass Wipe", "description": "Elegant scene transition through a sliding pane of frosted glass." }, { "name": "kinetic-type-mask", "type": "registry:component", "title": "Kinetic Type Mask", "description": "Use giant typography as a window into the next scene." }, { "name": "spatial-push", "type": "registry:component", "title": "Spatial Push", "description": "A new scene physically presses the old one back into the frame." }, { "name": "grid-pixelate-wipe", "type": "registry:component", "title": "Grid Pixelate Wipe", "description": "Dissolve from one scene to the next through a deterministic grid of mask cells." }, { "name": "chromatic-aberration-wipe", "type": "registry:component", "title": "Chromatic Aberration Wipe", "description": "An ultra-fast slide transition with an RGB glitch on the peak frames." }, { "name": "hero-device-assemble", "type": "registry:component", "title": "Hero Device Assemble", "description": "Floating device layers spring together into a laptop or phone mockup, then the screen wakes with a shimmer." }, { "name": "ecosystem-constellation", "type": "registry:component", "title": "Ecosystem Constellation", "description": "A central logo orbited by integration satellites with pulsing data lines." }, { "name": "ai-generation-canvas", "type": "registry:component", "title": "AI Generation Canvas", "description": "A prompt input transforms into a header, then a skeleton dashboard flips into populated cards." }, { "name": "live-code-compilation", "type": "registry:component", "title": "Live Code Compilation", "description": "Split-screen where typed code on the left snaps a live UI preview on the right, HMR-style." }, { "name": "landing-code-showcase", "type": "registry:component", "title": "Landing Code Showcase", "description": "Magical split-screen: code types itself on the left while the preview reactively re-renders on the right with sparks and tactile bounce." }, { "name": "pipeline-journey", "type": "registry:component", "title": "Pipeline Journey", "description": "A Kanban ticket arcs across columns triggering landings and a final confetti burst." }, { "name": "dashboard-populate", "type": "registry:component", "title": "Dashboard Populate", "description": "An empty dashboard cascades to life with KPI count-ups, bar bounces, line traces, and a donut fill." }, { "name": "terminal-to-browser-deploy", "type": "registry:component", "title": "Terminal to Browser Deploy", "description": "A CLI deploy completes, the terminal blurs back, and a browser window springs from the deploy URL." }, { "name": "browser-flow", "type": "registry:component", "title": "Browser Flow", "description": "Full Safari/Chrome simulation: typed URL, progress bar, page render, scroll, and a virtual cursor click." }, { "name": "pricing-tier-focus", "type": "registry:component", "title": "Pricing Tier Focus", "description": "Three pricing cards where the focused tier rises and brightens while siblings dim and blur." }, { "name": "infinite-bento-pan", "type": "registry:component", "title": "Infinite Bento Pan", "description": "A camera diagonally drifts across an oversized bento grid behind a soft vignette." }, { "name": "ai-generate-overlay", "type": "registry:component", "title": "AI Generate Overlay", "description": "Source image blurs under a shimmering dot grid and a pulsing 'Generating…' pill before a new image fades in." }, { "name": "image-expand-to-fullscreen", "type": "registry:component", "title": "Image Expand To Fullscreen", "description": "An image lifts out of a feed post and morphs into a fullscreen editor with toolbars sliding in." }, { "name": "swipe-transition-wipe", "type": "registry:component", "title": "Swipe Transition Wipe", "description": "Two scenes laid out side-by-side flick across the screen with a parallax background and a darkening outgoing layer." }, { "name": "product-launch-trailer", "type": "registry:component", "title": "Product Launch Trailer", "description": "Cinematic Product Hunt teaser: pulsing logo, zoom-through transition, 3D bento fly-over, and a confetti version drop." } ], "component_count": 101, "components_truncated": true, "component_types": { "registry:component": 101 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 66, "name": "@gaia", "category": "AI/chat UI", "tags": [ "ai", "dashboard", "mobile" ], "tagline": "Production-ready UI components designed for building beautiful AI assistants and conversational interfaces, from the team behind GAIA.", "short_description": "Production-ready UI components designed for building beautiful AI assistants and conversational interfaces, from the team behind GAIA.", "description": "Production-ready, open-source React components from the GAIA AI assistant team, built on Radix UI and Tailwind CSS. Includes ~30 components: Chat Demo, Chat Composer, iOS Message Bubbles, Model Selector, Tool Calls Section, AI streaming-oriented cards, Code Block, Knowledge Graph, File Dropzone, File Preview, and supporting data-viz (Area, Bar, Line, Pie, Scatter, Gauge, Radar charts) plus utility components like Navbar Menu, Slash Command Dropdown, and Workflow Card. Use for: assembling conversational AI assistant UIs and chatbot interfaces that need a polished, ready-to-ship look with minimal setup.", "homepage": "https://ui.heygaia.io", "docs": "https://ui.heygaia.io/docs", "github": "https://github.com/heygaia/ui", "components_github": "https://github.com/heygaia/ui/tree/main/registry", "github_default_branch": "main", "github_stars": 206, "last_commit": "2026-05-28T15:29:33Z", "archived": false, "license": "MIT", "open_issues": 4, "registry_template": "https://ui.heygaia.io/r/{name}.json", "registry_index": "https://ui.heygaia.io/r/registry.json", "components": [ "icons", "holo-card", "nested-menu", "raised-button", "navbar-menu", "github-stars-button", "author-tooltip", "link-preview", "email-compose-card", "search-results-tabs", "message-bubble", "weather-card", "slash-command-dropdown", "composer", "pricing-card", "knowledge-graph", "tool-calls-section", "wave-spinner", "stat-row", "bar-chart", "line-chart", "area-chart", "pie-chart", "scatter-chart", "radar-chart", "gauge-chart" ], "component_items": [ { "name": "icons", "type": "registry:ui", "title": "Icons", "description": "Hugeicons wrapper for all components. Uses free icons by default - upgrade to Pro by changing imports." }, { "name": "holo-card", "type": "registry:ui", "title": "Holo Card", "description": "An interactive 3D holographic profile card with tilt effects, sparkle animations, and flip functionality." }, { "name": "nested-menu", "type": "registry:ui", "title": "Nested Menu", "description": "A hover-activated nested menu component for multi-level navigation with smooth animations." }, { "name": "raised-button", "type": "registry:ui", "title": "Raised Button", "description": "A beautiful 3D raised button with customizable colors and dynamic text contrast." }, { "name": "navbar-menu", "type": "registry:ui", "title": "Navbar Menu", "description": "A beautiful animated dropdown menu for navigation with support for icons, descriptions, and custom layouts." }, { "name": "github-stars-button", "type": "registry:ui", "title": "GitHub Stars Button", "description": "A beautiful button that displays your GitHub repository's star count with real-time data fetching." }, { "name": "author-tooltip", "type": "registry:ui", "title": "Author Tooltip", "description": "An interactive avatar with tooltip showing author information and social links." }, { "name": "link-preview", "type": "registry:ui", "title": "Link Preview", "description": "An interactive link component with rich preview tooltip showing website metadata like title, description, and images." }, { "name": "email-compose-card", "type": "registry:ui", "title": "Email Compose Card", "description": "An AI-powered email composition card with recipient validation, smart inputs, and beautiful styling." }, { "name": "search-results-tabs", "type": "registry:ui", "title": "Search Results Tabs", "description": "A beautiful component for displaying search results with web pages, images, and news in an organized, interactive layout." }, { "name": "message-bubble", "type": "registry:ui", "title": "iOS Message Bubbles", "description": "Beautiful iOS-style message bubbles with authentic iMessage appearance, message grouping, and tail effects." }, { "name": "weather-card", "type": "registry:ui", "title": "Weather Card", "description": "A beautiful, interactive weather card component with forecast, detailed metrics, and multiple weather conditions support." }, { "name": "slash-command-dropdown", "type": "registry:ui", "title": "Slash Command Dropdown", "description": "A slash command dropdown for selecting tools and actions with categorization and search." }, { "name": "composer", "type": "registry:ui", "title": "Composer", "description": "A chat message input component with file attachments, auto-growing textarea, and tool integration support." }, { "name": "pricing-card", "type": "registry:ui", "title": "Pricing Card", "description": "A beautiful glassmorphism pricing card component with nested card design, feature lists, and customizable accent colors." }, { "name": "knowledge-graph", "type": "registry:ui", "title": "Knowledge Graph", "description": "An interactive D3.js-powered knowledge graph visualization with zoom, pan, drag, tooltips, and export functionality." }, { "name": "tool-calls-section", "type": "registry:ui", "title": "Tool Calls Section", "description": "An expandable section showing AI agent tool usage with icons, inputs, and outputs." }, { "name": "wave-spinner", "type": "registry:ui", "title": "Wave Spinner", "description": "A beautiful animated loading spinner with wave effects, multiple patterns, colors, and highly customizable animations." }, { "name": "stat-row", "type": "registry:ui", "title": "Stat Row", "description": "A compact KPI tile with optional trend indicator for dashboards and summary panels." }, { "name": "bar-chart", "type": "registry:ui", "title": "Bar Chart", "description": "A bar chart for comparisons and distributions, with stacked, horizontal, and grouped variants." }, { "name": "line-chart", "type": "registry:ui", "title": "Line Chart", "description": "A line chart for trends over time with optional dots, labels, and multiple series." }, { "name": "area-chart", "type": "registry:ui", "title": "Area Chart", "description": "A filled area chart with gradient fills for cumulative trends and stacked totals." }, { "name": "pie-chart", "type": "registry:ui", "title": "Pie Chart", "description": "A pie chart for proportions with donut, label, and legend display modes." }, { "name": "scatter-chart", "type": "registry:ui", "title": "Scatter Chart", "description": "A scatter chart for exploring correlation between two numeric variables." }, { "name": "radar-chart", "type": "registry:ui", "title": "Radar Chart", "description": "A radar chart for multi-axis comparisons across several dimensions." }, { "name": "gauge-chart", "type": "registry:ui", "title": "Gauge Chart", "description": "A radial gauge for a single value with thresholds, plus text and stacked variants." } ], "component_count": 26, "components_truncated": false, "component_types": { "registry:ui": 26 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 78, "name": "@gamekitui", "category": "Uncategorized", "tags": [], "tagline": "Drop-in, themeable browser games for shadcn — Snake, 2048, Minesweeper, and more. Each is a single self-contained file with zero dependencies.", "short_description": "", "description": "Drop-in, themeable browser games for shadcn — Snake, 2048, Minesweeper, and more. Each is a single self-contained file with zero dependencies.", "homepage": "https://gamekitui.com", "docs": "https://gamekitui.com/docs", "github": "https://github.com/slarity/gamekit-ui", "components_github": null, "github_default_branch": "main", "github_stars": 22, "last_commit": "2026-06-10T10:30:12Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://gamekitui.com/r/{name}.json", "registry_index": "https://gamekitui.com/r/registry.json", "components": [ "snake", "tic-tac-toe", "2048", "memory-match", "whack-a-mole", "minesweeper", "pong", "breakout", "dino-runner", "flappy", "fruit-ninja", "stack" ], "component_items": [ { "name": "snake", "type": "registry:component", "title": "Snake", "description": "A tiny, themeable Snake game. ≤6KB gzipped, zero external assets." }, { "name": "tic-tac-toe", "type": "registry:component", "title": "Tic-Tac-Toe", "description": "Classic 3×3 Tic-Tac-Toe with an unbeatable CPU. Pure DOM, fully themeable." }, { "name": "2048", "type": "registry:component", "title": "2048", "description": "The addictive sliding-tile puzzle. Reach 2048. Swipe or arrow keys." }, { "name": "memory-match", "type": "registry:component", "title": "Memory Match", "description": "Flip cards to find matching pairs in as few moves as possible." }, { "name": "whack-a-mole", "type": "registry:component", "title": "Whack-a-Mole", "description": "Tap the moles before they duck. 30-second pointer-only arcade game." }, { "name": "minesweeper", "type": "registry:component", "title": "Minesweeper", "description": "Deterministic 9×9 Minesweeper. Left-click reveals, right-click / long-press flags." }, { "name": "pong", "type": "registry:component", "title": "Pong", "description": "The original. Player vs CPU. First to 7. W/S or arrow keys." }, { "name": "breakout", "type": "registry:component", "title": "Breakout", "description": "Bounce the ball, clear the bricks, don't drop. Endless levels." }, { "name": "dino-runner", "type": "registry:component", "title": "Dino Runner", "description": "The offline-dino endless runner. Jump the cacti. Perfect for 404 pages." }, { "name": "flappy", "type": "registry:component", "title": "Flappy", "description": "Tap to flap through the pipes. A tiny infinite runner for loading screens." }, { "name": "fruit-ninja", "type": "registry:component", "title": "Fruit Ninja", "description": "Slice the flying fruit, dodge the bombs, beat the clock. A juicy 60-second arcade run." }, { "name": "stack", "type": "registry:component", "title": "Stack", "description": "The one-tap tower builder. Drop the sliding block, keep the overlap, stack as high as you can — every layer a shade of your theme." } ], "component_count": 12, "components_truncated": false, "component_types": { "registry:component": 12 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 67, "name": "@gamifykit", "category": "Niche/single-purpose", "tags": [ "saas", "dashboard" ], "tagline": "A collection of fully composable components that extend shadcn/ui with a focus on common gamification UI patterns.", "short_description": "A collection of fully composable components that extend shadcn/ui with a focus on common gamification UI patterns.", "description": "A small, focused shadcn/ui extension registry providing composable gamification UI components: Achievements, Daily Streak, and Leaderboard (3 components visible in docs). Built with React, TypeScript, Tailwind CSS, and Radix UI primitives, following the same copy-paste pattern as shadcn/ui. Free and open-source; minimal setup beyond an existing shadcn project. Use for: adding gamification elements — streaks, achievement badges, and ranked leaderboards — to SaaS dashboards or social apps without building them from scratch.", "homepage": "https://gamifykit.com", "docs": "https://gamifykit.com/docs", "github": "https://github.com/gamifykit/ui", "components_github": "https://github.com/gamifykit/ui/tree/main/registry", "github_default_branch": "main", "github_stars": 5, "last_commit": "2026-06-12T05:45:33Z", "archived": false, "license": "MIT", "open_issues": 1, "registry_template": "https://gamifykit.com/r/{name}.json", "registry_index": "https://gamifykit.com/r/registry.json", "components": [ "daily-streak", "achievements", "leaderboard" ], "component_items": [ { "name": "daily-streak", "type": "registry:component", "title": "Daily Streak", "description": "A card component that displays a user's daily streak with a 7-day dot grid" }, { "name": "achievements", "type": "registry:component", "title": "Achievements", "description": "A card component that displays a user's achievements and unlockable achievements" }, { "name": "leaderboard", "type": "registry:component", "title": "Leaderboard", "description": "A card component that displays a user ranking with scores and avatars" } ], "component_count": 3, "components_truncated": false, "component_types": { "registry:component": 3 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 68, "name": "@gammaui", "category": "Animated components", "tags": [ "saas", "aesthetic" ], "tagline": "Beautifully designed landing page components built with React & Tailwind CSS & Motion.", "short_description": "Beautifully designed landing page components built with React & Tailwind CSS & Motion.", "description": "A shadcn-compatible registry of ~27 production-ready animated components and interactive blocks for landing pages and SaaS UIs, built with React, Tailwind CSS v4, and Motion (Framer Motion). Includes Logo Cloud, Animated List, Pricing Interaction, Wavy Text Block, Magnetize Button, Logo Timeline/Loop, Activity Dropdown, Cloud Flow, CPU Architecture, Location Map, 3D Folder, Usage Card, and more. Free and MIT-licensed. Use for: adding polished micro-interactions and motion-rich marketing UI elements to landing pages and product sites.", "homepage": "https://www.gammaui.com", "docs": "https://www.gammaui.com/docs/introduction", "github": "https://github.com/mazyar-kawa/gamma-ui", "components_github": null, "github_default_branch": "master", "github_stars": 13, "last_commit": "2026-07-07T08:38:06Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://www.gammaui.com/r/{name}.json", "registry_index": "https://www.gammaui.com/r/registry.json", "components": [ "index", "data-feeding-in", "aurora-glass", "live-waveform", "support-box", "overlay-button", "border-button", "wavy-text-block", "inverted-cursor", "pixel-button", "plasma", "radial-intro", "logo-cloud", "wave-path", "magnetize-button", "text-roll", "activity-dropdown", "badge", "animated-list", "logo-timeline", "logo-loop", "pricing-interaction", "cloud-flow", "macbook-keyboard", "cpu-architecture", "shadcn-ui", "location-map", "3d-folder", "usage-card", "voxel-wall", "data-feeding-in-demo", "aurora-glass-demo", "live-waveform-demo", "support-box-demo", "overlay-button-demo", "border-button-demo", "wavy-text-block-demo", "inverted-cursor-demo", "pixel-button-demo", "plasma-demo", "radial-intro-demo", "logo-cloud-demo", "wave-path-demo", "magnetize-button-demo", "text-roll-demo", "activity-dropdown-demo", "badge-demo", "animated-list-demo", "logo-timeline-demo", "logo-timeline-demo-2", "logo-loop-demo", "pricing-interaction-demo", "cloud-flow-demo", "macbook-keyboard-demo", "cpu-architecture-demo", "shadcn-ui-demo", "location-map-demo", "3d-folder-demo", "usage-card-demo", "voxel-wall-demo", "utils" ], "component_items": [ { "name": "index", "type": "registry:style", "title": null, "description": null }, { "name": "data-feeding-in", "type": "registry:ui", "title": "Data Feeding In", "description": "An animated data ingestion visualization with flowing SVG paths, pulsing gradient beams, and a staggered table reveal using Framer Motion." }, { "name": "aurora-glass", "type": "registry:ui", "title": "Aurora Glass", "description": "A shimmering glass tile background with ripple layers, bevel shading, and chromatic spread." }, { "name": "live-waveform", "type": "registry:ui", "title": "Live Waveform", "description": "A customizable live audio waveform visualizer using the Web Audio API." }, { "name": "support-box", "type": "registry:ui", "title": "Support Box", "description": "A collapsible animated support widget for quick help actions using Framer Motion." }, { "name": "overlay-button", "type": "registry:ui", "title": "Overlay Button", "description": "An animated gradient button using Framer Motion with looping motion and spring transitions." }, { "name": "border-button", "type": "registry:ui", "title": "Border Button", "description": "A reactive border animation button that follows cursor movement using Framer Motion and CSS masks." }, { "name": "wavy-text-block", "type": "registry:ui", "title": "Wavy Text Block", "description": "A scroll-triggered wavy text animation component that creates flowing motion effects using Framer Motion and scroll context." }, { "name": "inverted-cursor", "type": "registry:ui", "title": "Inverted Cursor", "description": "A smooth, animated custom cursor component with blend mode effects." }, { "name": "pixel-button", "type": "registry:ui", "title": "Pixel Button", "description": "A pixelated button animation effect built with Tailwind CSS and React." }, { "name": "plasma", "type": "registry:ui", "title": "Plasma", "description": "A mesmerizing plasma shader animation rendered with WebGL, perfect for dynamic backgrounds and previews." }, { "name": "radial-intro", "type": "registry:ui", "title": "Radial Intro", "description": "A dynamic radial orbit animation built with Motion and React, featuring upright spinning image nodes." }, { "name": "logo-cloud", "type": "registry:ui", "title": "Logo Cloud", "description": "A responsive logo grid component supporting dark mode, decorations, and flexible layout." }, { "name": "wave-path", "type": "registry:ui", "title": "Wave Path", "description": "A dynamic interactive SVG wave component that responds to pointer movement." }, { "name": "magnetize-button", "type": "registry:ui", "title": "Magnetize Button", "description": "A magnetic particle-attraction button built with Framer Motion." }, { "name": "text-roll", "type": "registry:ui", "title": "Text Roll", "description": "A rolling hover-animated text component built with Motion One." }, { "name": "activity-dropdown", "type": "registry:ui", "title": "Activity Dropdown", "description": "A modern activity/notification dropdown with smooth animations and responsive motion." }, { "name": "badge", "type": "registry:ui", "title": "Badge", "description": "A flexible and customizable Badge component for labels, statuses, and indicators." }, { "name": "animated-list", "type": "registry:ui", "title": "Animated List", "description": "A dynamic list component with smooth animations that forms a column and scrolls through items continuously." }, { "name": "logo-timeline", "type": "registry:ui", "title": "Logo Timeline", "description": "A multi-row infinitely scrolling logo timeline built with Motion One, supporting hover-activated animations and row grouping." }, { "name": "logo-loop", "type": "registry:ui", "title": "Logo Timeline", "description": "A looping logo marquee component with horizontal and vertical motion, hover effects, fading edges, and responsive behavior." }, { "name": "pricing-interaction", "type": "registry:ui", "title": "Pricing Interaction", "description": "An interactive pricing switcher with animated numbers, selectable plans, and monthly/yearly billing modes." }, { "name": "cloud-flow", "type": "registry:ui", "title": "Cloud Flow", "description": "An interactive cloud architecture visualization component featuring animated SVG flow paths, glowing data particles, node badges, and a central hub with layere…" }, { "name": "macbook-keyboard", "type": "registry:ui", "title": "Macbook Keyboard", "description": "Interactive animated MacBook keyboard component." }, { "name": "cpu-architecture", "type": "registry:ui", "title": "CPU Architecture", "description": "A fully animated CPU architecture SVG component with dynamic paths, gradients, and optional CPU connections." }, { "name": "shadcn-ui", "type": "registry:ui", "title": "Shadcn UI", "description": "Animated ShadCN UI SVG with glowing masked paths, motion shapes, and dynamic shimmering text with customizable props." }, { "name": "location-map", "type": "registry:ui", "title": "Location Map", "description": "An interactive 3D-tilting location card with expandable animated map, live indicator, and motion-based hover effects." }, { "name": "3d-folder", "type": "registry:ui", "title": "3D Folder", "description": "A 3D animated folder component that reveals project cards on hover and expands into a smooth image lightbox with keyboard navigation." }, { "name": "usage-card", "type": "registry:ui", "title": "Usage Card", "description": "An animated system monitor card that displays a title, percentage, and neon-lit pill indicators driven by Motion." }, { "name": "voxel-wall", "type": "registry:ui", "title": "Voxel Wall", "description": "A dark voxel tunnel with volumetric light rays, drifting cubes, and mouse-driven camera parallax." }, { "name": "data-feeding-in-demo", "type": "registry:example", "title": "Data Feeding In Demo", "description": "An animated data ingestion visualization with flowing SVG paths, pulsing gradient beams, and a staggered table reveal using Framer Motion." }, { "name": "aurora-glass-demo", "type": "registry:example", "title": "Aurora Glass Demo", "description": "A shimmering glass tile background with ripple layers, bevel shading, and chromatic spread." }, { "name": "live-waveform-demo", "type": "registry:example", "title": "Live Waveform Demo", "description": "A customizable live audio waveform visualizer using the Web Audio API." }, { "name": "support-box-demo", "type": "registry:example", "title": "Support Box Demo", "description": "An expandable and animated support widget with quick help actions using Framer Motion." }, { "name": "overlay-button-demo", "type": "registry:example", "title": "Overlay Button Demo", "description": "A looping animated gradient button using Framer Motion’s spring transitions for smooth motion effects." }, { "name": "border-button-demo", "type": "registry:example", "title": "Border Button Demo", "description": "An interactive button that animates its border dynamically based on cursor position using Framer Motion." }, { "name": "wavy-text-block-demo", "type": "registry:example", "title": "Wavy Text Block Demo", "description": "An example demonstrating the Wavy Block scroll-triggered animation with multiple text lines." }, { "name": "inverted-cursor-demo", "type": "registry:example", "title": "Inverted Cursor Demo", "description": "A smooth, animated custom cursor component with blend mode effects." }, { "name": "pixel-button-demo", "type": "registry:example", "title": "Pixel Button Demo", "description": "A pixelated button animation effect built with Tailwind CSS and React." }, { "name": "plasma-demo", "type": "registry:example", "title": "Plasma Demo", "description": "A mesmerizing plasma shader animation rendered with WebGL, perfect for dynamic backgrounds and previews." }, { "name": "radial-intro-demo", "type": "registry:example", "title": "Radial Intro Demo", "description": "A rotating radial orbit animation demo showcasing spinning profile images." }, { "name": "logo-cloud-demo", "type": "registry:example", "title": "Logo Cloud Demo", "description": "A responsive logo grid demo showcasing brand logos with optional plus icons." }, { "name": "wave-path-demo", "type": "registry:example", "title": "Wave Path Demo", "description": "An interactive SVG wave animation that reacts to cursor movement." }, { "name": "magnetize-button-demo", "type": "registry:example", "title": "Magnetize Button Demo", "description": "An interactive demo showcasing the Magnetize Button component with particle attraction effects." }, { "name": "text-roll-demo", "type": "registry:example", "title": "Text Roll Demo", "description": "An interactive demo showcasing the TextRoll hover animation component." }, { "name": "activity-dropdown-demo", "type": "registry:example", "title": "Activity Dropdown Demo", "description": "A demo showcasing the animated ActivityDropdown component with staggered item reveal." }, { "name": "badge-demo", "type": "registry:example", "title": "Badge Demo", "description": "A demo showcasing the GammaUI Badge component with customizable colors, sizes, and variants." }, { "name": "animated-list-demo", "type": "registry:example", "title": "Animated List Demo", "description": "A demo showcasing the Animated List component with smooth formation and scrolling animations." }, { "name": "logo-timeline-demo", "type": "registry:example", "title": "Logo Timeline Demo", "description": "A demo showcasing the animated multi-row Logo Timeline component with infinite scrolling and staggered item motion." }, { "name": "logo-timeline-demo-2", "type": "registry:example", "title": "Logo Timeline Demo 2", "description": "A demo showcasing the animated multi-row Logo Timeline component with infinite scrolling and staggered item motion." }, { "name": "logo-loop-demo", "type": "registry:example", "title": "Logo Timeline Demo 2", "description": "A looping logo marquee component with horizontal and vertical motion, hover effects, fading edges, and responsive behavior." }, { "name": "pricing-interaction-demo", "type": "registry:example", "title": "Pricing Interaction Demo", "description": "An interactive pricing switcher with animated numbers, selectable plans, and monthly/yearly billing modes." }, { "name": "cloud-flow-demo", "type": "registry:example", "title": "Cloud Flow Demo", "description": "An interactive cloud architecture visualization component featuring animated SVG flow paths, glowing data particles, node badges, and a central hub with layere…" }, { "name": "macbook-keyboard-demo", "type": "registry:example", "title": "Macbook Keyboard Demo", "description": "Interactive animated MacBook keyboard component." }, { "name": "cpu-architecture-demo", "type": "registry:example", "title": "CPU Architecture Demo", "description": "A fully animated CPU architecture SVG component with dynamic paths, gradients, and optional CPU connections." }, { "name": "shadcn-ui-demo", "type": "registry:example", "title": "Shadcn UI Demo", "description": "Animated ShadCN UI SVG with glowing masked paths, motion shapes, and dynamic shimmering text with customizable props." }, { "name": "location-map-demo", "type": "registry:example", "title": "Location Map Demo", "description": "An interactive 3D-tilting location card with expandable animated map, live indicator, and motion-based hover effects." }, { "name": "3d-folder-demo", "type": "registry:example", "title": "3D Folder Demo", "description": "A 3D animated folder component that reveals project cards on hover and expands into a smooth image lightbox with keyboard navigation." }, { "name": "usage-card-demo", "type": "registry:example", "title": "Usage Card Demo", "description": "An animated system monitor card that displays a title, percentage, and neon-lit pill indicators driven by Motion." }, { "name": "voxel-wall-demo", "type": "registry:example", "title": "Voxel Wall Demo", "description": "A dark voxel tunnel with volumetric light rays, drifting cubes, and subtle camera parallax — ideal for hero backgrounds." } ], "component_count": 61, "components_truncated": false, "component_types": { "registry:style": 1, "registry:ui": 29, "registry:example": 30, "registry:lib": 1 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 69, "name": "@gc-solid", "category": "Component library (general)", "tags": [ "dashboard", "components" ], "tagline": "SolidJS port of shadcn-ui components built with Kobalte primitives. 57+ components with full TypeScript support and Vega theme.", "short_description": "SolidJS port of shadcn-ui components built with Kobalte primitives. 57+ components with full TypeScript support and Vega theme.", "description": "A SolidJS port of shadcn/ui built on Kobalte primitives, covering 57+ components including Accordion, Alert Dialog, Avatar, Breadcrumb, Button, Calendar, Carousel, Chart, Command, Combobox, Data Picker, Dialog, Drawer, Dropdown Menu, Form, Hover Card, Input OTP, Menubar, Navigation Menu, Pagination, Resizable, Sidebar, Skeleton, Sonner, Spinner, and more. Ships with a Vega theme, full TypeScript support, and Tailwind CSS v4. Installed via direct URL until official registry index inclusion. Use for: building fully accessible, shadcn-equivalent UIs in SolidJS/Vite projects.", "homepage": "https://binnodon.github.io/gc-solid-ui", "docs": "https://binnodon.github.io/gc-solid-ui", "github": "https://github.com/binnodon/gc-solid-ui", "components_github": "https://github.com/binnodon/gc-solid-ui/tree/main/src/registry", "github_default_branch": "main", "github_stars": 6, "last_commit": "2026-04-24T16:07:12Z", "archived": false, "license": null, "open_issues": 0, "registry_template": "https://binnodon.github.io/gc-solid-ui/r/{name}.json", "registry_index": "https://binnodon.github.io/gc-solid-ui/r/registry.json", "components": [ "utils", "accordion", "alert", "alert-dialog", "aspect-ratio", "avatar", "badge", "breadcrumb", "button", "card", "button-group", "calendar", "carousel", "chart", "checkbox", "collapsible", "combobox", "command", "context-menu", "date-picker", "dialog", "direction", "drawer", "dropdown-menu", "empty", "field", "form", "hover-card", "input", "input-group", "input-otp", "item", "kbd", "label", "menubar", "navigation-menu", "native-select", "pagination", "popover", "progress", "radio-group", "resizable", "scroll-area", "select", "separator", "sheet", "sidebar", "skeleton", "slider", "sonner", "spinner", "switch", "tabs", "table", "textarea", "toggle", "toggle-group", "tooltip", "use-mobile", "vega", "grasscup" ], "component_items": [ { "name": "utils", "type": "registry:lib", "title": null, "description": null }, { "name": "accordion", "type": "registry:ui", "title": null, "description": null }, { "name": "alert", "type": "registry:ui", "title": null, "description": null }, { "name": "alert-dialog", "type": "registry:ui", "title": null, "description": null }, { "name": "aspect-ratio", "type": "registry:ui", "title": null, "description": null }, { "name": "avatar", "type": "registry:ui", "title": null, "description": null }, { "name": "badge", "type": "registry:ui", "title": null, "description": null }, { "name": "breadcrumb", "type": "registry:ui", "title": null, "description": null }, { "name": "button", "type": "registry:ui", "title": null, "description": null }, { "name": "card", "type": "registry:ui", "title": null, "description": null }, { "name": "button-group", "type": "registry:ui", "title": null, "description": null }, { "name": "calendar", "type": "registry:ui", "title": null, "description": null }, { "name": "carousel", "type": "registry:ui", "title": null, "description": null }, { "name": "chart", "type": "registry:ui", "title": null, "description": null }, { "name": "checkbox", "type": "registry:ui", "title": null, "description": null }, { "name": "collapsible", "type": "registry:ui", "title": null, "description": null }, { "name": "combobox", "type": "registry:ui", "title": null, "description": null }, { "name": "command", "type": "registry:ui", "title": null, "description": null }, { "name": "context-menu", "type": "registry:ui", "title": null, "description": null }, { "name": "date-picker", "type": "registry:ui", "title": null, "description": null }, { "name": "dialog", "type": "registry:ui", "title": null, "description": null }, { "name": "direction", "type": "registry:ui", "title": null, "description": null }, { "name": "drawer", "type": "registry:ui", "title": null, "description": null }, { "name": "dropdown-menu", "type": "registry:ui", "title": null, "description": null }, { "name": "empty", "type": "registry:ui", "title": null, "description": null }, { "name": "field", "type": "registry:ui", "title": null, "description": null }, { "name": "form", "type": "registry:ui", "title": null, "description": null }, { "name": "hover-card", "type": "registry:ui", "title": null, "description": null }, { "name": "input", "type": "registry:ui", "title": null, "description": null }, { "name": "input-group", "type": "registry:ui", "title": null, "description": null }, { "name": "input-otp", "type": "registry:ui", "title": null, "description": null }, { "name": "item", "type": "registry:ui", "title": null, "description": null }, { "name": "kbd", "type": "registry:ui", "title": null, "description": null }, { "name": "label", "type": "registry:ui", "title": null, "description": null }, { "name": "menubar", "type": "registry:ui", "title": null, "description": null }, { "name": "navigation-menu", "type": "registry:ui", "title": null, "description": null }, { "name": "native-select", "type": "registry:ui", "title": null, "description": null }, { "name": "pagination", "type": "registry:ui", "title": null, "description": null }, { "name": "popover", "type": "registry:ui", "title": null, "description": null }, { "name": "progress", "type": "registry:ui", "title": null, "description": null }, { "name": "radio-group", "type": "registry:ui", "title": null, "description": null }, { "name": "resizable", "type": "registry:ui", "title": null, "description": null }, { "name": "scroll-area", "type": "registry:ui", "title": null, "description": null }, { "name": "select", "type": "registry:ui", "title": null, "description": null }, { "name": "separator", "type": "registry:ui", "title": null, "description": null }, { "name": "sheet", "type": "registry:ui", "title": null, "description": null }, { "name": "sidebar", "type": "registry:ui", "title": null, "description": null }, { "name": "skeleton", "type": "registry:ui", "title": null, "description": null }, { "name": "slider", "type": "registry:ui", "title": null, "description": null }, { "name": "sonner", "type": "registry:ui", "title": null, "description": null }, { "name": "spinner", "type": "registry:ui", "title": null, "description": null }, { "name": "switch", "type": "registry:ui", "title": null, "description": null }, { "name": "tabs", "type": "registry:ui", "title": null, "description": null }, { "name": "table", "type": "registry:ui", "title": null, "description": null }, { "name": "textarea", "type": "registry:ui", "title": null, "description": null }, { "name": "toggle", "type": "registry:ui", "title": null, "description": null }, { "name": "toggle-group", "type": "registry:ui", "title": null, "description": null }, { "name": "tooltip", "type": "registry:ui", "title": null, "description": null }, { "name": "use-mobile", "type": "registry:hook", "title": null, "description": null }, { "name": "vega", "type": "registry:style", "title": null, "description": null } ], "component_count": 61, "components_truncated": false, "component_types": { "registry:lib": 1, "registry:ui": 57, "registry:hook": 1, "registry:style": 2 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 70, "name": "@glass-ui", "category": "Theming/styling", "tags": [ "ai", "aesthetic" ], "tagline": "A shadcn-ui compatible registry distributing 40+ glassmorphic React/TypeScript components with Apple-inspired design. Components include enhanced visual effects (glow, shimmer, ripple), theme support, and customizable glassmorphism styling.", "short_description": "A shadcn-ui compatible registry distributing 40+ glassmorphic React/TypeScript components with Apple-inspired design. Components include enhanced visual effects (glow, shimmer, ripple), theme support, and customizable glassmorphism styling.", "description": "A shadcn-compatible registry of 49 glassmorphic React/TypeScript components with an Apple-inspired dark-glass aesthetic. Covers the full shadcn primitive set (Accordion through Tooltip) in glass variants, plus unique additions: Cropper, Date Picker Input, Empty State, Spinner, and Input Group. Components default to glass styling via Tailwind CSS v4 and include a Liquid Glass variant with SVG displacement refraction. Includes MCP server configuration for AI-assisted integration. Free and open-source. Use for: building apps that need a cohesive frosted-glass or liquid-glass visual identity across all interactive controls.", "homepage": "https://glass-ui.crenspire.com", "docs": "https://glass-ui.crenspire.com/docs", "github": "https://github.com/crenspire/glass-ui", "components_github": "https://github.com/crenspire/glass-ui/tree/develop/registry", "github_default_branch": "develop", "github_stars": 85, "last_commit": "2026-04-10T12:53:49Z", "archived": false, "license": null, "open_issues": 0, "registry_template": "https://glass-ui.crenspire.com/r/{name}.json", "registry_index": "https://glass-ui.crenspire.com/r/registry.json", "components": [ "button", "card", "input", "textarea", "label", "badge", "avatar", "dialog", "alert-dialog", "separator", "switch", "checkbox", "tabs", "tooltip", "popover", "dropdown-menu", "select", "radio-group", "skeleton", "alert", "accordion", "breadcrumb", "calendar", "chart", "collapsible", "command", "cropper", "drawer", "hover-card", "input-otp", "navigation-menu", "pagination", "scroll-area", "sheet", "sidebar", "slider", "sonner", "table", "toggle", "toggle-group", "mode-toggle", "spinner", "button-group", "input-group", "empty-state", "menu-bar", "date-picker-input", "context-menu", "carousel" ], "component_items": [ { "name": "button", "type": "registry:component", "title": "Button", "description": "Displays a button or a component that looks like a button with glassy variants." }, { "name": "card", "type": "registry:component", "title": "Card", "description": "Displays a card with optional glassy variant." }, { "name": "input", "type": "registry:component", "title": "Input", "description": "Displays a form input field with optional glassy variant." }, { "name": "textarea", "type": "registry:component", "title": "Textarea", "description": "Displays a form textarea with optional glassy variant." }, { "name": "label", "type": "registry:component", "title": "Label", "description": "Renders an accessible label associated with controls." }, { "name": "badge", "type": "registry:component", "title": "Badge", "description": "Displays a badge or a component that looks like a badge with glassy variant." }, { "name": "avatar", "type": "registry:component", "title": "Avatar", "description": "An image element with a fallback for representing the user." }, { "name": "dialog", "type": "registry:component", "title": "Dialog", "description": "A window overlaid on either the primary window or another dialog window, rendering the content underneath inert." }, { "name": "alert-dialog", "type": "registry:component", "title": "Alert Dialog", "description": "A modal dialog that interrupts the user with important content and expects a response." }, { "name": "separator", "type": "registry:component", "title": "Separator", "description": "Visually or semantically separates content with optional glassy variant." }, { "name": "switch", "type": "registry:component", "title": "Switch", "description": "A control that allows the user to toggle between checked and not checked with optional glassy variant." }, { "name": "checkbox", "type": "registry:component", "title": "Checkbox", "description": "A control that allows the user to toggle between checked and not checked with optional glassy variant." }, { "name": "tabs", "type": "registry:component", "title": "Tabs", "description": "A set of layered sections of content—known as tab panels—that are displayed one at a time with optional glassy variant." }, { "name": "tooltip", "type": "registry:component", "title": "Tooltip", "description": "A popup that displays information related to an element when the element receives keyboard focus or the mouse hovers over it with optional glassy variant." }, { "name": "popover", "type": "registry:component", "title": "Popover", "description": "Displays rich content in a portal, triggered by a button with optional glassy variant." }, { "name": "dropdown-menu", "type": "registry:component", "title": "Dropdown Menu", "description": "Displays a menu to the user — such as a set of actions or functions — triggered by a button with optional glassy variant." }, { "name": "select", "type": "registry:component", "title": "Select", "description": "Displays a list of options for the user to pick from—triggered by a button with optional glassy variant." }, { "name": "radio-group", "type": "registry:component", "title": "Radio Group", "description": "A set of checkable buttons—known as radio buttons—where no more than one of the buttons can be checked at a time with optional glassy variant." }, { "name": "skeleton", "type": "registry:component", "title": "Skeleton", "description": "Use to show a placeholder while content is loading with optional glassy variant." }, { "name": "alert", "type": "registry:component", "title": "Alert", "description": "Displays a callout for user attention with optional glassy variant." }, { "name": "accordion", "type": "registry:component", "title": "Accordion", "description": "A vertically stacked set of interactive headings that each reveal a section of content." }, { "name": "breadcrumb", "type": "registry:component", "title": "Breadcrumb", "description": "Displays the path to the current resource using a hierarchy of links." }, { "name": "calendar", "type": "registry:component", "title": "Calendar", "description": "A date field component that allows users to enter and edit date." }, { "name": "chart", "type": "registry:component", "title": "Chart", "description": "Chart components built with Recharts with optional glassy variant." }, { "name": "collapsible", "type": "registry:component", "title": "Collapsible", "description": "An interactive component which expands/collapses a panel." }, { "name": "command", "type": "registry:component", "title": "Command", "description": "Fast, composable, unstyled command menu for React." }, { "name": "cropper", "type": "registry:component", "title": "Cropper", "description": "An image cropper component with optional glassy variant." }, { "name": "drawer", "type": "registry:component", "title": "Drawer", "description": "A drawer component for mobile with optional glassy variant." }, { "name": "hover-card", "type": "registry:component", "title": "Hover Card", "description": "For sighted users to preview content available behind a link." }, { "name": "input-otp", "type": "registry:component", "title": "Input OTP", "description": "Accessible one-time password component with copy paste functionality." }, { "name": "navigation-menu", "type": "registry:component", "title": "Navigation Menu", "description": "A collection of links for navigating websites." }, { "name": "pagination", "type": "registry:component", "title": "Pagination", "description": "Pagination with page navigation with optional glassy variant." }, { "name": "scroll-area", "type": "registry:component", "title": "Scroll Area", "description": "Augments native scroll functionality for custom, cross-browser styling." }, { "name": "sheet", "type": "registry:component", "title": "Sheet", "description": "Extends the Dialog component to display content that complements the main content of the screen." }, { "name": "sidebar", "type": "registry:component", "title": "Sidebar", "description": "A sidebar component with optional glassy variant." }, { "name": "slider", "type": "registry:component", "title": "Slider", "description": "An input where the user selects a value from within a given range." }, { "name": "sonner", "type": "registry:component", "title": "Sonner", "description": "An opinionated toast component for React." }, { "name": "table", "type": "registry:component", "title": "Table", "description": "A responsive table component with optional glassy variant." }, { "name": "toggle", "type": "registry:component", "title": "Toggle", "description": "A two-state button that can be either on or off." }, { "name": "toggle-group", "type": "registry:component", "title": "Toggle Group", "description": "A set of two-state buttons that can be toggled on or off." }, { "name": "mode-toggle", "type": "registry:component", "title": "Mode Toggle", "description": "A theme switcher component with optional glassy variant." }, { "name": "spinner", "type": "registry:component", "title": "Spinner", "description": "A loading spinner component with glassy variants." }, { "name": "button-group", "type": "registry:component", "title": "Button Group", "description": "A group of buttons with glassy variants." }, { "name": "input-group", "type": "registry:component", "title": "Input Group", "description": "A group of inputs with glassy variants." }, { "name": "empty-state", "type": "registry:component", "title": "Empty State", "description": "An empty state component with glassy variants." }, { "name": "menu-bar", "type": "registry:component", "title": "Menu Bar", "description": "A menu bar component with glassy variants." }, { "name": "date-picker-input", "type": "registry:component", "title": "Date Picker Input", "description": "A date picker input component with glassy variants." }, { "name": "context-menu", "type": "registry:component", "title": "Context Menu", "description": "A context menu component with glassy variants." }, { "name": "carousel", "type": "registry:component", "title": "Carousel", "description": "A carousel component with glassy variants." } ], "component_count": 49, "components_truncated": false, "component_types": { "registry:component": 49 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 71, "name": "@glasscn", "category": "Theming/styling", "tags": [ "aesthetic" ], "tagline": "A shadcn-compatible registry of glassmorphism components inspired by Apple", "short_description": "A shadcn-compatible registry of glassmorphism components inspired by Apple", "description": "A glassmorphism component library layered on shadcn/ui, offering ~20 glass-variant primitives (Glass Alert, Alert Dialog, Badge, Button, Button Group, Calendar, Card, Checkbox, Code Block Command, Command, Combobox, Input, Item, Popover, Radio Group, Select, Separator, Sidebar, Skeleton) plus Glass Variants utility and liquid-glass button variants (clear, frosted, subtle, liquid, liquid-refract via SVG displacement). Installable via npx shadcn add @glasscn/. Free and open-source for Next.js/React. Use for: applying a consistent translucent glass aesthetic to a subset of shadcn UI controls with minimal friction.", "homepage": "https://glasscn-components.vercel.app/", "docs": "https://glasscn-components.vercel.app", "github": "https://github.com/kostyniuk/glasscn-components", "components_github": "https://github.com/kostyniuk/glasscn-components/tree/master/components", "github_default_branch": "master", "github_stars": 58, "last_commit": "2026-07-03T21:09:38Z", "archived": false, "license": null, "open_issues": 0, "registry_template": "https://glasscn-components.vercel.app/r/{name}.json", "registry_index": "https://glasscn-components.vercel.app/r/registry.json", "components": [ "utils", "highlight-text", "button", "badge", "avatar", "checkbox", "input", "textarea", "input-group", "item", "combobox", "command", "dropdown-menu", "select", "switch", "progress", "glass-button", "glass-badge", "glass-checkbox", "glass-command", "glass-dropdown-menu", "glass-combobox", "glass-select", "card", "liquid-glass", "glass-card", "glass-scrim-card", "glance", "glass-contact-pill", "glass-icon", "calendar", "glass-calendar", "glass-variants", "wavy-border", "sheet", "separator", "skeleton", "button-group", "popover", "radio-group", "tooltip", "sidebar", "glass-separator", "glass-sidebar", "alert", "alert-dialog", "dialog", "glass-alert", "glass-alert-dialog", "code-block-command", "glass-code-block-command", "component-preview", "glass-button-group", "glass-toggle-group", "glass-input", "glass-item", "glass-popover", "glass-progress", "glass-radio-group", "glass-skeleton", "liquid-text", "liquid-watch", "liquid-switch", "liquid-badge", "preference" ], "component_items": [ { "name": "utils", "type": "registry:lib", "title": "Utils", "description": null }, { "name": "highlight-text", "type": "registry:component", "title": "Highlight Text", "description": "Inline text highlight with preset color variants and custom background class support." }, { "name": "button", "type": "registry:ui", "title": "Button", "description": null }, { "name": "badge", "type": "registry:ui", "title": "Badge", "description": null }, { "name": "avatar", "type": "registry:ui", "title": "Avatar", "description": null }, { "name": "checkbox", "type": "registry:ui", "title": "Checkbox", "description": null }, { "name": "input", "type": "registry:ui", "title": "Input", "description": null }, { "name": "textarea", "type": "registry:ui", "title": "Textarea", "description": null }, { "name": "input-group", "type": "registry:ui", "title": "Input Group", "description": null }, { "name": "item", "type": "registry:ui", "title": "Item", "description": null }, { "name": "combobox", "type": "registry:ui", "title": "Combobox", "description": null }, { "name": "command", "type": "registry:ui", "title": "Command", "description": null }, { "name": "dropdown-menu", "type": "registry:ui", "title": "Dropdown Menu", "description": null }, { "name": "select", "type": "registry:ui", "title": "Select", "description": null }, { "name": "switch", "type": "registry:ui", "title": "Switch", "description": null }, { "name": "progress", "type": "registry:ui", "title": "Progress", "description": null }, { "name": "glass-button", "type": "registry:component", "title": "Glass Button", "description": "Glass Button with five variants: clear, frosted, subtle, liquid, and liquid-refract" }, { "name": "glass-badge", "type": "registry:component", "title": "Glass Badge", "description": "Glass Badge with five variants: clear, frosted, subtle, liquid, and liquid-refract" }, { "name": "glass-checkbox", "type": "registry:component", "title": "Glass Checkbox", "description": "Glass Checkbox with five variants: clear, frosted, subtle, liquid, and liquid-refract" }, { "name": "glass-command", "type": "registry:component", "title": "Glass Command", "description": "Glass Command with five variants: clear, frosted, subtle, liquid, and liquid-refract" }, { "name": "glass-dropdown-menu", "type": "registry:component", "title": "Glass Dropdown Menu", "description": "Glass Dropdown Menu with five variants: clear, frosted, subtle, liquid, and liquid-refract" }, { "name": "glass-combobox", "type": "registry:component", "title": "Glass Combobox", "description": "Glass Combobox with five variants: clear, frosted, subtle, liquid, and liquid-refract" }, { "name": "glass-select", "type": "registry:component", "title": "Glass Select", "description": "Glass Select with five variants: clear, frosted, subtle, liquid, and liquid-refract" }, { "name": "card", "type": "registry:ui", "title": "Card", "description": null }, { "name": "liquid-glass", "type": "registry:component", "title": "Liquid Glass", "description": "Low-level refractive glass wrapper used by liquid-refract components." }, { "name": "glass-card", "type": "registry:component", "title": "Glass Card", "description": "Glass Card with five variants: clear, frosted, subtle, liquid, and liquid-refract" }, { "name": "glass-scrim-card", "type": "registry:component", "title": "Glass Scrim Card", "description": "Siri-style liquid-refract card with a black scrim that eases from one edge into clear glass" }, { "name": "glance", "type": "registry:item", "title": "Glance", "description": "CSS-only hover shine. Add the glance class to any element and a diagonal highlight sweeps across it once per hover" }, { "name": "glass-contact-pill", "type": "registry:component", "title": "Glass Contact Pill", "description": "Liquid-glass contact chip with an avatar (image or initials fallback) and name, for messaging apps" }, { "name": "glass-icon", "type": "registry:component", "title": "Glass Icon", "description": "A circular glass chip that wraps any icon, iOS-control-center style. Preset sizes scale the circle and icon together so grids of icons stay uniform." }, { "name": "calendar", "type": "registry:ui", "title": "Calendar", "description": null }, { "name": "glass-calendar", "type": "registry:component", "title": "Glass Calendar", "description": "Glass Calendar with five variants: clear, frosted, subtle, liquid, and liquid-refract" }, { "name": "glass-variants", "type": "registry:lib", "title": "Glass Variants", "description": null }, { "name": "wavy-border", "type": "registry:style", "title": "Wavy Border", "description": "A global CSS class that applies a small, even wavy border shape." }, { "name": "sheet", "type": "registry:ui", "title": "Sheet", "description": null }, { "name": "separator", "type": "registry:ui", "title": "Separator", "description": null }, { "name": "skeleton", "type": "registry:ui", "title": "Skeleton", "description": null }, { "name": "button-group", "type": "registry:ui", "title": "Button Group", "description": null }, { "name": "popover", "type": "registry:ui", "title": "Popover", "description": null }, { "name": "radio-group", "type": "registry:ui", "title": "Radio Group", "description": null }, { "name": "tooltip", "type": "registry:ui", "title": "Tooltip", "description": null }, { "name": "sidebar", "type": "registry:ui", "title": "Sidebar", "description": null }, { "name": "glass-separator", "type": "registry:component", "title": "Glass Separator", "description": "Glass Separator with five variants: clear, frosted, subtle, liquid, and liquid-refract" }, { "name": "glass-sidebar", "type": "registry:component", "title": "Glass Sidebar", "description": "Glass Sidebar with five variants: clear, frosted, subtle, liquid, and liquid-refract" }, { "name": "alert", "type": "registry:ui", "title": "Alert", "description": null }, { "name": "alert-dialog", "type": "registry:ui", "title": "Alert Dialog", "description": null }, { "name": "dialog", "type": "registry:ui", "title": "Dialog", "description": null }, { "name": "glass-alert", "type": "registry:component", "title": "Glass Alert", "description": "Glass Alert with five variants: clear, frosted, subtle, liquid, and liquid-refract" }, { "name": "glass-alert-dialog", "type": "registry:component", "title": "Glass Alert Dialog", "description": "Glass Alert Dialog with five variants: clear, frosted, subtle, liquid, and liquid-refract" }, { "name": "code-block-command", "type": "registry:ui", "title": "Code Block Command", "description": null }, { "name": "glass-code-block-command", "type": "registry:component", "title": "Glass Code Block Command", "description": "Glass Code Block Command with five variants: clear, frosted, subtle, liquid, and liquid-refract" }, { "name": "component-preview", "type": "registry:component", "title": "Component Preview", "description": "A preview shell for component demos with switchable default and glass variants." }, { "name": "glass-button-group", "type": "registry:component", "title": "Glass Button Group", "description": "Glass Button Group with five variants: clear, frosted, subtle, liquid, and liquid-refract" }, { "name": "glass-toggle-group", "type": "registry:component", "title": "Glass Toggle Group", "description": "A segmented control with a sliding glass puck indicator supporting icons, text, or any React content." }, { "name": "glass-input", "type": "registry:component", "title": "Glass Input", "description": "Glass Input with five variants: clear, frosted, subtle, liquid, and liquid-refract" }, { "name": "glass-item", "type": "registry:component", "title": "Glass Item", "description": "Glass Item with five variants: clear, frosted, subtle, liquid, and liquid-refract" }, { "name": "glass-popover", "type": "registry:component", "title": "Glass Popover", "description": "Glass Popover with five variants: clear, frosted, subtle, liquid, and liquid-refract" }, { "name": "glass-progress", "type": "registry:component", "title": "Glass Progress", "description": "Glass Progress with five variants: clear, frosted, subtle, liquid, and liquid-refract" }, { "name": "glass-radio-group", "type": "registry:component", "title": "Glass Radio Group", "description": "Glass Radio Group with five variants: clear, frosted, subtle, liquid, and liquid-refract" }, { "name": "glass-skeleton", "type": "registry:component", "title": "Glass Skeleton", "description": "Glass Skeleton with five variants: clear, frosted, subtle, liquid, and liquid-refract" } ], "component_count": 65, "components_truncated": false, "component_types": { "registry:lib": 2, "registry:component": 33, "registry:ui": 28, "registry:item": 1, "registry:style": 1 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 72, "name": "@gooseui", "category": "Animated components", "tags": [ "aesthetic" ], "tagline": "Open source component library with animated components, beautiful effects, and custom toast notifications. Built with Radix UI and Tailwind CSS.", "short_description": "Open source component library with animated components, beautiful effects, and custom toast notifications. Built with Radix UI and Tailwind CSS.", "description": "A small open-source shadcn/ui extension registry for React, styled with Tailwind CSS v4 and Motion (Framer Motion) animations. Includes Button, Card, Input, Label, Textarea, Typography, Theme Customizer (5 floating variants), Animated Timer, Border Beam effect, custom Toast/Sonner with progress bar, and a ready-made Contact Form block. Dark/light mode with next-themes; built on Radix UI primitives. Free and MIT-licensed. Use for: adding tasteful motion effects and a unified theme customizer to React/Next.js apps without heavy dependencies.", "homepage": "https://gooseui.pro", "docs": "https://gooseui.pro/docs", "github": "https://github.com/goosen-x/gooseui", "components_github": "https://github.com/goosen-x/gooseui/tree/main/registry", "github_default_branch": "main", "github_stars": 30, "last_commit": "2026-03-27T06:32:45Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://gooseui.pro/r/{name}.json", "registry_index": "https://gooseui.pro/r/registry.json", "components": [ "theme-customizer", "animated-timer", "border-beam", "slot", "button", "card", "input", "label", "textarea", "typography", "sonner", "custom-toast", "toast", "promo-banner", "morphing-dialog", "baseline-status", "features-grid", "badge", "scroll-to-top" ], "component_items": [ { "name": "theme-customizer", "type": "registry:ui", "title": "Theme Customizer", "description": "Floating theme and color picker with 5 different variants." }, { "name": "animated-timer", "type": "registry:ui", "title": "Animated Timer", "description": "A beautiful animated clock with sliding digits and gradient border." }, { "name": "border-beam", "type": "registry:ui", "title": "Border Beam", "description": "Animated beam of light traveling along the border of a container." }, { "name": "slot", "type": "registry:lib", "title": "Slot", "description": "Composition utility for asChild pattern. Renders child element with merged props." }, { "name": "button", "type": "registry:ui", "title": "Button", "description": "Displays a button or a component that looks like a button." }, { "name": "card", "type": "registry:ui", "title": "Card", "description": "Displays a card with header, content, and footer." }, { "name": "input", "type": "registry:ui", "title": "Input", "description": "Displays an input field." }, { "name": "label", "type": "registry:ui", "title": "Label", "description": "Renders an accessible label associated with controls." }, { "name": "textarea", "type": "registry:ui", "title": "Textarea", "description": "Displays a textarea for multiline text input." }, { "name": "typography", "type": "registry:ui", "title": "Typography", "description": "Consistent text styling with semantic variants and gradient effects." }, { "name": "sonner", "type": "registry:ui", "title": "Sonner", "description": "Toast notification component with theming support." }, { "name": "custom-toast", "type": "registry:ui", "title": "Custom Toast", "description": "Beautiful toast with progress bar and colored variants." }, { "name": "toast", "type": "registry:lib", "title": "Toast Utility", "description": "Helper functions to show custom toast notifications." }, { "name": "promo-banner", "type": "registry:ui", "title": "Promo Banner", "description": "Floating promotional banner with marquee animation, discount badges, and localStorage persistence." }, { "name": "morphing-dialog", "type": "registry:ui", "title": "Morphing Dialog", "description": "Dialog with morphing animation using native View Transitions API. Supports click-outside and Escape key." }, { "name": "baseline-status", "type": "registry:ui", "title": "Baseline Status", "description": "Display browser support status for web features based on the W3C WebDX Baseline specification. Includes real-time browser feature detection." }, { "name": "features-grid", "type": "registry:component", "title": "Features Grid", "description": "Six-column grid showcasing product features with icons. Perfect for landing pages." }, { "name": "badge", "type": "registry:ui", "title": "Badge", "description": "Small status indicator with variants for labels, tags, and status." }, { "name": "scroll-to-top", "type": "registry:ui", "title": "Scroll To Top", "description": "Floating scroll-to-top button with 4 variants: default, pill, minimal, and progress indicator." } ], "component_count": 19, "components_truncated": false, "component_types": { "registry:ui": 16, "registry:lib": 2, "registry:component": 1 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 85, "name": "@gpt-vis", "category": "Uncategorized", "tags": [], "tagline": "AI-native visualization components for LLM projects. Render 26 chart types from vis syntax strings or config objects.", "short_description": "", "description": "AI-native visualization components for LLM projects. Render 26 chart types from vis syntax strings or config objects.", "homepage": "https://gpt-vis.antv.vision", "docs": "https://gpt-vis.antv.vision/docs", "github": "https://github.com/antvis/GPT-Vis", "components_github": null, "github_default_branch": "ai", "github_stars": 753, "last_commit": "2026-06-26T02:18:29Z", "archived": false, "license": "MIT", "open_issues": 2, "registry_template": "https://gpt-vis.antv.vision/r/{name}.json", "registry_index": "https://gpt-vis.antv.vision/r/registry.json", "components": [ "gpt-vis", "line", "pie", "bar", "column", "area", "scatter", "radar", "funnel", "waterfall", "histogram", "boxplot", "violin", "dual-axes", "liquid", "word-cloud", "sankey", "treemap", "venn", "summary", "table", "mindmap", "fishbone-diagram", "flow-diagram", "network-graph", "organization-chart", "indented-tree" ], "component_items": [ { "name": "gpt-vis", "type": "registry:ui", "title": "GPT-Vis", "description": "A React component wrapping the @antv/gpt-vis GPTVis class. Supports 26 chart types via vis syntax strings or config objects. Ideal for LLM-generated visualizat…" }, { "name": "line", "type": "registry:ui", "title": "GPT-Vis Line Chart", "description": "A line chart component for @antv/gpt-vis. Visualize trends over time with optional multi-series grouping." }, { "name": "pie", "type": "registry:ui", "title": "GPT-Vis Pie Chart", "description": "A pie chart component for @antv/gpt-vis. Show proportions of parts with optional donut style." }, { "name": "bar", "type": "registry:ui", "title": "GPT-Vis Bar Chart", "description": "A horizontal bar chart component for @antv/gpt-vis. Compare categorical data with optional grouping and stacking." }, { "name": "column", "type": "registry:ui", "title": "GPT-Vis Column Chart", "description": "A vertical column chart component for @antv/gpt-vis. Compare categorical data with optional grouping and stacking." }, { "name": "area", "type": "registry:ui", "title": "GPT-Vis Area Chart", "description": "An area chart component for @antv/gpt-vis. Show data trends over time with optional stacking." }, { "name": "scatter", "type": "registry:ui", "title": "GPT-Vis Scatter Chart", "description": "A scatter chart component for @antv/gpt-vis. Show relationships between two variables with optional grouping." }, { "name": "radar", "type": "registry:ui", "title": "GPT-Vis Radar Chart", "description": "A radar chart component for @antv/gpt-vis. Display multidimensional data across four or more axes." }, { "name": "funnel", "type": "registry:ui", "title": "GPT-Vis Funnel Chart", "description": "A funnel chart component for @antv/gpt-vis. Visualize progressive data reduction through stages." }, { "name": "waterfall", "type": "registry:ui", "title": "GPT-Vis Waterfall Chart", "description": "A waterfall chart component for @antv/gpt-vis. Show cumulative effect of sequential positive and negative values." }, { "name": "histogram", "type": "registry:ui", "title": "GPT-Vis Histogram Chart", "description": "A histogram chart component for @antv/gpt-vis. Show frequency distribution of data points within ranges." }, { "name": "boxplot", "type": "registry:ui", "title": "GPT-Vis Boxplot Chart", "description": "A boxplot chart component for @antv/gpt-vis. Compare statistical distributions across categories." }, { "name": "violin", "type": "registry:ui", "title": "GPT-Vis Violin Chart", "description": "A violin chart component for @antv/gpt-vis. Show data distribution density across categories." }, { "name": "dual-axes", "type": "registry:ui", "title": "GPT-Vis Dual Axes Chart", "description": "A dual axes chart component for @antv/gpt-vis. Combine column and line charts for trend and comparison." }, { "name": "liquid", "type": "registry:ui", "title": "GPT-Vis Liquid Chart", "description": "A liquid fill chart component for @antv/gpt-vis. Display a single percentage value with various shapes." }, { "name": "word-cloud", "type": "registry:ui", "title": "GPT-Vis Word Cloud Chart", "description": "A word cloud chart component for @antv/gpt-vis. Visualize word frequency by text size." }, { "name": "sankey", "type": "registry:ui", "title": "GPT-Vis Sankey Diagram", "description": "A sankey diagram component for @antv/gpt-vis. Show data flow between stages or categories." }, { "name": "treemap", "type": "registry:ui", "title": "GPT-Vis Treemap Chart", "description": "A treemap chart component for @antv/gpt-vis. Display hierarchical data with nested rectangles." }, { "name": "venn", "type": "registry:ui", "title": "GPT-Vis Venn Diagram", "description": "A Venn diagram component for @antv/gpt-vis. Show set relationships and intersections." }, { "name": "summary", "type": "registry:ui", "title": "GPT-Vis Summary", "description": "A summary component for @antv/gpt-vis. Render rich text narratives with T8 markdown-like syntax." }, { "name": "table", "type": "registry:ui", "title": "GPT-Vis Table", "description": "A table component for @antv/gpt-vis. Display tabular data with optional theming." }, { "name": "mindmap", "type": "registry:ui", "title": "GPT-Vis Mind Map", "description": "A mind map component for @antv/gpt-vis. Organize hierarchical information with branches from a central topic." }, { "name": "fishbone-diagram", "type": "registry:ui", "title": "GPT-Vis Fishbone Diagram", "description": "A fishbone diagram component for @antv/gpt-vis. Display cause-and-effect analysis with a fish skeleton structure." }, { "name": "flow-diagram", "type": "registry:ui", "title": "GPT-Vis Flow Diagram", "description": "A flow diagram component for @antv/gpt-vis. Show process steps and decision points." }, { "name": "network-graph", "type": "registry:ui", "title": "GPT-Vis Network Graph", "description": "A network graph component for @antv/gpt-vis. Display relationships between entities with various layouts." }, { "name": "organization-chart", "type": "registry:ui", "title": "GPT-Vis Organization Chart", "description": "An organization chart component for @antv/gpt-vis. Visualize hierarchical organizational structures." }, { "name": "indented-tree", "type": "registry:ui", "title": "GPT-Vis Indented Tree", "description": "An indented tree component for @antv/gpt-vis. Display hierarchical data with indented layout." } ], "component_count": 27, "components_truncated": false, "component_types": { "registry:ui": 27 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 73, "name": "@gymnopedies", "category": "Personal/portfolio registry", "tags": [ "aesthetic" ], "tagline": "A dark, serif, glow-leaning shadcn registry of read-only components for blogs, essays, and long-form reading experiences — inspired by the quiet, candlelit cabaret of Erik Satie's Gymnopédies.", "short_description": "A dark, serif, glow-leaning shadcn registry of read-only components for blogs, essays, and long-form reading experiences — inspired by the quiet, candlelit cabaret of Erik Satie's Gymnopédies.", "description": "A dark, serif, glow-leaning shadcn registry of read-only React components for blogs, essays, and long-form reading — inspired by Erik Satie's Gymnopedies. Ships 35 non-form shadcn primitives (all standard overlays, navigation, and data components) plus 5 bespoke blog components: Hero (full-bleed cover with lighting animation), Picture (grayscale/reveal figure), Content (article paragraph container), DateTime (date-fns formatted time), and Header Navigation (gradient glow header). Built with Tailwind CSS v4 and Base UI; Merriweather serif font. Use for: building editorial sites or personal blogs that want a moody, candlelit dark aesthetic out of the box.", "homepage": "https://gymnopedies.shoota.work", "docs": "https://gymnopedies.shoota.work", "github": "https://github.com/shoota/gymnopedies", "components_github": "https://github.com/shoota/gymnopedies/tree/main/src/components", "github_default_branch": "main", "github_stars": 5, "last_commit": "2026-07-03T14:52:52Z", "archived": false, "license": "MIT", "open_issues": 11, "registry_template": "https://gymnopedies.shoota.work/r/{name}.json", "registry_index": "https://gymnopedies.shoota.work/r/registry.json", "components": [ "utils", "theme", "accordion", "alert", "alert-dialog", "aspect-ratio", "avatar", "badge", "breadcrumb", "button", "card", "carousel", "chart", "collapsible", "command", "context-menu", "dialog", "drawer", "dropdown-menu", "hover-card", "input", "input-group", "menubar", "navigation-menu", "pagination", "popover", "progress", "resizable", "scroll-area", "separator", "sheet", "sidebar", "skeleton", "sonner", "table", "tabs", "textarea", "toggle", "toggle-group", "tooltip", "article", "content", "date-time", "global-styles", "header-navigation", "hero", "picture", "use-mobile", "gymnopedies" ], "component_items": [ { "name": "utils", "type": "registry:lib", "title": "cn utility", "description": "Class-name merging helper (clsx + tailwind-merge)." }, { "name": "theme", "type": "registry:style", "title": "Gymnopédies Theme", "description": "Dark, serif, glow-leaning theme tokens — the gymnopédies identity layer." }, { "name": "accordion", "type": "registry:ui", "title": "Accordion", "description": "Accordion — gymnopédies-themed shadcn primitive." }, { "name": "alert", "type": "registry:ui", "title": "Alert", "description": "Alert — gymnopédies-themed shadcn primitive." }, { "name": "alert-dialog", "type": "registry:ui", "title": "Alert Dialog", "description": "Alert Dialog — gymnopédies-themed shadcn primitive." }, { "name": "aspect-ratio", "type": "registry:ui", "title": "Aspect Ratio", "description": "Aspect Ratio — gymnopédies-themed shadcn primitive." }, { "name": "avatar", "type": "registry:ui", "title": "Avatar", "description": "Avatar — gymnopédies-themed shadcn primitive." }, { "name": "badge", "type": "registry:ui", "title": "Badge", "description": "Badge — gymnopédies-themed shadcn primitive." }, { "name": "breadcrumb", "type": "registry:ui", "title": "Breadcrumb", "description": "Breadcrumb — gymnopédies-themed shadcn primitive." }, { "name": "button", "type": "registry:ui", "title": "Button", "description": "Button — gymnopédies-themed shadcn primitive." }, { "name": "card", "type": "registry:ui", "title": "Card", "description": "Card — gymnopédies-themed shadcn primitive." }, { "name": "carousel", "type": "registry:ui", "title": "Carousel", "description": "Carousel — gymnopédies-themed shadcn primitive." }, { "name": "chart", "type": "registry:ui", "title": "Chart", "description": "Chart — gymnopédies-themed shadcn primitive." }, { "name": "collapsible", "type": "registry:ui", "title": "Collapsible", "description": "Collapsible — gymnopédies-themed shadcn primitive." }, { "name": "command", "type": "registry:ui", "title": "Command", "description": "Command — gymnopédies-themed shadcn primitive." }, { "name": "context-menu", "type": "registry:ui", "title": "Context Menu", "description": "Context Menu — gymnopédies-themed shadcn primitive." }, { "name": "dialog", "type": "registry:ui", "title": "Dialog", "description": "Dialog — gymnopédies-themed shadcn primitive." }, { "name": "drawer", "type": "registry:ui", "title": "Drawer", "description": "Drawer — gymnopédies-themed shadcn primitive." }, { "name": "dropdown-menu", "type": "registry:ui", "title": "Dropdown Menu", "description": "Dropdown Menu — gymnopédies-themed shadcn primitive." }, { "name": "hover-card", "type": "registry:ui", "title": "Hover Card", "description": "Hover Card — gymnopédies-themed shadcn primitive." }, { "name": "input", "type": "registry:ui", "title": "Input", "description": "Input — gymnopédies-themed shadcn primitive." }, { "name": "input-group", "type": "registry:ui", "title": "Input Group", "description": "Input Group — gymnopédies-themed shadcn primitive." }, { "name": "menubar", "type": "registry:ui", "title": "Menubar", "description": "Menubar — gymnopédies-themed shadcn primitive." }, { "name": "navigation-menu", "type": "registry:ui", "title": "Navigation Menu", "description": "Navigation Menu — gymnopédies-themed shadcn primitive." }, { "name": "pagination", "type": "registry:ui", "title": "Pagination", "description": "Pagination — gymnopédies-themed shadcn primitive." }, { "name": "popover", "type": "registry:ui", "title": "Popover", "description": "Popover — gymnopédies-themed shadcn primitive." }, { "name": "progress", "type": "registry:ui", "title": "Progress", "description": "Progress — gymnopédies-themed shadcn primitive." }, { "name": "resizable", "type": "registry:ui", "title": "Resizable", "description": "Resizable — gymnopédies-themed shadcn primitive." }, { "name": "scroll-area", "type": "registry:ui", "title": "Scroll Area", "description": "Scroll Area — gymnopédies-themed shadcn primitive." }, { "name": "separator", "type": "registry:ui", "title": "Separator", "description": "Separator — gymnopédies-themed shadcn primitive." }, { "name": "sheet", "type": "registry:ui", "title": "Sheet", "description": "Sheet — gymnopédies-themed shadcn primitive." }, { "name": "sidebar", "type": "registry:ui", "title": "Sidebar", "description": "Sidebar — gymnopédies-themed shadcn primitive." }, { "name": "skeleton", "type": "registry:ui", "title": "Skeleton", "description": "Skeleton — gymnopédies-themed shadcn primitive." }, { "name": "sonner", "type": "registry:ui", "title": "Sonner", "description": "Sonner — gymnopédies-themed shadcn primitive." }, { "name": "table", "type": "registry:ui", "title": "Table", "description": "Table — gymnopédies-themed shadcn primitive." }, { "name": "tabs", "type": "registry:ui", "title": "Tabs", "description": "Tabs — gymnopédies-themed shadcn primitive." }, { "name": "textarea", "type": "registry:ui", "title": "Textarea", "description": "Textarea — gymnopédies-themed shadcn primitive." }, { "name": "toggle", "type": "registry:ui", "title": "Toggle", "description": "Toggle — gymnopédies-themed shadcn primitive." }, { "name": "toggle-group", "type": "registry:ui", "title": "Toggle Group", "description": "Toggle Group — gymnopédies-themed shadcn primitive." }, { "name": "tooltip", "type": "registry:ui", "title": "Tooltip", "description": "Tooltip — gymnopédies-themed shadcn primitive." }, { "name": "article", "type": "registry:component", "title": "Article", "description": "Article — gymnopédies blog reading primitive." }, { "name": "content", "type": "registry:component", "title": "Content", "description": "Content — gymnopédies blog reading primitive." }, { "name": "date-time", "type": "registry:component", "title": "Date Time", "description": "Date Time — gymnopédies blog reading primitive." }, { "name": "global-styles", "type": "registry:component", "title": "Global Styles", "description": "Global Styles — gymnopédies blog reading primitive." }, { "name": "header-navigation", "type": "registry:component", "title": "Header Navigation", "description": "Header Navigation — gymnopédies blog reading primitive." }, { "name": "hero", "type": "registry:component", "title": "Hero", "description": "Hero — gymnopédies blog reading primitive." }, { "name": "picture", "type": "registry:component", "title": "Picture", "description": "Picture — gymnopédies blog reading primitive." }, { "name": "use-mobile", "type": "registry:hook", "title": "Use Mobile", "description": "Use Mobile — gymnopédies hook." }, { "name": "gymnopedies", "type": "registry:style", "title": "Gymnopédies — read-only design system", "description": "A dark, serif, glow-leaning shadcn registry preset for long-form reading experiences. Installs the theme tokens, every non-form shadcn primitive, and the bespo…" } ], "component_count": 49, "components_truncated": false, "component_types": { "registry:lib": 1, "registry:style": 2, "registry:ui": 38, "registry:component": 7, "registry:hook": 1 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 87, "name": "@grootstudio", "category": "Uncategorized", "tags": [], "tagline": "A premium, open source component registry for SEO-friendly, high-performance React applications", "short_description": "", "description": "A premium, open source component registry for SEO-friendly, high-performance React applications", "homepage": "https://grootstudio.vercel.app", "docs": null, "github": "https://github.com/Subhadipjana95/Groot-Studio", "components_github": null, "github_default_branch": "main", "github_stars": 55, "last_commit": "2026-07-05T12:34:24Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://grootstudio.vercel.app/r/{name}.json", "registry_index": "https://grootstudio.vercel.app/r/registry.json", "components": [ "glow-card", "github-stars", "github-stars-react", "gradient-text-fill", "gradient-background-text", "discord-online", "discord-online-react", "logo-marquee", "blurred-marquee", "logo-grid", "github-calendar", "avatar-tooltips", "3d-button", "sliding-button", "drag-button", "press-button", "cursor-trail", "image-trail", "text-outline-glow", "animated-bars", "animated-layout", "theme-toggler", "styled-button", "pebble-toast" ], "component_items": [ { "name": "glow-card", "type": "registry:block", "title": "Glow Card", "description": "A card with a glowing hover effect." }, { "name": "github-stars", "type": "registry:block", "title": "GitHub Stars", "description": "Displays a GitHub repo star count with auto-fetch, daily revalidation, compact formatting, and a tooltip." }, { "name": "github-stars-react", "type": "registry:block", "title": "GitHub Stars (React / Vite)", "description": "GitHub star count for Vite and non-Next.js React projects. Fetches client-side with localStorage caching for 24 hours." }, { "name": "gradient-text-fill", "type": "registry:block", "title": "Gradient Text Fill", "description": "Animated gradient fills the text itself with 3D depth. Works on any background color." }, { "name": "gradient-background-text", "type": "registry:block", "title": "Gradient Background Text", "description": "Animated gradient background orb text with 3D engraved effect. Works on any background color." }, { "name": "discord-online", "type": "registry:block", "title": "Discord Online (Next.js)", "description": "Shows live Discord member presence count fetched server-side with 60s revalidation. Label shown on tooltip hover. Requires Next.js App Router." }, { "name": "discord-online-react", "type": "registry:block", "title": "Discord Online (React / Vite)", "description": "Shows live Discord member presence count fetched client-side with 60s localStorage cache. Label shown on tooltip hover." }, { "name": "logo-marquee", "type": "registry:block", "title": "Logo Marquee", "description": "Infinite marquee logo slider with mask fade edges and hover speed control." }, { "name": "blurred-marquee", "type": "registry:block", "title": "Blurred Marquee", "description": "Infinite marquee logo slider with mask blurred edges and hover speed control." }, { "name": "logo-grid", "type": "registry:block", "title": "Logo Grid", "description": "Grid of client logos with plus-sign separators and highlighted rows." }, { "name": "github-calendar", "type": "registry:block", "title": "GitHub Calendar", "description": "A Next.js/React component to display GitHub contributions in a calendar grid format." }, { "name": "avatar-tooltips", "type": "registry:block", "title": "Avatar Tooltips", "description": "Interactive overlapping avatars that reveal animated, spring-based tooltips on hover." }, { "name": "3d-button", "type": "registry:block", "title": "3D Button", "description": "A premium 3D button component with customizable dual-tone gradients, shimmer effects and depth shadows." }, { "name": "sliding-button", "type": "registry:block", "title": "Sliding Button", "description": "A high-performance interactive button that slides an icon into view on hover with spring animations and depth shadows." }, { "name": "drag-button", "type": "registry:block", "title": "Drag Button", "description": "An interactive draggable button requiring a left-to-right swipe to confirm actions, featuring optional success animations and spring physics." }, { "name": "press-button", "type": "registry:block", "title": "Press Button", "description": "An industry-grade neobrutalist button with a 3D press effect." }, { "name": "cursor-trail", "type": "registry:block", "title": "Cursor Trail", "description": "A smooth and refined shape trail effect that beautifully interpolates along your mouse cursor path." }, { "name": "image-trail", "type": "registry:block", "title": "Image Trail", "description": "A very smooth and interactive trail of images that follows your mouse cursor with discrete step interpolation." }, { "name": "text-outline-glow", "type": "registry:block", "title": "Text Outline Glow", "description": "A very smooth and interactive trail of images that follows your mouse cursor with discrete step interpolation." }, { "name": "animated-bars", "type": "registry:block", "title": "Animated Bars", "description": "A dynamic background component with pulsating, gradient bars that create a fluid energy effect." }, { "name": "animated-layout", "type": "registry:block", "title": "Animated Layout", "description": "A modern and dynamic layout component featuring fluid animations, smooth transitions, and a responsive grid system." }, { "name": "theme-toggler", "type": "registry:block", "title": "Theme Toggler", "description": "A minimal theme toggle button with a cinematic full-screen curtain wipe animation. Supports vertical and horizontal directions." }, { "name": "styled-button", "type": "registry:block", "title": "Styled Button", "description": "An elegant styled button with vibrant radial gradients, shadow glows, and smooth active transitions." }, { "name": "pebble-toast", "type": "registry:block", "title": "Pebble Toast", "description": "A premium notification stack with beautiful center/corner positioning, micro-animations, and dynamic gradients." } ], "component_count": 24, "components_truncated": false, "component_types": { "registry:block": 24 }, "has_logo": true, "enrichment_errors": [ "docs_unresolved" ], "featured": false }, { "number": 74, "name": "@ha-components", "category": "Niche/single-purpose", "tags": [ "ai", "dashboard" ], "tagline": "A collection of customisable components to build Home Assistant dashboards.", "short_description": "A collection of customisable components to build Home Assistant dashboards.", "description": "A shadcn/ui-inspired component framework for building custom Home Assistant dashboards in React/TypeScript. Provides styled, copy-owned components covering Home Assistant device categories: Camera, Light Toggle, Trigger, Weather, and Misc, alongside an Auth Provider for interacting with Home Assistant APIs. Unlike HA's built-in styling, users receive source files and full control. Beta software, maintained by a single developer; MIT licensed. Use for: building bespoke Home Assistant dashboard UIs using React and shadcn CLI instead of HA's native frontend or HACS card ecosystem.", "homepage": "https://hacomponents.keshuac.com", "docs": "https://hacomponents.keshuac.com/docs", "github": "https://github.com/jchu634/ha-components", "components_github": "https://github.com/jchu634/ha-components/tree/main/components", "github_default_branch": "main", "github_stars": 13, "last_commit": "2026-03-07T15:47:09Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://hacomponents.keshuac.com/r/{name}.json", "registry_index": "https://hacomponents.keshuac.com/r/registry.json", "components": [ "type-generator", "auth", "camera", "trigger", "toggle", "light", "weather", "proxy", "accordion", "popover", "slider", "switch" ], "component_items": [ { "name": "type-generator", "type": "registry:item", "title": "Type Generator", "description": "Script to generate types" }, { "name": "auth", "type": "registry:block", "title": "Auth Files and Components", "description": "A complex component used to setup Auth." }, { "name": "camera", "type": "registry:block", "title": "Simple Camera Component", "description": "A WebRTC Camera component for go2RTC" }, { "name": "trigger", "type": "registry:component", "title": "Simple Trigger Button Component", "description": "Button that with an attached Entity trigger" }, { "name": "toggle", "type": "registry:component", "title": "Simple Toggle Switch Component", "description": "Switch with an attached Entity trigger" }, { "name": "light", "type": "registry:component", "title": "Simple Light Control Component", "description": "A component which allows full control of a light" }, { "name": "weather", "type": "registry:block", "title": "Simple Weather Component", "description": null }, { "name": "proxy", "type": "registry:block", "title": "Python Websocket Proxy Server", "description": "Development websocket server for camera component" }, { "name": "accordion", "type": "registry:ui", "title": null, "description": null }, { "name": "popover", "type": "registry:ui", "title": null, "description": null }, { "name": "slider", "type": "registry:ui", "title": null, "description": null }, { "name": "switch", "type": "registry:ui", "title": null, "description": null } ], "component_count": 12, "components_truncated": false, "component_types": { "registry:item": 1, "registry:block": 4, "registry:component": 3, "registry:ui": 4 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 75, "name": "@headcodecms", "category": "Niche/single-purpose", "tags": [ "saas", "ai" ], "tagline": "A Minimalistic Web CMS for Next.js, optimized for Cache Components.", "short_description": "A Minimalistic Web CMS for Next.js, optimized for Cache Components.", "description": "A minimalistic, self-hosted web CMS distributed as a shadcn registry, optimized for Next.js App Router cache components. The registry exposes a single starter item that scaffolds an admin + website, content schemas defined in TypeScript (TextField, TextareaField, LinkField, etc.), TanStack Forms, TipTap rich text, and Drizzle ORM. Supports SQLite, Turso Cloud, Vercel Blob storage, and Better Auth by default. Can generate layouts with AI agents. Free and open-source. Use for: adding a lightweight, code-first CMS to a Next.js site without a SaaS headless CMS subscription.", "homepage": "https://headcodecms.com", "docs": "https://headcodecms.com/docs", "github": "https://github.com/headcodecms/headcodecms", "components_github": "https://github.com/headcodecms/headcodecms/tree/main/components", "github_default_branch": "main", "github_stars": 22, "last_commit": "2026-07-02T13:35:12Z", "archived": false, "license": null, "open_issues": 1, "registry_template": "https://headcodecms.com/r/{name}.json", "registry_index": null, "components": [], "component_items": [], "component_count": null, "components_truncated": false, "component_types": {}, "has_logo": true, "enrichment_errors": [ "registry_index_unresolved" ], "featured": false }, { "number": 76, "name": "@heroicons-animated", "category": "Icons/logos", "tags": [ "aesthetic" ], "tagline": "An open-source collection of 316 beautifully animated heroicons for your projects.", "short_description": "An open-source collection of 316 beautifully animated heroicons for your projects.", "description": "An open-source library of 316 animated Heroicons for React, built with Motion (Framer Motion) and distributed as a shadcn-compatible registry. Each icon has smooth SVG animations triggered on hover or programmatically, and all are copy-paste installable via the shadcn CLI. MIT-licensed, fully customizable, free. TypeScript/React, works with Next.js and Vite. Use for: replacing static Heroicons with animated equivalents in React apps where subtle icon motion improves perceived interactivity without adding a large animation library.", "homepage": "https://www.heroicons-animated.com/", "docs": "https://www.heroicons-animated.com", "github": "https://github.com/Aniket-508/heroicons-animated", "components_github": "https://github.com/Aniket-508/heroicons-animated/tree/main/src/components", "github_default_branch": "main", "github_stars": 141, "last_commit": "2026-06-17T15:26:47Z", "archived": false, "license": "MIT", "open_issues": 1, "registry_template": "https://www.heroicons-animated.com/r/{name}.json", "registry_index": "https://www.heroicons-animated.com/r/registry.json", "components": [ "academic-cap", "adjustments-horizontal", "adjustments-vertical", "archive-box-arrow-down", "archive-box-x-mark", "archive-box", "arrow-down-circle", "arrow-down-left", "arrow-down-on-square-stack", "arrow-down-on-square", "arrow-down-right", "arrow-down-tray", "arrow-down", "arrow-left-circle", "arrow-left-end-on-rectangle", "arrow-left-start-on-rectangle", "arrow-left", "arrow-long-down", "arrow-long-left", "arrow-long-right", "arrow-long-up", "arrow-path-rounded-square", "arrow-path", "arrow-right-circle", "arrow-right-end-on-rectangle", "arrow-right-start-on-rectangle", "arrow-right", "arrow-top-right-on-square", "arrow-trending-down", "arrow-trending-up", "arrow-turn-down-left", "arrow-turn-down-right", "arrow-turn-left-down", "arrow-turn-left-up", "arrow-turn-right-down", "arrow-turn-right-up", "arrow-turn-up-left", "arrow-turn-up-right", "arrow-up-circle", "arrow-up-left", "arrow-up-on-square-stack", "arrow-up-on-square", "arrow-up-right", "arrow-up-tray", "arrow-up", "arrow-uturn-down", "arrow-uturn-left", "arrow-uturn-right", "arrow-uturn-up", "arrows-pointing-in", "arrows-pointing-out", "arrows-right-left", "arrows-up-down", "at-symbol", "backspace", "backward", "banknotes", "bars-2", "bars-3-bottom-left", "bars-3-bottom-right", "bars-3-center-left", "bars-3", "bars-4", "bars-arrow-down", "bars-arrow-up", "battery-0", "battery-100", "battery-50", "beaker", "bell-alert", "bell-slash", "bell-snooze", "bell", "bold", "bolt-slash", "bolt", "book-open", "bookmark-slash", "bookmark-square", "bookmark", "briefcase", "bug-ant", "building-library", "building-office-2", "building-office", "building-storefront", "cake", "calculator", "calendar-date-range", "calendar-days", "calendar", "camera", "chart-bar-square", "chart-bar", "chart-pie", "chat-bubble-bottom-center-text", "chat-bubble-bottom-center", "chat-bubble-left-ellipsis", "chat-bubble-left-right", "chat-bubble-left" ], "component_items": [ { "name": "academic-cap", "type": "registry:ui", "title": "academic-cap", "description": "Animated academic-cap icon for React" }, { "name": "adjustments-horizontal", "type": "registry:ui", "title": "adjustments-horizontal", "description": "Animated adjustments-horizontal icon for React" }, { "name": "adjustments-vertical", "type": "registry:ui", "title": "adjustments-vertical", "description": "Animated adjustments-vertical icon for React" }, { "name": "archive-box-arrow-down", "type": "registry:ui", "title": "archive-box-arrow-down", "description": "Animated archive-box-arrow-down icon for React" }, { "name": "archive-box-x-mark", "type": "registry:ui", "title": "archive-box-x-mark", "description": "Animated archive-box-x-mark icon for React" }, { "name": "archive-box", "type": "registry:ui", "title": "archive-box", "description": "Animated archive-box icon for React" }, { "name": "arrow-down-circle", "type": "registry:ui", "title": "arrow-down-circle", "description": "Animated arrow-down-circle icon for React" }, { "name": "arrow-down-left", "type": "registry:ui", "title": "arrow-down-left", "description": "Animated arrow-down-left icon for React" }, { "name": "arrow-down-on-square-stack", "type": "registry:ui", "title": "arrow-down-on-square-stack", "description": "Animated arrow-down-on-square-stack icon for React" }, { "name": "arrow-down-on-square", "type": "registry:ui", "title": "arrow-down-on-square", "description": "Animated arrow-down-on-square icon for React" }, { "name": "arrow-down-right", "type": "registry:ui", "title": "arrow-down-right", "description": "Animated arrow-down-right icon for React" }, { "name": "arrow-down-tray", "type": "registry:ui", "title": "arrow-down-tray", "description": "Animated arrow-down-tray icon for React" }, { "name": "arrow-down", "type": "registry:ui", "title": "arrow-down", "description": "Animated arrow-down icon for React" }, { "name": "arrow-left-circle", "type": "registry:ui", "title": "arrow-left-circle", "description": "Animated arrow-left-circle icon for React" }, { "name": "arrow-left-end-on-rectangle", "type": "registry:ui", "title": "arrow-left-end-on-rectangle", "description": "Animated arrow-left-end-on-rectangle icon for React" }, { "name": "arrow-left-start-on-rectangle", "type": "registry:ui", "title": "arrow-left-start-on-rectangle", "description": "Animated arrow-left-start-on-rectangle icon for React" }, { "name": "arrow-left", "type": "registry:ui", "title": "arrow-left", "description": "Animated arrow-left icon for React" }, { "name": "arrow-long-down", "type": "registry:ui", "title": "arrow-long-down", "description": "Animated arrow-long-down icon for React" }, { "name": "arrow-long-left", "type": "registry:ui", "title": "arrow-long-left", "description": "Animated arrow-long-left icon for React" }, { "name": "arrow-long-right", "type": "registry:ui", "title": "arrow-long-right", "description": "Animated arrow-long-right icon for React" }, { "name": "arrow-long-up", "type": "registry:ui", "title": "arrow-long-up", "description": "Animated arrow-long-up icon for React" }, { "name": "arrow-path-rounded-square", "type": "registry:ui", "title": "arrow-path-rounded-square", "description": "Animated arrow-path-rounded-square icon for React" }, { "name": "arrow-path", "type": "registry:ui", "title": "arrow-path", "description": "Animated arrow-path icon for React" }, { "name": "arrow-right-circle", "type": "registry:ui", "title": "arrow-right-circle", "description": "Animated arrow-right-circle icon for React" }, { "name": "arrow-right-end-on-rectangle", "type": "registry:ui", "title": "arrow-right-end-on-rectangle", "description": "Animated arrow-right-end-on-rectangle icon for React" }, { "name": "arrow-right-start-on-rectangle", "type": "registry:ui", "title": "arrow-right-start-on-rectangle", "description": "Animated arrow-right-start-on-rectangle icon for React" }, { "name": "arrow-right", "type": "registry:ui", "title": "arrow-right", "description": "Animated arrow-right icon for React" }, { "name": "arrow-top-right-on-square", "type": "registry:ui", "title": "arrow-top-right-on-square", "description": "Animated arrow-top-right-on-square icon for React" }, { "name": "arrow-trending-down", "type": "registry:ui", "title": "arrow-trending-down", "description": "Animated arrow-trending-down icon for React" }, { "name": "arrow-trending-up", "type": "registry:ui", "title": "arrow-trending-up", "description": "Animated arrow-trending-up icon for React" }, { "name": "arrow-turn-down-left", "type": "registry:ui", "title": "arrow-turn-down-left", "description": "Animated arrow-turn-down-left icon for React" }, { "name": "arrow-turn-down-right", "type": "registry:ui", "title": "arrow-turn-down-right", "description": "Animated arrow-turn-down-right icon for React" }, { "name": "arrow-turn-left-down", "type": "registry:ui", "title": "arrow-turn-left-down", "description": "Animated arrow-turn-left-down icon for React" }, { "name": "arrow-turn-left-up", "type": "registry:ui", "title": "arrow-turn-left-up", "description": "Animated arrow-turn-left-up icon for React" }, { "name": "arrow-turn-right-down", "type": "registry:ui", "title": "arrow-turn-right-down", "description": "Animated arrow-turn-right-down icon for React" }, { "name": "arrow-turn-right-up", "type": "registry:ui", "title": "arrow-turn-right-up", "description": "Animated arrow-turn-right-up icon for React" }, { "name": "arrow-turn-up-left", "type": "registry:ui", "title": "arrow-turn-up-left", "description": "Animated arrow-turn-up-left icon for React" }, { "name": "arrow-turn-up-right", "type": "registry:ui", "title": "arrow-turn-up-right", "description": "Animated arrow-turn-up-right icon for React" }, { "name": "arrow-up-circle", "type": "registry:ui", "title": "arrow-up-circle", "description": "Animated arrow-up-circle icon for React" }, { "name": "arrow-up-left", "type": "registry:ui", "title": "arrow-up-left", "description": "Animated arrow-up-left icon for React" }, { "name": "arrow-up-on-square-stack", "type": "registry:ui", "title": "arrow-up-on-square-stack", "description": "Animated arrow-up-on-square-stack icon for React" }, { "name": "arrow-up-on-square", "type": "registry:ui", "title": "arrow-up-on-square", "description": "Animated arrow-up-on-square icon for React" }, { "name": "arrow-up-right", "type": "registry:ui", "title": "arrow-up-right", "description": "Animated arrow-up-right icon for React" }, { "name": "arrow-up-tray", "type": "registry:ui", "title": "arrow-up-tray", "description": "Animated arrow-up-tray icon for React" }, { "name": "arrow-up", "type": "registry:ui", "title": "arrow-up", "description": "Animated arrow-up icon for React" }, { "name": "arrow-uturn-down", "type": "registry:ui", "title": "arrow-uturn-down", "description": "Animated arrow-uturn-down icon for React" }, { "name": "arrow-uturn-left", "type": "registry:ui", "title": "arrow-uturn-left", "description": "Animated arrow-uturn-left icon for React" }, { "name": "arrow-uturn-right", "type": "registry:ui", "title": "arrow-uturn-right", "description": "Animated arrow-uturn-right icon for React" }, { "name": "arrow-uturn-up", "type": "registry:ui", "title": "arrow-uturn-up", "description": "Animated arrow-uturn-up icon for React" }, { "name": "arrows-pointing-in", "type": "registry:ui", "title": "arrows-pointing-in", "description": "Animated arrows-pointing-in icon for React" }, { "name": "arrows-pointing-out", "type": "registry:ui", "title": "arrows-pointing-out", "description": "Animated arrows-pointing-out icon for React" }, { "name": "arrows-right-left", "type": "registry:ui", "title": "arrows-right-left", "description": "Animated arrows-right-left icon for React" }, { "name": "arrows-up-down", "type": "registry:ui", "title": "arrows-up-down", "description": "Animated arrows-up-down icon for React" }, { "name": "at-symbol", "type": "registry:ui", "title": "at-symbol", "description": "Animated at-symbol icon for React" }, { "name": "backspace", "type": "registry:ui", "title": "backspace", "description": "Animated backspace icon for React" }, { "name": "backward", "type": "registry:ui", "title": "backward", "description": "Animated backward icon for React" }, { "name": "banknotes", "type": "registry:ui", "title": "banknotes", "description": "Animated banknotes icon for React" }, { "name": "bars-2", "type": "registry:ui", "title": "bars-2", "description": "Animated bars-2 icon for React" }, { "name": "bars-3-bottom-left", "type": "registry:ui", "title": "bars-3-bottom-left", "description": "Animated bars-3-bottom-left icon for React" }, { "name": "bars-3-bottom-right", "type": "registry:ui", "title": "bars-3-bottom-right", "description": "Animated bars-3-bottom-right icon for React" } ], "component_count": 316, "components_truncated": true, "component_types": { "registry:ui": 316 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 77, "name": "@hextaui", "category": "Component library (general)", "tags": [ "saas", "ai", "components" ], "tagline": "Ready-to-use foundation components/blocks built on top of shadcn/ui.", "short_description": "Ready-to-use foundation components/blocks built on top of shadcn/ui.", "description": "A shadcn/ui extension registry with 139 items spanning the full primitive set (Accordion through Tooltip, plus Button Group, Command Menu, Empty, Field, Input Group, Spinner, Video Player, Native Select, and Tree) and large suites of AI chat components (14: AI Chat History, Citations, File Upload, Model Selector, Streaming Response, Thinking, etc.), Auth flows (15: Login, Signup, OTP, Social, Magic Link, Recovery Codes), Billing blocks (14: Pricing Table, Invoice List, Payment Form, Subscription Card), Settings panels (17), Team views (12), and Task management blocks (7). Tailwind CSS, shadcn-compatible. Free. Use for: scaffolding complete SaaS application UI sections — especially auth, billing, team management, and AI chat — with production-quality blocks.", "homepage": "https://hextaui.com", "docs": "https://hextaui.com/components", "github": "https://github.com/preetsuthar17/hextaui", "components_github": "https://github.com/preetsuthar17/hextaui/tree/master/registry", "github_default_branch": "master", "github_stars": 631, "last_commit": "2026-05-23T06:48:18Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://hextaui.com/r/{name}.json", "registry_index": "https://hextaui.com/r/registry.json", "components": [ "accordion", "alert", "alert-dialog", "aspect-ratio", "avatar", "badge", "breadcrumb", "button", "button-group", "calendar", "card", "carousel", "checkbox", "collapsible", "command-menu", "context-menu", "dialog", "drawer", "dropdown-menu", "empty", "field", "hover-card", "input", "input-group", "input-otp", "item", "label", "menubar", "navigation-menu", "pagination", "popover", "progress", "radio-group", "resizable", "scroll-area", "sidebar", "select", "separator", "sheet", "skeleton", "slider", "sonner", "spinner", "switch", "table", "tabs", "textarea", "toggle", "toggle-group", "tooltip", "kbd", "native-select", "tree", "video-player", "ai-chat-history", "ai-citations", "ai-conversation", "ai-error-handler", "ai-file-upload", "ai-message", "ai-model-selector", "ai-prompt-input", "ai-prompt-templates", "ai-settings-panel", "ai-streaming-response", "ai-suggested-prompts", "ai-thinking", "ai-usage-quota", "auth-account-delete", "auth-change-password", "auth-email-change", "auth-forgot-password", "auth-login-form", "auth-magic-link", "auth-otp-verify", "auth-phone-verify", "auth-recovery-codes", "auth-reset-password", "auth-session-manager", "auth-signup-form", "auth-social-accounts", "auth-two-factor-setup", "auth-two-factor-verify", "auth-verify-email", "billing-billing-history", "billing-coupon-code", "billing-invoice-details", "billing-invoice-list", "billing-payment-failed", "billing-payment-form", "billing-payment-method", "billing-payment-schedule", "billing-plan-selector", "billing-pricing-table", "billing-subscription-card", "billing-subscription-settings", "billing-upgrade-prompt", "billing-usage-alerts", "billing-usage-billing", "settings-account" ], "component_items": [ { "name": "accordion", "type": "registry:ui", "title": "Accordion", "description": "Expands to show or hide content." }, { "name": "alert", "type": "registry:ui", "title": "Alert", "description": "Displays a status or message banner." }, { "name": "alert-dialog", "type": "registry:ui", "title": "Alert Dialog", "description": "Modal dialog for important actions or decisions." }, { "name": "aspect-ratio", "type": "registry:ui", "title": "Aspect Ratio", "description": "Maintains a fixed ratio for child content." }, { "name": "avatar", "type": "registry:ui", "title": "Avatar", "description": "Shows an image or initials for a user/object." }, { "name": "badge", "type": "registry:ui", "title": "Badge", "description": "Small badge for counts or indicators." }, { "name": "breadcrumb", "type": "registry:ui", "title": "Breadcrumb", "description": "Displays navigation path as links." }, { "name": "button", "type": "registry:ui", "title": "Button", "description": "Clickable button for actions." }, { "name": "button-group", "type": "registry:ui", "title": "Button Group", "description": "Groups multiple buttons in a row." }, { "name": "calendar", "type": "registry:ui", "title": "Calendar", "description": "Grid to display days and dates." }, { "name": "card", "type": "registry:ui", "title": "Card", "description": "Container with header, content, and footer sections." }, { "name": "carousel", "type": "registry:ui", "title": "Carousel", "description": "Rotates or slides multiple items." }, { "name": "checkbox", "type": "registry:ui", "title": "Checkbox", "description": "Box for selecting true or false." }, { "name": "collapsible", "type": "registry:ui", "title": "Collapsible", "description": "Panel that expands and collapses." }, { "name": "command-menu", "type": "registry:ui", "title": "Command Menu", "description": "Popup menu for running commands." }, { "name": "context-menu", "type": "registry:ui", "title": "Context Menu", "description": "Menu that appears on right-click or action." }, { "name": "dialog", "type": "registry:ui", "title": "Dialog", "description": "Modal overlay for dialogs and forms." }, { "name": "drawer", "type": "registry:ui", "title": "Drawer", "description": "Drawer panel that slides in from edge." }, { "name": "dropdown-menu", "type": "registry:ui", "title": "Dropdown Menu", "description": "Menu that opens with a trigger control." }, { "name": "empty", "type": "registry:ui", "title": "Empty", "description": "Graphic placeholder for empty states." }, { "name": "field", "type": "registry:ui", "title": "Field", "description": "Field layout with label and help." }, { "name": "hover-card", "type": "registry:ui", "title": "Hover Card", "description": "Card that appears on hover." }, { "name": "input", "type": "registry:ui", "title": "Input", "description": "Single-line text input." }, { "name": "input-group", "type": "registry:ui", "title": "Input Group", "description": "Combines inputs and add-ons in a row." }, { "name": "input-otp", "type": "registry:ui", "title": "Input OTP", "description": "Inputs for one-time code entry." }, { "name": "item", "type": "registry:ui", "title": "Item", "description": "List item component with actions." }, { "name": "label", "type": "registry:ui", "title": "Label", "description": "Label for form input." }, { "name": "menubar", "type": "registry:ui", "title": "Menubar", "description": "Horizontal menu bar for navigation." }, { "name": "navigation-menu", "type": "registry:ui", "title": "Navigation Menu", "description": "A collection of links for navigating websites." }, { "name": "pagination", "type": "registry:ui", "title": "Pagination", "description": "Controls for paging through content." }, { "name": "popover", "type": "registry:ui", "title": "Popover", "description": "Floating panel for additional content." }, { "name": "progress", "type": "registry:ui", "title": "Progress", "description": "Linear progress indicator." }, { "name": "radio-group", "type": "registry:ui", "title": "Radio Group", "description": "Group of choices where only one can be selected." }, { "name": "resizable", "type": "registry:ui", "title": "Resizable", "description": "Container that users can resize." }, { "name": "scroll-area", "type": "registry:ui", "title": "Scroll Area", "description": "Scrollable area for overflowing content." }, { "name": "sidebar", "type": "registry:ui", "title": "Sidebar", "description": "A collapsible sidebar component for navigation." }, { "name": "select", "type": "registry:ui", "title": "Select", "description": "Custom dropdown select input." }, { "name": "separator", "type": "registry:ui", "title": "Separator", "description": "Horizontal or vertical dividing line." }, { "name": "sheet", "type": "registry:ui", "title": "Sheet", "description": "Drawer panel that slides in from edge." }, { "name": "skeleton", "type": "registry:ui", "title": "Skeleton", "description": "Shimmer effect placeholder preview." }, { "name": "slider", "type": "registry:ui", "title": "Slider", "description": "Draggable control for selecting a value." }, { "name": "sonner", "type": "registry:ui", "title": "Sonner", "description": "Displays toast notifications." }, { "name": "spinner", "type": "registry:ui", "title": "Spinner", "description": "Circular activity indicator." }, { "name": "switch", "type": "registry:ui", "title": "Switch", "description": "Toggle to switch between states." }, { "name": "table", "type": "registry:ui", "title": "Table", "description": "Displays data in rows and columns." }, { "name": "tabs", "type": "registry:ui", "title": "Tabs", "description": "Switches views using tabbed buttons." }, { "name": "textarea", "type": "registry:ui", "title": "Textarea", "description": "Multi-line text input." }, { "name": "toggle", "type": "registry:ui", "title": "Toggle", "description": "Pressable toggle button." }, { "name": "toggle-group", "type": "registry:ui", "title": "Toggle Group", "description": "Groups multiple toggle buttons." }, { "name": "tooltip", "type": "registry:ui", "title": "Tooltip", "description": "Shows info on hover or focus." }, { "name": "kbd", "type": "registry:ui", "title": "Kbd", "description": "Renders keyboard key appearance." }, { "name": "native-select", "type": "registry:ui", "title": "Native Select", "description": "Dropdown using the native select element." }, { "name": "tree", "type": "registry:ui", "title": "Tree", "description": "Hierarchical collapsible structure." }, { "name": "video-player", "type": "registry:ui", "title": "Video Player", "description": "Video playback with controls." }, { "name": "ai-chat-history", "type": "registry:ui", "title": "AI Chat History", "description": "Display and manage conversation history with search and filtering." }, { "name": "ai-citations", "type": "registry:ui", "title": "AI Citations", "description": "Display citations and sources with collapsible source previews." }, { "name": "ai-conversation", "type": "registry:ui", "title": "AI Conversation", "description": "Display AI conversation messages with streaming support." }, { "name": "ai-error-handler", "type": "registry:ui", "title": "AI Error Handler", "description": "Display and handle AI errors with retry functionality." }, { "name": "ai-file-upload", "type": "registry:ui", "title": "AI File Upload", "description": "Upload files for AI analysis with drag and drop support." }, { "name": "ai-message", "type": "registry:ui", "title": "AI Message", "description": "Display AI messages with markdown support and code highlighting." } ], "component_count": 139, "components_truncated": true, "component_types": { "registry:ui": 139 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 92, "name": "@hirael", "category": "Uncategorized", "tags": [], "tagline": "The components shadcn/ui doesn't ship. A collection of high-utility React components built on top of shadcn/ui.", "short_description": "", "description": "The components shadcn/ui doesn't ship. A collection of high-utility React components built on top of shadcn/ui.", "homepage": "https://hirael.com", "docs": null, "github": null, "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://hirael.com/r/{name}.json", "registry_index": "https://hirael.com/r/registry.json", "components": [ "multi-select", "number-range", "year-picker", "tag-input", "combobox", "lazy-select", "password-input", "currency-input", "phone-input", "file-dropzone", "stat-card", "rating", "timeline", "kbd", "callout", "scroll-progress", "hero-01", "hero-02", "hero-03", "hero-04", "hero-05", "feature-01", "feature-02", "pricing-01", "pricing-02", "testimonial-01", "testimonial-02", "cta-01", "cta-02", "cta-03", "faq-01", "faq-02", "faq-03", "faq-04", "login-01", "login-02", "signup-01", "forgot-password-01", "otp-verify-01", "header-01", "footer-01", "not-found-01", "month-picker", "time-picker", "color-picker", "avatar-stack", "announcement-bar", "logo-cloud-01", "contact-01", "blog-01", "ecommerce-01", "ecommerce-02", "dashboard-01", "dashboard-02", "dashboard-03", "dashboard-04", "dashboard-05", "integrations-01", "image-gallery-01", "app-shell-01", "app-shell-02", "app-shell-03", "app-shell-04", "spinner", "copy-button", "marquee", "tree-view", "animated-number", "stepper", "sortable", "date-picker", "date-range-picker", "mention-input", "rich-text-editor", "inline-edit", "signature-pad", "image-cropper", "image-compare", "lightbox", "countdown-timer", "qr-code", "calendar-heatmap", "code-block", "masonry", "audio-player", "media-input", "tour", "activity-feed", "audit-log", "blur-reveal", "text-reveal", "scroll-reveal", "spotlight-card", "magnetic-button", "cursor-glow", "tilt-card", "morphing-dialog", "dock", "floating-action-button", "floating-toolbar" ], "component_items": [ { "name": "multi-select", "type": "registry:ui", "title": "Multi Select", "description": "Chip-based multi-select with command-palette dropdown, search, select-all and async loader. Compound and single-prop APIs." }, { "name": "number-range", "type": "registry:ui", "title": "Number Range", "description": "Two-thumb slider paired with synced number inputs. Min/max/step, currency or unit formatting, keyboard-first." }, { "name": "year-picker", "type": "registry:ui", "title": "Year Picker", "description": "Decade-grid year picker with keyboard nav, min/max bounds, single or range mode." }, { "name": "tag-input", "type": "registry:ui", "title": "Tag Input", "description": "Chip input with paste-to-split, dedupe, validation hook, max tags. Compound and single-prop APIs." }, { "name": "combobox", "type": "registry:ui", "title": "Combobox", "description": "Searchable select on Base UI: single or multiple selection, chips, grouped options, an input addon slot and a clear button." }, { "name": "lazy-select", "type": "registry:ui", "title": "Lazy Select", "description": "Autocomplete single-select that defers loading until open and pages through results on scroll. Debounced server-side search with a pluggable lazy paginator hoo…" }, { "name": "password-input", "type": "registry:ui", "title": "Password Input", "description": "Show/hide toggle with an optional pluggable strength meter. Compound and single-prop APIs." }, { "name": "currency-input", "type": "registry:ui", "title": "Currency Input", "description": "Locale-aware grouping with currency-symbol prefix and configurable decimal precision." }, { "name": "phone-input", "type": "registry:ui", "title": "Phone Input", "description": "Country dial-code dropdown with E.164 output. Compound and single-prop APIs." }, { "name": "file-dropzone", "type": "registry:ui", "title": "File Dropzone", "description": "Drag-drop + click upload zone with previews, accept and max-size validation. Compound and single-prop APIs." }, { "name": "stat-card", "type": "registry:ui", "title": "Stat Card", "description": "Compact metric card with label, value, and an up/down/flat trend chip. Compound and single-prop APIs." }, { "name": "rating", "type": "registry:ui", "title": "Rating", "description": "Star rating with hover preview, half-star precision, read-only mode and sm / md / lg sizes." }, { "name": "timeline", "type": "registry:ui", "title": "Timeline", "description": "Vertical event timeline with default or icon dots, tone variants and labelled time / title / description parts." }, { "name": "kbd", "type": "registry:ui", "title": "Kbd", "description": "3D tactile keycap with hover lift and pressed states. Compound API with KbdGroup for chords and KbdDisplay for inline keys." }, { "name": "callout", "type": "registry:ui", "title": "Callout", "description": "MDX-style admonition with info / success / warning / error / neutral variants and optional icon override. Ships --info / --success / --warning theme tokens." }, { "name": "scroll-progress", "type": "registry:ui", "title": "Scroll Progress", "description": "Fixed reading progress bar. Tracks document scroll by default or a scoped container ref." }, { "name": "hero-01", "type": "registry:block", "title": "Hero 1", "description": "Full-bleed hero card over an animated light-beam shader, with a glass pill nav, a trust badge, a serif headline, dual CTA and a three-stat footer." }, { "name": "hero-02", "type": "registry:block", "title": "Hero 2", "description": "Centered hero over animated grayscale gradient bars, with a live pill, a serif headline with an underlined accent, dual CTA and a wordmark strip." }, { "name": "hero-03", "type": "registry:block", "title": "Hero 3", "description": "Editorial centered hero on a faded grid, with a serif headline, sub-copy, dual CTA and a logo cloud of customer wordmarks." }, { "name": "hero-04", "type": "registry:block", "title": "Hero 4", "description": "Full-bleed image-banner hero with a dark scrim, a slim nav, a serif headline and dual CTA aligned to the bottom." }, { "name": "hero-05", "type": "registry:block", "title": "Hero 5", "description": "Full-bleed hero card over an animated aurora shader, with a glass pill nav, a glass content panel, a serif headline, dual CTA and an avatar social-proof row." }, { "name": "feature-01", "type": "registry:block", "title": "Feature 1", "description": "Three alternating feature rows, each pairing a stylized Tailwind-only mock UI with a copy column (eyebrow, headline, paragraph, 3-item checklist)." }, { "name": "feature-02", "type": "registry:block", "title": "Feature 2", "description": "Section header above a 3-column, 2-row grid of bordered feature cards with lucide icons, headlines and short blurbs." }, { "name": "pricing-01", "type": "registry:block", "title": "Pricing 1", "description": "Three-tier card row with a featured middle plan. Each card lists price, blurb, feature checklist and a primary or outline CTA." }, { "name": "pricing-02", "type": "registry:block", "title": "Pricing 2", "description": "Compare-by-feature pricing table with sticky tier header (tier name, price, CTA) and ~8 feature rows below." }, { "name": "testimonial-01", "type": "registry:block", "title": "Testimonial 1", "description": "Centered single quote with stylized open-mark, author block (avatar, name, role, company) and a muted wordmark row below." }, { "name": "testimonial-02", "type": "registry:block", "title": "Testimonial 2", "description": "Masonry quote grid (CSS columns) with ~6 bordered quote cards of varying length and author rows." }, { "name": "cta-01", "type": "registry:block", "title": "CTA 1", "description": "Framed CTA card with corner marks, headline + sub-copy on the left, dual buttons stacked on the right." }, { "name": "cta-02", "type": "registry:block", "title": "CTA 2", "description": "Full-bleed centered CTA with framing top/bottom rules, highlight underlay on the key word, and an inline install command." }, { "name": "cta-03", "type": "registry:block", "title": "CTA 3", "description": "Full-bleed CTA card with an animated dithered shader backdrop, a live status pill, a serif headline and a pill action button." }, { "name": "faq-01", "type": "registry:block", "title": "FAQ 1", "description": "Two-column FAQ: sticky heading + contact card on the left, numbered accordion on the right." }, { "name": "faq-02", "type": "registry:block", "title": "FAQ 2", "description": "Centered heading with two-column accordion grid below. Each row tagged with a Qn index." }, { "name": "faq-03", "type": "registry:block", "title": "FAQ 3", "description": "Searchable FAQ with category tabs, a live-filtered accordion, an empty state for missed queries and a support CTA strip." }, { "name": "faq-04", "type": "registry:block", "title": "FAQ 4", "description": "Framed single-column FAQ with side rules, a centered display header, five topic groups each pairing a heading with its own accordion, and a support footer line." }, { "name": "login-01", "type": "registry:block", "title": "Login 1", "description": "Centered login card with monogram, email + password (using the password-input component), remember-me, divider and GitHub / Google providers." }, { "name": "login-02", "type": "registry:block", "title": "Login 2", "description": "Two-pane login: form on the left, dark testimonial panel with quote and metrics on the right. Uses the strength-meter variant of password-input." }, { "name": "signup-01", "type": "registry:block", "title": "Signup 1", "description": "Centered signup card with monogram, name + email, strength-meter password-input, terms checkbox, divider and GitHub / Google providers. Validates inline on sub…" }, { "name": "forgot-password-01", "type": "registry:block", "title": "Forgot Password 1", "description": "Centered reset-request card: email with inline validation and a pending submit, swapping to a check-your-inbox state that echoes the address with resend and ba…" }, { "name": "otp-verify-01", "type": "registry:block", "title": "OTP Verify 1", "description": "Centered verification card with a six-box code input built in the block: auto-advance, backspace, paste distribution and arrow-key focus, plus a 30s resend cou…" }, { "name": "header-01", "type": "registry:block", "title": "Header 1", "description": "Sticky top nav with brand monogram, centered anchor links, dual auth CTAs and a slide-down mobile menu." }, { "name": "footer-01", "type": "registry:block", "title": "Footer 1", "description": "Brand + tagline column alongside Product / Company / Resources link columns, with a copyright row and social icons below a thin rule." }, { "name": "not-found-01", "type": "registry:block", "title": "Not Found 1", "description": "Centered 404 with mono eyebrow, display headline, paired CTAs and a 'try one of these' suggested-routes list." }, { "name": "month-picker", "type": "registry:ui", "title": "Month Picker", "description": "4×3 month grid with year stepper, keyboard nav, min/max bounds, single or range mode." }, { "name": "time-picker", "type": "registry:ui", "title": "Time Picker", "description": "Hour, minute and optional second scroll columns with 12/24h modes, step intervals and keyboard nav." }, { "name": "color-picker", "type": "registry:ui", "title": "Color Picker", "description": "SV gradient + hue slider with HEX / RGB / HSL tabs, eyedropper (where supported) and recent swatches." }, { "name": "avatar-stack", "type": "registry:ui", "title": "Avatar Stack", "description": "Overlapping avatar group with size (sm/md/lg) and spacing (tight/normal/loose) variants, image or fallback support, numeric overflow chip, and asChild on items…" }, { "name": "announcement-bar", "type": "registry:ui", "title": "Announcement Bar", "description": "Top-of-page banner with default / primary / muted tones, optional dismiss button and localStorage persistence." }, { "name": "logo-cloud-01", "type": "registry:block", "title": "Logo Cloud 1", "description": "Centered eyebrow + headline above a 5-column bordered wordmark grid, with stat strip and case-study link below." }, { "name": "contact-01", "type": "registry:block", "title": "Contact 1", "description": "Production contact form with controlled state, inline validation, character counter, topic select, consent checkbox and a pending/sent state machine. Channel l…" }, { "name": "blog-01", "type": "registry:block", "title": "Blog 1", "description": "Editorial blog index with a featured post on top and a 4-column grid of post cards underneath. Built on Card and Badge." }, { "name": "ecommerce-01", "type": "registry:block", "title": "E-commerce 1", "description": "Product grid with category filter pills, sale and new badges, wishlist toggles, star ratings, compare-at pricing and per-card add buttons." }, { "name": "ecommerce-02", "type": "registry:block", "title": "E-commerce 2", "description": "Shopping cart with quantity steppers, removable line items, promo-code validation, a free-shipping threshold, live totals and an empty-cart state." }, { "name": "dashboard-01", "type": "registry:block", "title": "Dashboard 1", "description": "Operations dashboard with Tabs date-range switcher (1d / 7d / 30d / 90d), 4-up metric strip, weekly bar chart and a recent-activity feed. Data switches live wi…" }, { "name": "dashboard-02", "type": "registry:block", "title": "Dashboard 2", "description": "Analytics dashboard with a date-range select, four sparkline KPI tiles, a layered two-series area chart, and top-pages and channel-share side cards." }, { "name": "dashboard-03", "type": "registry:block", "title": "Dashboard 3", "description": "Revenue dashboard with a month stepper, plan-mix donut and legend, invoice status list and a transactions table with status dots and a pagination footer." }, { "name": "dashboard-04", "type": "registry:block", "title": "Dashboard 4", "description": "Commerce operations dashboard in a card-in-card style: four inset stat tiles, a Today band pairing an hourly two-series revenue chart with ad-budget and peak-h…" }, { "name": "dashboard-05", "type": "registry:block", "title": "Dashboard 5", "description": "Observability dashboard composed as one bordered lattice: greeting strip with range select, four sparkline KPI cells, cache and duration chart cells, an AI-ins…" }, { "name": "integrations-01", "type": "registry:block", "title": "Integrations 1", "description": "Two-column integrations section with copy and feature list on the left, orbit diagram (central hub + 7 logo spokes connected by dashed rays) on the right." }, { "name": "image-gallery-01", "type": "registry:block", "title": "Image Gallery 1", "description": "Studio-style masonry gallery with Tabs-driven category filter, real photo tiles via next/image, varied aspect ratios, hover zoom + arrow chip and an Empty fall…" }, { "name": "app-shell-01", "type": "registry:block", "title": "App Shell 1", "description": "Drop-in admin shell layout built on the shadcn Sidebar primitive: collapsible icon-rail sidebar with nav badges and a footer profile row, sticky topbar with br…" } ], "component_count": 145, "components_truncated": true, "component_types": { "registry:ui": 75, "registry:block": 70 }, "has_logo": true, "enrichment_errors": [ "docs_unresolved", "github_unresolved" ], "featured": false }, { "number": 78, "name": "@iconiq", "category": "Component library (general)", "tags": [ "dashboard", "aesthetic", "components" ], "tagline": "Iconiq is a collection of icons designed for web applications. It is a modern, clean, and minimalistic icon set that is perfect for web applications.", "short_description": "Iconiq is a collection of icons designed for web applications. It is a modern, clean, and minimalistic icon set that is perfect for web applications.", "description": "A shadcn-compatible registry of 87 motion-powered React components offering three paradigms per primitive: Base UI (b-), Radix UI (r-), and default shadcn variants — covering Accordion, Alert Dialog, Autocomplete, Button, Checkbox, Combobox, Context Menu, Dialog, Hover Card, Popover, Progress, Radio Group, Select, Selection Toolbar, Separator, Slider, Switch, Tabs, Toggle, Tooltip, and more. Also includes specialty items: Color Picker, Charts, File Upload, Infinite Ribbon, Shimmer Text, Typewriter, Text Inertia, and a theme preset. MIT-licensed, free. Use for: picking interchangeable Radix- or Base UI-backed animated primitives with consistent styling and subtle motion built in.", "homepage": "https://iconiqui.com", "docs": "https://iconiqui.com/components/accordion", "github": "https://github.com/edwinvakayil/iconiq", "components_github": "https://github.com/edwinvakayil/iconiq/tree/main/registry", "github_default_branch": "main", "github_stars": 52, "last_commit": "2026-07-08T05:06:24Z", "archived": false, "license": "MIT", "open_issues": 5, "registry_template": "https://iconiqui.com/r/{name}.json", "registry_index": "https://iconiqui.com/r/registry.json", "components": [ "accordion", "ai-input", "alert", "avatar", "b-accordion", "b-alert-dialog", "b-autocomplete", "b-avatar", "b-button", "b-checkbox-group", "b-checkbox", "b-collapsible", "b-combobox", "b-context-menu", "b-dialog", "b-hover-card", "b-popover", "b-progress", "b-radio-group", "b-select", "b-selection-toolbar", "b-separator", "b-slider", "b-switch", "b-tabs", "b-toggle", "b-togglegroup", "b-tooltip", "badge", "banner", "breadcrumbs", "button-group", "button", "calendar", "card", "carousel", "charts", "checkbox-group", "checkbox", "code-block", "color-picker", "combobox", "command-palette", "context-menu", "date-picker", "dia-text", "dialog", "drawer", "dropdown", "faq-pro", "favicon-badge", "feedback", "file-tree", "file-upload", "flux-button", "hover-card", "icon-bar", "infiniteribbon", "input-otp", "input", "logo-carousal", "morph-texts", "popover", "r-accordion", "r-alert-dialog", "r-avatar", "r-checkbox", "r-collapsible", "r-dialog", "r-dropdown", "r-hover-card", "r-popover", "r-progress", "r-radio-group", "r-select", "r-selection-toolbar", "r-separator", "r-slider", "r-switch", "r-tabs", "r-toggle", "r-togglegroup", "r-tooltip", "radial-button", "radiogroup", "reveal-text", "rolling-digits", "scroll-progress", "select", "selectiontoolbar", "setup-checklist", "shimmer-text", "skeleton", "slider", "spinner", "status-dot", "switch", "table", "tabs", "team-invitation" ], "component_items": [ { "name": "accordion", "type": "registry:ui", "title": "Accordion", "description": "Accordion with spring height, staggered text, default or quiet disclosure styles, and optional multi-open behavior. Built with Motion." }, { "name": "ai-input", "type": "registry:ui", "title": "AI Input", "description": "Chat-style AI composer with agent and model chips, sent-message bubbles, and an Apple Intelligence-style gradient wave on send." }, { "name": "alert", "type": "registry:ui", "title": "Alert", "description": "Compound Alert, AlertTitle, and AlertDescription parts with optional icons, legacy prop support, polite live announcements, and inline or toast behavior." }, { "name": "avatar", "type": "registry:ui", "title": "Avatar", "description": "Compound Base UI avatar with image, fallback, variant status badge, grouped stack, overflow count, auto initials, and tooltip-enabled status hints." }, { "name": "b-accordion", "type": "registry:ui", "title": "Accordion (Base UI)", "description": "Compound Accordion, AccordionItem, AccordionTrigger, and AccordionContent parts layered over Base UI primitives with default and quiet variants." }, { "name": "b-alert-dialog", "type": "registry:ui", "title": "Alert Dialog (Base UI)", "description": "Alert dialog with asChild triggers, action variants, optional media, controlled async flows, and reduced-motion aware transitions layered over Base UI primitiv…" }, { "name": "b-autocomplete", "type": "registry:ui", "title": "Autocomplete (Base UI)", "description": "Base UI autocomplete with list filtering, suggestion highlight motion, and the same Iconiq input shell as the combobox install." }, { "name": "b-avatar", "type": "registry:ui", "title": "Avatar (Base UI)", "description": "Avatar with the same single Iconiq API layered over Base UI primitives, keeping immediate fallback initials and a quiet image crossfade." }, { "name": "b-button", "type": "registry:ui", "title": "Button (Base UI)", "description": "Button with embedded Iconiq theme tokens, optional loading, href link rendering, ripple, press spring, hover lift, and intrinsic-width animation over the Base …" }, { "name": "b-checkbox-group", "type": "registry:ui", "title": "Checkbox Group (Base UI)", "description": "Checkbox group with the same Iconiq API layered over Base UI primitives, preserving the original row hover, tap spring, checkmark draw, and disclosure behavior." }, { "name": "b-checkbox", "type": "registry:ui", "title": "Checkbox (Base UI)", "description": "Checkbox with the same Iconiq API layered over Base UI primitives, preserving the original fill spring, press scale, checkmark draw, and label fade." }, { "name": "b-collapsible", "type": "registry:ui", "title": "Collapsible (Base UI)", "description": "Collapsible with the same Iconiq API layered over Base UI primitives, preserving the same height, icon, and content transitions as the Radix version." }, { "name": "b-combobox", "type": "registry:ui", "title": "Combobox (Base UI)", "description": "Compound Combobox parts layered over Base UI primitives, preserving the original input shell, clear action, item highlight, checkmark, and dropdown motion." }, { "name": "b-context-menu", "type": "registry:ui", "title": "Context Menu (Base UI)", "description": "Composable context menu layered over Base UI primitives, preserving the original panel spring, row entrance, active highlight, and shortcut layout." }, { "name": "b-dialog", "type": "registry:ui", "title": "Dialog (Base UI)", "description": "Dialog with the same exported Iconiq parts layered over Base UI primitives, preserving the original dialog springs while using the softer alert-dialog card sty…" }, { "name": "b-hover-card", "type": "registry:ui", "title": "Hover Card (Base UI)", "description": "Hover card with the same Iconiq API layered over Base UI popover primitives, preserving delayed hover reveal, instant focus open, collision-aware placement, an…" }, { "name": "b-popover", "type": "registry:ui", "title": "Popover (Base UI)", "description": "Popover with the same Iconiq API layered over Base UI popover primitives, preserving side-aware panel motion, optional anchor support, and size-aware content t…" }, { "name": "b-progress", "type": "registry:ui", "title": "Progress (Base UI)", "description": "Progress bar with the same Iconiq API layered over Base UI primitives, preserving the spring-smoothed fill, restrained inline readout, and quiet indeterminate …" }, { "name": "b-radio-group", "type": "registry:ui", "title": "Radio Group (Base UI)", "description": "Radio group with the same Iconiq API layered over Base UI primitives, preserving the original shared highlight, spring-loaded ring and dot, and staggered row e…" }, { "name": "b-select", "type": "registry:ui", "title": "Select (Base UI)", "description": "Compound Select parts layered over Base UI primitives, preserving the original trigger press, chevron rotation, grouped rows, and panel motion." }, { "name": "b-selection-toolbar", "type": "registry:ui", "title": "Selection Toolbar (Base UI)", "description": "Floating selection toolbar with the same Iconiq API layered over Base UI toolbar primitives, including viewport-aware positioning, keyboard shortcuts, and flui…" }, { "name": "b-separator", "type": "registry:ui", "title": "Separator (Base UI)", "description": "Separator with line, dashed, and dotted variants layered over the Base UI primitive, supporting horizontal and vertical orientation with a decorative default." }, { "name": "b-slider", "type": "registry:ui", "title": "Slider (Base UI)", "description": "Slider with the same Iconiq API layered over Base UI primitives, preserving the original spring-settled fill, active track height, and thumb scale motion." }, { "name": "b-switch", "type": "registry:ui", "title": "Switch (Base UI)", "description": "Switch with the same Iconiq API layered over Base UI primitives, preserving the original spring thumb travel, pressure-like squash, and foreground fill sweep." }, { "name": "b-tabs", "type": "registry:ui", "title": "Tabs (Base UI)", "description": "Tabs with the same Iconiq API layered over Base UI primitives, preserving the measured underline, keyboard flow, and motion-smoothed panel shell from the core …" }, { "name": "b-toggle", "type": "registry:ui", "title": "Toggle (Base UI)", "description": "Two-state button with spring press feedback, a muted fill that bounces in when pressed, and a subtle content lift layered over Base UI toggle primitives." }, { "name": "b-togglegroup", "type": "registry:ui", "title": "Toggle Group (Base UI)", "description": "Segmented toggle group with the same fluid wipe fill, sheen sweep, and icon press feedback as the standalone toggle, over Base UI toggle-group primitives." }, { "name": "b-tooltip", "type": "registry:ui", "title": "Tooltip (Base UI)", "description": "Tooltip with the same Iconiq API layered over Base UI primitives, preserving the original controlled delay timing, bubble shell, rotated-square arrow, and spri…" }, { "name": "badge", "type": "registry:ui", "title": "Badge", "description": "Preset-color badge with tinted fills, semantic aliases, animated default shimmer, dot variant, dismiss controls, and reduced-motion aware motion. Motion + CVA …" }, { "name": "banner", "type": "registry:ui", "title": "Banner", "description": "Top-of-screen announcement banner with four gradient tones, a left-aligned ringed icon and message, a right-aligned outlined action, a dismiss collapse, and a …" }, { "name": "breadcrumbs", "type": "registry:ui", "title": "Breadcrumbs", "description": "Compound breadcrumb trail with Base UI render composition, subtle Motion transitions, and dedicated current-page and separator parts." }, { "name": "button-group", "type": "registry:ui", "title": "Button Group", "description": "Grouped action buttons, text segments, separators, segmented button rows, and a selectable segmented control with spring-driven hover and active motion." }, { "name": "button", "type": "registry:ui", "title": "Button", "description": "Primary action control with larger default hit targets, spring press feedback, optional intrinsic width animation, and Motion ripples. Forwards ref and native …" }, { "name": "calendar", "type": "registry:ui", "title": "Calendar", "description": "shadcn-style monthly calendar with animated month/year transitions, selectable days, and date-fns-powered grid generation." }, { "name": "card", "type": "registry:ui", "title": "Card", "description": "Compound card surface with optional interactive lift, Motion-smoothed layout transitions, asChild link support, semantic title slots, and shared header, action…" }, { "name": "carousel", "type": "registry:ui", "title": "Carousel", "description": "Embla-powered carousel with aspect-ratio presets, responsive navigation placement, and horizontal or vertical slides. Built with embla-carousel-react and Lucid…" }, { "name": "charts", "type": "registry:ui", "title": "Charts", "description": "Recharts shell with registry chart tokens, ease-out series growth, and calm tooltip and legend transitions." }, { "name": "checkbox-group", "type": "registry:ui", "title": "Checkbox group", "description": "Multi-select option list with bordered empty state and a primary tick only when checked, plus hover/tap motion on each row. Motion + Lucide." }, { "name": "checkbox", "type": "registry:ui", "title": "Checkbox", "description": "Single checkbox with spring-pressed feedback, a line-drawn checkmark, and an optional inline label. Motion only." }, { "name": "code-block", "type": "registry:ui", "title": "Code Block", "description": "Editor-style code block with a filename tab, a top-right spring-crossfade copy button, a bottom status bar with language and line count, line numbers, built-in…" }, { "name": "color-picker", "type": "registry:ui", "title": "Color Picker", "description": "HSV panel with saturation field, hue/alpha sliders, multi-format readouts, hex input, and EyeDropper." }, { "name": "combobox", "type": "registry:ui", "title": "Combobox", "description": "Searchable single-select input with inline filtering, arrow-key navigation, animated dropdown motion, and an optional clear action." }, { "name": "command-palette", "type": "registry:ui", "title": "Command Palette", "description": "Radix dialog command menu with grouped search, keyboard shortcuts, navigation items, custom triggers, and optional theme switching." }, { "name": "context-menu", "type": "registry:ui", "title": "Context Menu", "description": "Native-feeling context menu with fixed-position viewport-aware placement, per-item icons and shortcuts, and spring entrance motion." }, { "name": "date-picker", "type": "registry:ui", "title": "Date Picker", "description": "Collapsible date picker trigger with the shared Iconiq Calendar panel, spring open motion, and month-aware selection." }, { "name": "dia-text", "type": "registry:ui", "title": "Dia Text", "description": "Animated inline text reveal with a sweeping gradient band, repeat controls, and optional fixed-width rotation for motion-driven typography." }, { "name": "dialog", "type": "registry:ui", "title": "Dialog", "description": "Modal dialog on Radix Dialog with Motion overlay and content springs, staggered children, and an animated close control. Pass the same open boolean to DialogCo…" }, { "name": "drawer", "type": "registry:ui", "title": "Drawer", "description": "Compound Vaul drawer with direction-aware layout, drag gestures, snap points, size variants, styled footer actions, optional close button, and safe-area-aware …" }, { "name": "dropdown", "type": "registry:ui", "title": "Dropdown", "description": "Animated dropdown with a selectable value mode and an action-menu mode, plus chevron rotation and spring-driven menu entry." }, { "name": "faq-pro", "type": "registry:ui", "title": "FAQ Pro", "description": "Searchable FAQ accordion with rounded cards, animated panels, automatic match expansion, and inline query highlighting. Built with Base UI Accordion, Motion, a…" }, { "name": "favicon-badge", "type": "registry:ui", "title": "Favicon Badge", "description": "Circular website favicon badge with optional label text, spring entrance animation, and Google favicon resolution." }, { "name": "feedback", "type": "registry:ui", "title": "Feedback Form", "description": "Collapsed pill that morphs into an expanded feedback panel with a send button, loading state, and a textarea, driven by pure CSS transitions with asymmetric op…" }, { "name": "file-tree", "type": "registry:ui", "title": "File Tree", "description": "Compound file tree with nested FileTreeItem rows, Base UI Button folder toggles, extension-aware icons, hover highlight tracking, and optional blue emphasis fo…" }, { "name": "file-upload", "type": "registry:ui", "title": "File Upload", "description": "Drag-and-drop file uploader with click-to-browse fallback, queued file rows, image previews, built-in progress states, and optional change callbacks." }, { "name": "flux-button", "type": "registry:ui", "title": "Flux Button", "description": "Async button with idle, loading, and success states." }, { "name": "hover-card", "type": "registry:ui", "title": "Hover Card", "description": "Inline hover card with hover-only timing delays, instant focus reveal, collision-aware Popover positioning, Slot-based custom triggers, and a spring-driven con…" }, { "name": "icon-bar", "type": "registry:ui", "title": "Icon Bar", "description": "Row of compact icon chips that expand on hover or focus and stay open when selected. Built with Base UI Toggle Group, Motion, and Lucide." }, { "name": "infiniteribbon", "type": "registry:ui", "title": "Infinite Ribbon", "description": "Full-width looping announcement ribbon with repeated content, optional reverse direction, and diagonal rotation controls." }, { "name": "input-otp", "type": "registry:ui", "title": "Input OTP", "description": "Animated one-time password field built on Base UI OTP Field with focus border motion, character entrance, caret pulse, and OTPSlots auto-layout." }, { "name": "input", "type": "registry:ui", "title": "Input", "description": "Input with a spring-animated caret." } ], "component_count": 110, "components_truncated": true, "component_types": { "registry:ui": 109, "registry:lib": 1 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 79, "name": "@icons-animated", "category": "Icons/logos", "tags": [ "aesthetic" ], "tagline": "An open-source library of meticulously animated icons (Tabler, Phosphor, and more) for your projects, inspired by lucide-animated.com", "short_description": "An open-source library of meticulously animated icons (Tabler, Phosphor, and more) for your projects, inspired by lucide-animated.com", "description": "An open-source shadcn registry of meticulously animated SVG icons spanning three icon families: Huge Icons (4,000+ free icons), Tabler Icons (MIT-licensed), and Phosphor Icons (flexible interface icons). Each icon is individually installable via npx shadcn add @icons-animated/-. Inspired by lucide-animated; built with React and CSS/JS animation. Free for personal and commercial use (components cannot be redistributed as-is). Use for: adding on-demand animated icon components from Huge, Tabler, or Phosphor icon sets to any React project without manually importing animation logic.", "homepage": "https://icons.lndev.me", "docs": "https://icons.lndev.me", "github": "https://github.com/ln-dev7/icons-animated", "components_github": "https://github.com/ln-dev7/icons-animated/tree/main/components", "github_default_branch": "main", "github_stars": 77, "last_commit": "2026-04-18T20:31:41Z", "archived": false, "license": null, "open_issues": 0, "registry_template": "https://icons.lndev.me/r/{name}.json", "registry_index": null, "components": [], "component_items": [], "component_count": null, "components_truncated": false, "component_types": {}, "has_logo": true, "enrichment_errors": [ "registry_index_unresolved" ], "featured": true }, { "number": 80, "name": "@indiacn", "category": "Design system", "tags": [ "components" ], "tagline": "UX4G 2.0 design system for India — many accessible React components and an 8-color theme preset for native apps.", "short_description": "UX4G 2.0 design system for India — many accessible React components and an 8-color theme preset for native apps.", "description": "An open-source community design system for India's digital ecosystem, compliant with the UX4G 2.0 government design specification and WCAG 2.1 AA. Ships 25+ components (Button, Badge, Card, Modal, Tabs, Toast, Dropdown, Typography, and more) with an 8-semantic-color-scale theme (primary, secondary, neutral, success, danger, warning, info), dark mode, focus rings, and radius/keyframe tokens. Built on Radix UI, Tailwind CSS v4, CVA, React 19/Next.js 16. Distributed via shadcn registry; MIT-licensed. Use for: building accessible Indian government-style or public-service web applications that must follow UX4G 2.0 design principles.", "homepage": "https://indiacn.in", "docs": "https://indiacn.in/docs", "github": "https://github.com/krishnaagarwal1506/Indiacn-ui", "components_github": "https://github.com/krishnaagarwal1506/Indiacn-ui/tree/main/registry", "github_default_branch": "main", "github_stars": 4, "last_commit": "2026-05-23T18:28:30Z", "archived": false, "license": "MIT", "open_issues": 3, "registry_template": "https://indiacn.in/r/{name}.json", "registry_index": "https://indiacn.in/r/registry.json", "components": [ "theme", "typography", "button", "button-group", "badge", "alert", "accordion", "breadcrumb", "card", "chip", "collapse", "dropdown", "list-group", "modal", "offcanvas", "pagination", "popover", "progress", "search", "separator", "skeleton", "spinner", "stepper", "tabs", "toast", "tooltip" ], "component_items": [ { "name": "theme", "type": "registry:theme", "title": "IndiaCN UX4G theme", "description": "UX4G 2.0 design tokens — 8 semantic colors with 50–900 scales, focus-shadow utilities, radius ladder, and accordion/collapsible keyframes. Required by every In…" }, { "name": "typography", "type": "registry:ui", "title": "Typography", "description": "21 typography components: 6 Display, 6 Headline, 3 Title, 3 Label, 3 Body. Required by every other IndiaCN component." }, { "name": "button", "type": "registry:ui", "title": "Button", "description": "Versatile button with filled/outlined/tonal/text variants, primary/success/destructive themes, sm/md/lg sizes, icon support, and loading state." }, { "name": "button-group", "type": "registry:ui", "title": "Button Group", "description": "Groups related buttons horizontally or vertically with shared borders." }, { "name": "badge", "type": "registry:ui", "title": "Badge", "description": "Compact label for status, counts, or categories. 9 themes × 3 variants × 3 sizes × 2 shapes." }, { "name": "alert", "type": "registry:ui", "title": "Alert", "description": "Contextual feedback message. 8 themes (primary, secondary, success, danger, warning, info, light, dark) with optional dismiss button." }, { "name": "accordion", "type": "registry:ui", "title": "Accordion", "description": "Vertically-stacked collapsible sections. Built on Radix Accordion primitive." }, { "name": "breadcrumb", "type": "registry:ui", "title": "Breadcrumb", "description": "Navigation trail showing the current page's hierarchy." }, { "name": "card", "type": "registry:ui", "title": "Card", "description": "Composable container with header, content, footer, image, title, and description sub-parts." }, { "name": "chip", "type": "registry:ui", "title": "Chip", "description": "Tags, filters, or selections. 7 themes × 3 variants × 3 sizes; supports icons, avatars, dismiss, and selected state." }, { "name": "collapse", "type": "registry:ui", "title": "Collapse", "description": "Single collapsible region powered by Radix Collapsible." }, { "name": "dropdown", "type": "registry:ui", "title": "Dropdown", "description": "Dropdown menu with items, checkbox/radio items, sub-menus, separators, and shortcuts." }, { "name": "list-group", "type": "registry:ui", "title": "List Group", "description": "Vertical list with optional flush, horizontal, and contextual-color variants." }, { "name": "modal", "type": "registry:ui", "title": "Modal", "description": "Dialog with sm/md/lg/xl/fullscreen sizes and optional scrollable body." }, { "name": "offcanvas", "type": "registry:ui", "title": "Offcanvas", "description": "Slide-in panel from any side with optional body-scroll mode." }, { "name": "pagination", "type": "registry:ui", "title": "Pagination", "description": "Page navigation with default and flat variants in 3 sizes." }, { "name": "popover", "type": "registry:ui", "title": "Popover", "description": "Anchored floating panel powered by Radix Popover." }, { "name": "progress", "type": "registry:ui", "title": "Progress", "description": "Linear progress bar with theme colors, sizes, striped + animated stripes." }, { "name": "search", "type": "registry:ui", "title": "Search", "description": "Search input with icon, sizes, and optional clear button." }, { "name": "separator", "type": "registry:ui", "title": "Separator", "description": "Horizontal or vertical divider built on Radix Separator." }, { "name": "skeleton", "type": "registry:ui", "title": "Skeleton", "description": "Loading placeholder with rect/circle/pill/text shapes and pulse/wave animations." }, { "name": "spinner", "type": "registry:ui", "title": "Spinner", "description": "Loading indicator with border/grow variants, theme colors, and sm/md/lg sizes." }, { "name": "stepper", "type": "registry:ui", "title": "Stepper", "description": "Step indicator for multi-step flows with horizontal/vertical orientation and completed/active/warning/pending states." }, { "name": "tabs", "type": "registry:ui", "title": "Tabs", "description": "Tab list with tabs, pills, and underline variants. Built on Radix Tabs." }, { "name": "toast", "type": "registry:ui", "title": "Toast", "description": "Notification toast with provider, hook, container, and theme variants." }, { "name": "tooltip", "type": "registry:ui", "title": "Tooltip", "description": "Hover/focus tooltip with 8 theme variants. Built on Radix Tooltip." } ], "component_count": 26, "components_truncated": false, "component_types": { "registry:theme": 1, "registry:ui": 25 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 81, "name": "@inferencesh", "category": "AI/chat UI", "tags": [ "ai" ], "tagline": "batteries-included agent components by inference.sh. chat interfaces with streaming, tool invocation rendering, syntax-highlighted code blocks, markdown renderer, and more.", "short_description": "batteries-included agent components by inference.sh. chat interfaces with streaming, tool invocation rendering, syntax-highlighted code blocks, markdown renderer, and more.", "description": "A batteries-included shadcn registry from inference.sh providing a complete AI agent UI runtime. Key blocks: Agent (full wired agent with streaming and tool lifecycle), Chat (container, messages, composer, status indicators), Tools (tool invocation UI: pending, in-progress, human-in-the-loop approval, results), Widgets (renders declarative JSON UI nodes as interactive components), Markdown (high-fidelity with code blocks and zoomable images), Code Block, Steps, Sidebar Light, Table of Contents, YouTube Embed, and Zoomable Image. Open-source, MIT. Use for: building production AI agent interfaces in Next.js that need streaming, tool rendering, and human-in-the-loop approvals without wiring each piece from scratch.", "homepage": "https://ui.inference.sh", "docs": "https://inference.sh/docs", "github": "https://github.com/inference-sh/shadcn-registry", "components_github": "https://github.com/inference-sh/shadcn-registry/tree/dev/registry", "github_default_branch": "dev", "github_stars": 21, "last_commit": "2026-06-14T04:16:35Z", "archived": false, "license": null, "open_issues": 6, "registry_template": "https://ui.inference.sh/r/{name}.json", "registry_index": "https://ui.inference.sh/r/registry.json", "components": [ "agent", "chat", "tools", "task", "widgets", "pretext-md", "virtualize", "markdown", "code-block", "youtube-embed", "zoomable-image", "steps", "sidebar-light", "table-of-contents" ], "component_items": [ { "name": "agent", "type": "registry:block", "title": "Agent Chat", "description": "Full-featured AI agent chat with state management, tools, and widgets." }, { "name": "chat", "type": "registry:block", "title": "Chat UI Primitives", "description": "Virtualized chat with measured markdown. Auto-scroll, message strategies, typing indicators." }, { "name": "tools", "type": "registry:block", "title": "Tool Invocation UI", "description": "Displays tool lifecycle: pending, in-progress, approval, and results." }, { "name": "task", "type": "registry:block", "title": "Task", "description": "Real-time task display with streaming support, status indicators, and logs viewer." }, { "name": "widgets", "type": "registry:block", "title": "Widget Renderer", "description": "Renders declarative UI nodes (forms, buttons, cards) from agent tool outputs." }, { "name": "pretext-md", "type": "registry:block", "title": "pretext-md", "description": "Measured markdown renderer powered by pretext. DOM-free text measurement, plugin architecture, virtualizable." }, { "name": "virtualize", "type": "registry:block", "title": "Virtualize", "description": "Typed virtualization with measurement strategies, incremental caching, and scroll correction." }, { "name": "markdown", "type": "registry:block", "title": "Markdown Renderer (legacy)", "description": "react-markdown based renderer. Consider using pretext-md instead." }, { "name": "code-block", "type": "registry:block", "title": "Code Block", "description": "Syntax-highlighted code block with line numbers and copy button." }, { "name": "youtube-embed", "type": "registry:block", "title": "YouTube Embed", "description": "Responsive YouTube video embed with loading state." }, { "name": "zoomable-image", "type": "registry:block", "title": "Zoomable Image", "description": "Click-to-zoom image component with medium.com-style lightbox." }, { "name": "steps", "type": "registry:block", "title": "Steps", "description": "Numbered step component with connecting line for sequential instructions." }, { "name": "sidebar-light", "type": "registry:block", "title": "Sidebar Light", "description": "Lightweight sidebar navigation with nested items and active state." }, { "name": "table-of-contents", "type": "registry:block", "title": "Table of Contents", "description": "Auto-scrolling table of contents with intersection observer for active section." } ], "component_count": 14, "components_truncated": false, "component_types": { "registry:block": 14 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 82, "name": "@intentui", "category": "Component library (general)", "tags": [ "dashboard", "components" ], "tagline": "Accessible React component library to copy, customize, and own your UI.", "short_description": "Accessible React component library to copy, customize, and own your UI.", "description": "A large, fully accessible open-source React component library built on React Aria (Adobe) rather than Radix, offering 565+ registry items including an extensive primitive set, 10+ color themes, and categories: Buttons (Button Group, File Trigger, Toggle Group), Collections (Choice Box, Dropdown, Grid List, List Box, Menu, Table, Tag Group, Tree), Colors (Color Area, Field, Picker, Slider, Swatch, Wheel), Date/Time (Calendar, Date/Range Picker, Time Field), Forms, Drag & Drop, Charts (Area, Bar, Line, Pie), Overlays, and data visualization (Tracker, Meter, Leaderboard). Built with Tailwind CSS, TypeScript, works with Next.js, Vite, and Inertia.js. Free and MIT-licensed. Use for: building accessible, React Aria-backed UIs when Radix UI is not desired, especially date pickers, color pickers, and drag-and-drop flows.", "homepage": "https://intentui.com", "docs": "https://intentui.com/docs/getting-started/introduction", "github": "https://github.com/intentui/intentui", "components_github": "https://github.com/intentui/intentui/tree/3.x/src/components", "github_default_branch": "3.x", "github_stars": 1941, "last_commit": "2026-07-06T08:16:40Z", "archived": false, "license": "MIT", "open_issues": 7, "registry_template": "https://intentui.com/r/{name}", "registry_index": "https://intentui.com/r/registry", "components": [ "theme-default", "theme-blue", "theme-sky", "theme-indigo", "theme-emerald", "theme-teal", "theme-purple", "theme-pink", "theme-rose", "theme-green", "theme-lime", "theme-cyan", "area-chart", "avatar", "badge", "bar-chart", "bar-list", "breadcrumbs", "button-group", "button", "calendar", "card", "carousel", "chart", "checkbox", "choice-box", "color-area", "color-field", "color-picker", "color-slider", "color-swatch-picker", "color-swatch", "color-thumb", "color-wheel", "combo-box", "command-menu", "container", "context-menu", "date-field", "date-picker", "date-range-picker", "description-list", "dialog", "disclosure-group", "drawer", "drop-zone", "dropdown", "field", "file-trigger", "grid-list", "heading", "input-otp", "input", "keyboard", "leaderboard", "line-chart", "link", "list-box", "loader", "menu", "meter", "modal", "multiple-select", "native-select", "navbar", "note", "number-field", "pagination", "pie-chart", "popover", "progress-bar", "progress-circle", "radio", "range-calendar", "scroll-area", "search-field", "select", "separator", "sheet", "show-more", "sidebar", "skeleton", "slider", "snippet", "switch", "table", "tabs", "tag-field", "tag-group", "text-field", "text", "textarea", "time-field", "toast", "toggle-group", "toggle", "toolbar", "tooltip", "tracker", "tree" ], "component_items": [ { "name": "theme-default", "type": "registry:style", "title": null, "description": null }, { "name": "theme-blue", "type": "registry:style", "title": null, "description": null }, { "name": "theme-sky", "type": "registry:style", "title": null, "description": null }, { "name": "theme-indigo", "type": "registry:style", "title": null, "description": null }, { "name": "theme-emerald", "type": "registry:style", "title": null, "description": null }, { "name": "theme-teal", "type": "registry:style", "title": null, "description": null }, { "name": "theme-purple", "type": "registry:style", "title": null, "description": null }, { "name": "theme-pink", "type": "registry:style", "title": null, "description": null }, { "name": "theme-rose", "type": "registry:style", "title": null, "description": null }, { "name": "theme-green", "type": "registry:style", "title": null, "description": null }, { "name": "theme-lime", "type": "registry:style", "title": null, "description": null }, { "name": "theme-cyan", "type": "registry:style", "title": null, "description": null }, { "name": "area-chart", "type": "registry:ui", "title": "area-chart", "description": "area-chart" }, { "name": "avatar", "type": "registry:ui", "title": "avatar", "description": "avatar" }, { "name": "badge", "type": "registry:ui", "title": "badge", "description": "badge" }, { "name": "bar-chart", "type": "registry:ui", "title": "bar-chart", "description": "bar-chart" }, { "name": "bar-list", "type": "registry:ui", "title": "bar-list", "description": "bar-list" }, { "name": "breadcrumbs", "type": "registry:ui", "title": "breadcrumbs", "description": "breadcrumbs" }, { "name": "button-group", "type": "registry:ui", "title": "button-group", "description": "button-group" }, { "name": "button", "type": "registry:ui", "title": "button", "description": "button" }, { "name": "calendar", "type": "registry:ui", "title": "calendar", "description": "calendar" }, { "name": "card", "type": "registry:ui", "title": "card", "description": "card" }, { "name": "carousel", "type": "registry:ui", "title": "carousel", "description": "carousel" }, { "name": "chart", "type": "registry:ui", "title": "chart", "description": "chart" }, { "name": "checkbox", "type": "registry:ui", "title": "checkbox", "description": "checkbox" }, { "name": "choice-box", "type": "registry:ui", "title": "choice-box", "description": "choice-box" }, { "name": "color-area", "type": "registry:ui", "title": "color-area", "description": "color-area" }, { "name": "color-field", "type": "registry:ui", "title": "color-field", "description": "color-field" }, { "name": "color-picker", "type": "registry:ui", "title": "color-picker", "description": "color-picker" }, { "name": "color-slider", "type": "registry:ui", "title": "color-slider", "description": "color-slider" }, { "name": "color-swatch-picker", "type": "registry:ui", "title": "color-swatch-picker", "description": "color-swatch-picker" }, { "name": "color-swatch", "type": "registry:ui", "title": "color-swatch", "description": "color-swatch" }, { "name": "color-thumb", "type": "registry:ui", "title": "color-thumb", "description": "color-thumb" }, { "name": "color-wheel", "type": "registry:ui", "title": "color-wheel", "description": "color-wheel" }, { "name": "combo-box", "type": "registry:ui", "title": "combo-box", "description": "combo-box" }, { "name": "command-menu", "type": "registry:ui", "title": "command-menu", "description": "command-menu" }, { "name": "container", "type": "registry:ui", "title": "container", "description": "container" }, { "name": "context-menu", "type": "registry:ui", "title": "context-menu", "description": "context-menu" }, { "name": "date-field", "type": "registry:ui", "title": "date-field", "description": "date-field" }, { "name": "date-picker", "type": "registry:ui", "title": "date-picker", "description": "date-picker" }, { "name": "date-range-picker", "type": "registry:ui", "title": "date-range-picker", "description": "date-range-picker" }, { "name": "description-list", "type": "registry:ui", "title": "description-list", "description": "description-list" }, { "name": "dialog", "type": "registry:ui", "title": "dialog", "description": "dialog" }, { "name": "disclosure-group", "type": "registry:ui", "title": "disclosure-group", "description": "disclosure-group" }, { "name": "drawer", "type": "registry:ui", "title": "drawer", "description": "drawer" }, { "name": "drop-zone", "type": "registry:ui", "title": "drop-zone", "description": "drop-zone" }, { "name": "dropdown", "type": "registry:ui", "title": "dropdown", "description": "dropdown" }, { "name": "field", "type": "registry:ui", "title": "field", "description": "field" }, { "name": "file-trigger", "type": "registry:ui", "title": "file-trigger", "description": "file-trigger" }, { "name": "grid-list", "type": "registry:ui", "title": "grid-list", "description": "grid-list" }, { "name": "heading", "type": "registry:ui", "title": "heading", "description": "heading" }, { "name": "input-otp", "type": "registry:ui", "title": "input-otp", "description": "input-otp" }, { "name": "input", "type": "registry:ui", "title": "input", "description": "input" }, { "name": "keyboard", "type": "registry:ui", "title": "keyboard", "description": "keyboard" }, { "name": "leaderboard", "type": "registry:ui", "title": "leaderboard", "description": "leaderboard" }, { "name": "line-chart", "type": "registry:ui", "title": "line-chart", "description": "line-chart" }, { "name": "link", "type": "registry:ui", "title": "link", "description": "link" }, { "name": "list-box", "type": "registry:ui", "title": "list-box", "description": "list-box" }, { "name": "loader", "type": "registry:ui", "title": "loader", "description": "loader" }, { "name": "menu", "type": "registry:ui", "title": "menu", "description": "menu" } ], "component_count": 569, "components_truncated": true, "component_types": { "registry:style": 12, "registry:ui": 88, "registry:page": 438, "registry:lib": 2, "registry:hook": 3, "registry:block": 25, "registry:item": 1 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 83, "name": "@jalco", "category": "Niche/single-purpose", "tags": [ "saas", "ai" ], "tagline": "A curated collection of GitHub-integrated, documentation, and developer-facing components. Self-contained, zero-dependency, and production-ready.", "short_description": "A curated collection of GitHub-integrated, documentation, and developer-facing components. Self-contained, zero-dependency, and production-ready.", "description": "A personal shadcn-compatible registry (jal-co/ui) of ~36 developer-facing and documentation-oriented components, zero-dependency and self-contained. Includes Code Block (shiki-powered with language icon and copy), Diff Viewer, Code Block Command (tabbed CLI switcher for pnpm/yarn/npm/bun/shadcn), GitHub Activity Graph, CI Badge, Commit Graph, Contributor Grid, GitHub Stars Button, Release Badge, Repo Card, Discord Badge, npm Badge, Download Sparkline, License Badge, AI Copy Button, API Reference Table, Color Palette, File Tree, Kbd, Stepper, Logo Cloud, Testimonial, Cron Schedule, Env Table, JSON Viewer, Log Viewer, Request Viewer, Status Indicator, and Crypto Tip Jar. Free forever. Use for: enriching developer tool documentation sites, open-source project READMEs, and SaaS developer portals with polished reference-style UI widgets.", "homepage": "https://ui.justinlevine.me", "docs": "https://ui.justinlevine.me/docs", "github": "https://github.com/jal-co/ui", "components_github": null, "github_default_branch": "main", "github_stars": 132, "last_commit": "2026-04-24T16:48:26Z", "archived": false, "license": "MIT", "open_issues": 2, "registry_template": "https://ui.justinlevine.me/r/{name}.json", "registry_index": null, "components": [], "component_items": [], "component_count": null, "components_truncated": false, "component_types": {}, "has_logo": true, "enrichment_errors": [ "registry_index_unresolved" ], "featured": true }, { "number": 84, "name": "@jolyui", "category": "Animated components", "tags": [ "ai", "aesthetic" ], "tagline": "JolyUI is a modern React component library built with TypeScript and Tailwind CSS.", "short_description": "JolyUI is a modern React component library built with TypeScript and Tailwind CSS.", "description": "An open-source library of 50+ animated React components extending shadcn/ui, built with Framer Motion for 60fps animations, Tailwind CSS v4, TypeScript, and Radix UI primitives. Components visible in the registry (195 items including demos) include Animated Beam, Bento Grid, Expanded Map, Dock, Image Comparison, Animated Tooltip, Rainbow Button, File Tree, GitHub Contributors, Glitch Text, Phone Card, Rotate Text, Magnetic, Code Block, Typewriter Text, Velocity Morph, Number Counter, Highlight Text, Command Palette, AI Prompt Box, Date Wheel Picker, Liquid Metal Button, Morphing Cursor, Falling Text, and Gooey Text Morphing. Works with Next.js 14+ and React 19. Free and MIT-licensed. Use for: adding high-quality, motion-rich interactive components to React/Next.js apps that need a polished, premium feel beyond standard shadcn primitives.", "homepage": "https://www.jolyui.dev", "docs": "https://www.jolyui.dev/docs/introduction", "github": "https://github.com/johuniq/jolyui", "components_github": null, "github_default_branch": "main", "github_stars": 253, "last_commit": "2026-06-22T08:42:35Z", "archived": false, "license": "MIT", "open_issues": 1, "registry_template": "https://www.jolyui.dev/r/{name}.json", "registry_index": "https://www.jolyui.dev/r/registry.json", "components": [ "style", "animated-beam", "animated-theme-toggle", "animated-table", "bento-grid", "expanded-map", "button", "dock", "image-comparison", "animated-tooltip", "animated-toast", "rainbow-button", "file-tree", "github-contributors", "glitch-text", "phone-card", "rotate-text", "lazy-video", "vercel-tabs", "magnetic", "video-player", "calender", "character-morph", "code-block", "text-morphing", "scroll-text", "segmented-button", "typewritter-text", "velocity-morph", "number-counter", "highlight-text", "command-palette", "github-star", "gooey-text-morphing", "feedback-widget", "image-sphere", "infinite-ribbon", "hover-preview", "ai-prompt-box", "date-wheel-picker", "liquid-metal-button", "morphing-cursor", "falling-text", "shutter-text", "utils", "use-mobile", "theme-daylight", "theme-midnight", "theme-emerald", "animated-beam-demo", "animated-beam-curved-demo", "animated-beam-multiple-demo", "animated-beam-bidirectional-demo", "animated-theme-toggle-demo", "animated-theme-toggle-sizes-demo", "animated-theme-toggle-navbar-demo", "dock-demo", "expanded-map-demo", "expanded-map-locations-demo", "expanded-map-dark-demo", "expanded-map-zoom-demo", "dock-macos-demo", "dock-social-demo", "image-comparison-demo", "image-comparison-hover-demo", "image-comparison-fade-demo", "image-comparison-split-demo", "image-comparison-lens-demo", "image-comparison-vertical-demo", "animated-tooltip-demo", "animated-tooltip-animation-demo", "animated-tooltip-icon-demo", "animated-tooltip-status-demo", "animated-tooltip-rich-demo", "rainbow-button-demo", "animated-toast-demo", "animated-toast-minimal-demo", "animated-toast-undo-demo", "animated-toast-notification-demo", "animated-toast-stacked-demo", "animated-toast-promise-demo", "animated-table-basic-demo", "animated-table-sort-demo", "animated-table-search-demo", "animated-table-select-demo", "animated-table-expand-demo", "animated-table-column-demo", "animated-table-pagination-demo", "animated-table-full-demo", "bento-grid-custom-demo", "bento-grid-portfolio-demo", "button-demo", "button-variants-demo", "button-sizes-demo", "button-icon-demo", "file-tree-basic-demo", "file-tree-expandable-demo", "file-tree-full-expanded-demo", "file-tree-selectable-demo", "file-tree-custom-icons-demo" ], "component_items": [ { "name": "style", "type": "registry:style", "title": null, "description": null }, { "name": "animated-beam", "type": "registry:ui", "title": null, "description": null }, { "name": "animated-theme-toggle", "type": "registry:ui", "title": null, "description": null }, { "name": "animated-table", "type": "registry:ui", "title": null, "description": null }, { "name": "bento-grid", "type": "registry:ui", "title": null, "description": null }, { "name": "expanded-map", "type": "registry:ui", "title": null, "description": null }, { "name": "button", "type": "registry:ui", "title": null, "description": null }, { "name": "dock", "type": "registry:ui", "title": null, "description": null }, { "name": "image-comparison", "type": "registry:ui", "title": null, "description": null }, { "name": "animated-tooltip", "type": "registry:ui", "title": null, "description": null }, { "name": "animated-toast", "type": "registry:ui", "title": null, "description": null }, { "name": "rainbow-button", "type": "registry:ui", "title": null, "description": null }, { "name": "file-tree", "type": "registry:ui", "title": null, "description": null }, { "name": "github-contributors", "type": "registry:ui", "title": null, "description": null }, { "name": "glitch-text", "type": "registry:ui", "title": null, "description": null }, { "name": "phone-card", "type": "registry:ui", "title": null, "description": null }, { "name": "rotate-text", "type": "registry:ui", "title": null, "description": null }, { "name": "lazy-video", "type": "registry:ui", "title": null, "description": null }, { "name": "vercel-tabs", "type": "registry:ui", "title": null, "description": null }, { "name": "magnetic", "type": "registry:ui", "title": null, "description": null }, { "name": "video-player", "type": "registry:ui", "title": null, "description": null }, { "name": "calender", "type": "registry:ui", "title": null, "description": null }, { "name": "character-morph", "type": "registry:ui", "title": null, "description": null }, { "name": "code-block", "type": "registry:ui", "title": null, "description": null }, { "name": "text-morphing", "type": "registry:ui", "title": null, "description": null }, { "name": "scroll-text", "type": "registry:ui", "title": null, "description": null }, { "name": "segmented-button", "type": "registry:ui", "title": null, "description": null }, { "name": "typewritter-text", "type": "registry:ui", "title": null, "description": null }, { "name": "velocity-morph", "type": "registry:ui", "title": null, "description": null }, { "name": "number-counter", "type": "registry:ui", "title": null, "description": null }, { "name": "highlight-text", "type": "registry:ui", "title": null, "description": null }, { "name": "command-palette", "type": "registry:ui", "title": null, "description": null }, { "name": "github-star", "type": "registry:ui", "title": null, "description": null }, { "name": "gooey-text-morphing", "type": "registry:ui", "title": null, "description": null }, { "name": "feedback-widget", "type": "registry:ui", "title": null, "description": null }, { "name": "image-sphere", "type": "registry:ui", "title": null, "description": null }, { "name": "infinite-ribbon", "type": "registry:ui", "title": null, "description": null }, { "name": "hover-preview", "type": "registry:ui", "title": null, "description": null }, { "name": "ai-prompt-box", "type": "registry:ui", "title": null, "description": null }, { "name": "date-wheel-picker", "type": "registry:ui", "title": null, "description": null }, { "name": "liquid-metal-button", "type": "registry:ui", "title": null, "description": null }, { "name": "morphing-cursor", "type": "registry:ui", "title": null, "description": null }, { "name": "falling-text", "type": "registry:ui", "title": null, "description": null }, { "name": "shutter-text", "type": "registry:ui", "title": null, "description": null }, { "name": "utils", "type": "registry:lib", "title": null, "description": null }, { "name": "use-mobile", "type": "registry:hook", "title": null, "description": null }, { "name": "theme-daylight", "type": "registry:theme", "title": null, "description": null }, { "name": "theme-midnight", "type": "registry:theme", "title": null, "description": null }, { "name": "theme-emerald", "type": "registry:theme", "title": null, "description": null }, { "name": "animated-beam-demo", "type": "registry:example", "title": null, "description": null }, { "name": "animated-beam-curved-demo", "type": "registry:example", "title": null, "description": null }, { "name": "animated-beam-multiple-demo", "type": "registry:example", "title": null, "description": null }, { "name": "animated-beam-bidirectional-demo", "type": "registry:example", "title": null, "description": null }, { "name": "animated-theme-toggle-demo", "type": "registry:example", "title": null, "description": null }, { "name": "animated-theme-toggle-sizes-demo", "type": "registry:example", "title": null, "description": null }, { "name": "animated-theme-toggle-navbar-demo", "type": "registry:example", "title": null, "description": null }, { "name": "dock-demo", "type": "registry:example", "title": null, "description": null }, { "name": "expanded-map-demo", "type": "registry:example", "title": null, "description": null }, { "name": "expanded-map-locations-demo", "type": "registry:example", "title": null, "description": null }, { "name": "expanded-map-dark-demo", "type": "registry:example", "title": null, "description": null } ], "component_count": 199, "components_truncated": true, "component_types": { "registry:style": 1, "registry:ui": 43, "registry:lib": 1, "registry:hook": 1, "registry:theme": 3, "registry:example": 150 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 85, "name": "@joyco", "category": "Component library (general)", "tags": [ "aesthetic", "components" ], "tagline": "Components including MobileMenu, ScrollArea with gradients, Chat UI, HLSVideoPlayer, and Marquee.", "short_description": "Components including MobileMenu, ScrollArea with gradients, Chat UI, HLSVideoPlayer, and Marquee.", "description": "JOYCO Hub is the internal public registry of the JOYCO studio, hosting three content categories: 24 Components, 15 Toolbox items, and 13 Logs. Notable components include MobileMenu, ScrollArea with gradient overlays, a Chat UI, HLSVideoPlayer, Marquee, Scramble Button, Magnetic, Typewriter, Spritesheet Sequencer, Image Sequence, Infinite List, and Mention. Canvas utilities cover 2D and R3F/Three.js 3D. Built with React and Tailwind; some pieces use framer-motion/motion. Free and open source. Use for: adding studio-grade, interaction-heavy primitives (media playback, canvas, scroll effects) to a shadcn/ui project without reaching for a full component library.", "homepage": "https://registry.joyco.studio", "docs": "https://registry.joyco.studio", "github": "https://github.com/joyco-studio/registry", "components_github": "https://github.com/joyco-studio/registry/tree/main/registry", "github_default_branch": "main", "github_stars": 22, "last_commit": "2026-06-29T13:33:27Z", "archived": false, "license": null, "open_issues": 10, "registry_template": "https://registry.joyco.studio/r/{name}.json", "registry_index": "https://registry.joyco.studio/r/registry.json", "components": [ "infinite-list", "marquee", "file-button", "file-dropzone", "mobile-menu", "scroll-area", "chat", "hls-video-player", "action-hint", "image-sequence", "typewriter", "spritesheet-sequencer", "magnetic", "scramble", "scramble-button", "brick-breaker", "snake-game", "space-invaders", "typed-emitter", "canvas-2d", "debug-canvas", "debug", "avatar", "badge", "button", "button-group", "card", "chart", "collapsible", "dropdown-menu", "input", "input-group", "kbd", "media-player", "mention", "popover", "select", "separator", "slider", "switch", "tabs", "textarea", "tooltip", "cluster", "joyco-theme", "joyco-fonts", "utils", "ui" ], "component_items": [ { "name": "infinite-list", "type": "registry:component", "title": "Infinite List", "description": "A bias-based infinite scroll wrapper and hook." }, { "name": "marquee", "type": "registry:component", "title": "Marquee", "description": "The all in one marquee component with smooth Web Animations API." }, { "name": "file-button", "type": "registry:component", "title": "File Button", "description": "A button that opens a file input when clicked." }, { "name": "file-dropzone", "type": "registry:component", "title": "File Dropzone", "description": "A drag-and-drop file upload component with image preview, validation, and error handling." }, { "name": "mobile-menu", "type": "registry:component", "title": "Mobile Menu", "description": "A full-screen overlay mobile menu." }, { "name": "scroll-area", "type": "registry:component", "title": "Scroll Area", "description": "A scrollable area component with customizable top and bottom shadows that appear when content overflows." }, { "name": "chat", "type": "registry:component", "title": "Chat", "description": "A composable chat component" }, { "name": "hls-video-player", "type": "registry:component", "title": "HLS Video Player", "description": "A headless HLS video player with native HLS detection and error handling." }, { "name": "action-hint", "type": "registry:component", "title": "Action Hint", "description": "A particle emitter for showing ephemeral action feedback hints that fade out." }, { "name": "image-sequence", "type": "registry:component", "title": "Image Sequence", "description": "A canvas-based image sequence player with binary progressive loading for smooth playback." }, { "name": "typewriter", "type": "registry:component", "title": "Typewriter", "description": "A lightweight typewriter text component that cycles through phrases with minimal JavaScript." }, { "name": "spritesheet-sequencer", "type": "registry:component", "title": "Spritesheet Sequencer", "description": "A WAAPI-powered spritesheet animator for squared grid-based spritesheets with stepped frame animation." }, { "name": "magnetic", "type": "registry:component", "title": "Magnetic", "description": "A cursor-attraction wrapper that makes inner content subtly follow the mouse position." }, { "name": "scramble", "type": "registry:component", "title": "Scramble", "description": "A GSAP registered effect that decodes text with staggered character-by-character reveal animation." }, { "name": "scramble-button", "type": "registry:component", "title": "Scramble Button", "description": "A button that scrambles its text on hover using the scramble GSAP effect." }, { "name": "brick-breaker", "type": "registry:component", "title": "Brick Breaker", "description": "A fully-featured brick breaker game with multiple levels, brick types, and proper collision physics." }, { "name": "snake-game", "type": "registry:component", "title": "Snake Game", "description": "A minimal, themeable snake game component with highscore persistence." }, { "name": "space-invaders", "type": "registry:component", "title": "Space Invaders", "description": "A vertical-scrolling shoot-'em-up with enemy waves, a scaling boss (REBEL CRUSHER), pause, and highscore persistence." }, { "name": "typed-emitter", "type": "registry:lib", "title": "Typed Emitter", "description": "A thin typed wrapper around tiny-emitter that lets subclasses pin an event-map type for fully typed on/emit." }, { "name": "canvas-2d", "type": "registry:component", "title": "Canvas 2D", "description": "A DPR-aware 2D canvas component and hook that handles sizing, pixel ratio, and context setup automatically." }, { "name": "debug-canvas", "type": "registry:component", "title": "r3f Canvas", "description": "An enhanced R3F Canvas with built-in debug helpers — orbit/fly controls (mutually exclusive), grid, camera monitor, and performance stats — all toggled via a s…" }, { "name": "debug", "type": "registry:component", "title": "Debug Hooks", "description": "A tweakpane-powered debug panel with URL-persisted state, draggable UI, and reactive hooks for binding component values." }, { "name": "avatar", "type": "registry:ui", "title": "Avatar", "description": "An image element with a fallback for representing the user." }, { "name": "badge", "type": "registry:ui", "title": "Badge", "description": "Displays a badge or a component that looks like a badge." }, { "name": "button", "type": "registry:ui", "title": "Button", "description": "Displays a button or a component that looks like a button." }, { "name": "button-group", "type": "registry:ui", "title": "Button Group", "description": "Groups multiple buttons or inputs into a single visual unit." }, { "name": "card", "type": "registry:ui", "title": "Card", "description": "Displays a card with header, content, and footer." }, { "name": "chart", "type": "registry:ui", "title": "Chart", "description": "Composable charting components built on top of Recharts." }, { "name": "collapsible", "type": "registry:ui", "title": "Collapsible", "description": "An interactive component which expands/collapses a panel." }, { "name": "dropdown-menu", "type": "registry:ui", "title": "Dropdown Menu", "description": "Displays a menu to the user triggered by a button." }, { "name": "input", "type": "registry:ui", "title": "Input", "description": "Displays a form input field." }, { "name": "input-group", "type": "registry:ui", "title": "Input Group", "description": "Composable input group with addons, buttons, and textarea support." }, { "name": "kbd", "type": "registry:ui", "title": "Kbd", "description": "Displays a keyboard key or shortcut." }, { "name": "media-player", "type": "registry:ui", "title": "Media Player", "description": "A composable media player with controls, settings, captions, and PiP support." }, { "name": "mention", "type": "registry:ui", "title": "Mention", "description": "An autocomplete mention input component." }, { "name": "popover", "type": "registry:ui", "title": "Popover", "description": "Displays rich content in a portal triggered by a button." }, { "name": "select", "type": "registry:ui", "title": "Select", "description": "Displays a list of options for the user to pick from." }, { "name": "separator", "type": "registry:ui", "title": "Separator", "description": "Visually or semantically separates content." }, { "name": "slider", "type": "registry:ui", "title": "Slider", "description": "An input where the user selects a value from within a given range." }, { "name": "switch", "type": "registry:ui", "title": "Switch", "description": "A control that allows the user to toggle between checked and unchecked." }, { "name": "tabs", "type": "registry:ui", "title": "Tabs", "description": "A set of layered sections of content displayed one at a time." }, { "name": "textarea", "type": "registry:ui", "title": "Textarea", "description": "Displays a form textarea field." }, { "name": "tooltip", "type": "registry:ui", "title": "Tooltip", "description": "A popup that displays information related to an element on hover." }, { "name": "cluster", "type": "registry:ui", "title": "Cluster", "description": "A flex container with the design system gap and an optional filler for space distribution." }, { "name": "joyco-theme", "type": "registry:theme", "title": "JOYCO Theme", "description": "JOYCO brand theme with light and dark mode color tokens." }, { "name": "joyco-fonts", "type": "registry:lib", "title": "JOYCO Fonts", "description": "JOYCO brand font configuration with Public Sans and Roboto Mono." }, { "name": "utils", "type": "registry:lib", "title": "Utils", "description": "The cn class-merge helper used by every JOYCO UI component." }, { "name": "ui", "type": "registry:style", "title": "JOYCO UI", "description": "The full JOYCO UI kit — all components and brand theming." } ], "component_count": 48, "components_truncated": false, "component_types": { "registry:component": 21, "registry:lib": 3, "registry:ui": 22, "registry:theme": 1, "registry:style": 1 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 86, "name": "@kanpeki", "category": "Component library (general)", "tags": [ "dashboard", "aesthetic", "components" ], "tagline": "A set of perfect-designed components built on top of React Aria and Motion.", "short_description": "A set of perfect-designed components built on top of React Aria and Motion.", "description": "Kanpeki is a copy-paste component collection (not an npm package) built on React Aria Components and styled with Tailwind CSS, following the same ethos as shadcn/ui but replacing Radix UI with React Aria for superior accessibility. Ships 50+ components including Accordion, Autocomplete, Calendar, Chart, Combobox, Data Table, Date Picker, Dropzone, Input OTP, List Box, Pagination, Toast, and Toggle Group, plus full form-builder support and dark mode. Beta stage. Use for: projects that require WCAG-compliant, keyboard-navigable components grounded in React Aria rather than Radix, while keeping the shadcn copy-paste ownership model.", "homepage": "https://kanpeki.vercel.app", "docs": "https://kanpeki.vercel.app/docs", "github": "https://github.com/fellipeutaka/kanpeki", "components_github": null, "github_default_branch": "main", "github_stars": 33, "last_commit": "2026-03-10T05:23:12Z", "archived": false, "license": "MIT", "open_issues": 11, "registry_template": "https://kanpeki.vercel.app/r/{name}.json", "registry_index": "https://kanpeki.vercel.app/r/registry.json", "components": [ "accordion", "alert", "aspect-ratio", "autocomplete", "avatar", "badge", "breadcrumb", "button", "button-group", "calendar", "card", "carousel", "chart", "checkbox", "collapsible", "combobox", "date-field", "date-picker", "dialog", "drawer", "dropzone", "field", "form", "input", "input-group", "input-otp", "keyboard", "label", "link", "link-button", "list-box", "menu", "number-field", "pagination", "popover", "progress", "radio-group", "resizable", "scroll-area", "search-field", "select", "separator", "sheet", "sidebar", "skeleton", "slider", "spinner", "switch", "table", "tabs", "textarea", "text-field", "toast", "toggle", "toggle-group", "tooltip", "cva", "use-is-mobile", "accordion-demo", "alert-demo", "alert-destructive-demo", "alert-warning-demo", "aspect-ratio-demo", "aspect-ratio-square", "aspect-ratio-portrait", "autocomplete-demo", "autocomplete-dialog-demo", "avatar-demo", "avatar-group-demo", "badge-demo", "badge-destructive-demo", "badge-outline-demo", "badge-secondary-demo", "breadcrumb-collapsed-demo", "breadcrumb-custom-separator-demo", "breadcrumb-demo", "breadcrumb-dropdown-demo", "button-demo", "button-icon-demo", "button-sizes-demo", "button-variants-demo", "button-group-demo", "button-group-orientation-demo", "button-group-size-demo", "button-group-nested-demo", "button-group-separator-demo", "button-group-split-demo", "button-group-input-demo", "button-group-input-group-demo", "button-group-dropdown-demo", "button-group-select-demo", "button-group-popover-demo", "calendar-demo", "calendar-range-demo", "card-demo", "carousel-demo", "carousel-size-demo", "carousel-spacing-demo", "carousel-orientation-demo", "carousel-api-demo" ], "component_items": [ { "name": "accordion", "type": "registry:ui", "title": null, "description": null }, { "name": "alert", "type": "registry:ui", "title": null, "description": null }, { "name": "aspect-ratio", "type": "registry:ui", "title": null, "description": null }, { "name": "autocomplete", "type": "registry:ui", "title": null, "description": null }, { "name": "avatar", "type": "registry:ui", "title": null, "description": null }, { "name": "badge", "type": "registry:ui", "title": null, "description": null }, { "name": "breadcrumb", "type": "registry:ui", "title": null, "description": null }, { "name": "button", "type": "registry:ui", "title": null, "description": null }, { "name": "button-group", "type": "registry:ui", "title": null, "description": null }, { "name": "calendar", "type": "registry:ui", "title": null, "description": null }, { "name": "card", "type": "registry:ui", "title": null, "description": null }, { "name": "carousel", "type": "registry:ui", "title": null, "description": null }, { "name": "chart", "type": "registry:ui", "title": null, "description": null }, { "name": "checkbox", "type": "registry:ui", "title": null, "description": null }, { "name": "collapsible", "type": "registry:ui", "title": null, "description": null }, { "name": "combobox", "type": "registry:ui", "title": null, "description": null }, { "name": "date-field", "type": "registry:ui", "title": null, "description": null }, { "name": "date-picker", "type": "registry:ui", "title": null, "description": null }, { "name": "dialog", "type": "registry:ui", "title": null, "description": null }, { "name": "drawer", "type": "registry:ui", "title": null, "description": null }, { "name": "dropzone", "type": "registry:ui", "title": null, "description": null }, { "name": "field", "type": "registry:ui", "title": null, "description": null }, { "name": "form", "type": "registry:ui", "title": null, "description": null }, { "name": "input", "type": "registry:ui", "title": null, "description": null }, { "name": "input-group", "type": "registry:ui", "title": null, "description": null }, { "name": "input-otp", "type": "registry:ui", "title": null, "description": null }, { "name": "keyboard", "type": "registry:ui", "title": null, "description": null }, { "name": "label", "type": "registry:ui", "title": null, "description": null }, { "name": "link", "type": "registry:ui", "title": null, "description": null }, { "name": "link-button", "type": "registry:ui", "title": null, "description": null }, { "name": "list-box", "type": "registry:ui", "title": null, "description": null }, { "name": "menu", "type": "registry:ui", "title": null, "description": null }, { "name": "number-field", "type": "registry:ui", "title": null, "description": null }, { "name": "pagination", "type": "registry:ui", "title": null, "description": null }, { "name": "popover", "type": "registry:ui", "title": null, "description": null }, { "name": "progress", "type": "registry:ui", "title": null, "description": null }, { "name": "radio-group", "type": "registry:ui", "title": null, "description": null }, { "name": "resizable", "type": "registry:ui", "title": null, "description": null }, { "name": "scroll-area", "type": "registry:ui", "title": null, "description": null }, { "name": "search-field", "type": "registry:ui", "title": null, "description": null }, { "name": "select", "type": "registry:ui", "title": null, "description": null }, { "name": "separator", "type": "registry:ui", "title": null, "description": null }, { "name": "sheet", "type": "registry:ui", "title": null, "description": null }, { "name": "sidebar", "type": "registry:ui", "title": null, "description": null }, { "name": "skeleton", "type": "registry:ui", "title": null, "description": null }, { "name": "slider", "type": "registry:ui", "title": null, "description": null }, { "name": "spinner", "type": "registry:ui", "title": null, "description": null }, { "name": "switch", "type": "registry:ui", "title": null, "description": null }, { "name": "table", "type": "registry:ui", "title": null, "description": null }, { "name": "tabs", "type": "registry:ui", "title": null, "description": null }, { "name": "textarea", "type": "registry:ui", "title": null, "description": null }, { "name": "text-field", "type": "registry:ui", "title": null, "description": null }, { "name": "toast", "type": "registry:ui", "title": null, "description": null }, { "name": "toggle", "type": "registry:ui", "title": null, "description": null }, { "name": "toggle-group", "type": "registry:ui", "title": null, "description": null }, { "name": "tooltip", "type": "registry:ui", "title": null, "description": null }, { "name": "cva", "type": "registry:lib", "title": null, "description": null }, { "name": "use-is-mobile", "type": "registry:hook", "title": null, "description": null }, { "name": "accordion-demo", "type": "registry:example", "title": null, "description": null }, { "name": "alert-demo", "type": "registry:example", "title": null, "description": null } ], "component_count": 260, "components_truncated": true, "component_types": { "registry:ui": 56, "registry:lib": 1, "registry:hook": 1, "registry:example": 201, "registry:item": 1 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 87, "name": "@kapwa", "category": "Design system", "tags": [ "components" ], "tagline": "Cleanly designed components purposely built for open-source government portals.", "short_description": "Cleanly designed components purposely built for open-source government portals.", "description": "Kapwa is BetterGov Philippines' design system for public digital services, built with VitePress for documentation and Storybook for the component reference. Rooted in the Filipino value of shared selfhood (kapwa), it targets clarity, consistency, and public trust for government portals. Stack includes Tailwind CSS with a structured design-token architecture. Components are browsed via Storybook (separate from the docs site). Entirely open source and specific to the Philippine government digital-service context. Use for: building or extending government-facing Philippine web products that must conform to this official design language.", "homepage": "https://kapwa-two.vercel.app", "docs": "https://kapwa-two.vercel.app", "github": "https://github.com/bettergovph/kapwa", "components_github": null, "github_default_branch": "main", "github_stars": 19, "last_commit": "2026-06-02T06:01:56Z", "archived": false, "license": "CC0-1.0", "open_issues": 12, "registry_template": "https://kapwa-two.vercel.app/r/{name}.json", "registry_index": "https://kapwa-two.vercel.app/r/registry.json", "components": [ "article", "civic-tech-banner", "list", "strip-banner", "table", "tables", "articles", "banners", "biography", "official-biography", "lists" ], "component_items": [ { "name": "article", "type": "registry:component", "title": "Article", "description": "Article card and content components for displaying news, blog posts, and long-form content." }, { "name": "civic-tech-banner", "type": "registry:component", "title": "Civic Tech Banner", "description": "Full-width banner for civic tech campaigns and community engagement with gradient background and call-to-action buttons." }, { "name": "list", "type": "registry:component", "title": "List", "description": "List component for displaying categorized items with optional action links. Perfect for service directories, document lists, and search results." }, { "name": "strip-banner", "type": "registry:component", "title": "Strip Banner", "description": "Compact notification banner for urgent announcements, alerts, and time-sensitive information. Features emoji support and dual action buttons." }, { "name": "table", "type": "registry:component", "title": "Table", "description": "Data table component with status badges, hover states, and action buttons. Perfect for user management, application tracking, and directory listings." }, { "name": "tables", "type": "registry:block", "title": "Tables Section", "description": "A section showcasing table styles for data presentation." }, { "name": "articles", "type": "registry:block", "title": "Articles Section", "description": "A section showcasing article cards and content styles." }, { "name": "banners", "type": "registry:block", "title": "Banners Section", "description": "A section showcasing banner and call-to-action components for community engagement." }, { "name": "biography", "type": "registry:block", "title": "Biography Section", "description": "A section showcasing government official profile and official biography layout." }, { "name": "official-biography", "type": "registry:component", "title": "Official Biography", "description": "A component showcasing government official profile and official biography layout." }, { "name": "lists", "type": "registry:block", "title": "Lists Section", "description": "A section showcasing different list styles and search results." } ], "component_count": 11, "components_truncated": false, "component_types": { "registry:component": 6, "registry:block": 5 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 88, "name": "@kibo-ui", "category": "Component library (general)", "tags": [ "ai", "components" ], "tagline": "Kibo UI is a custom registry of composable, accessible and open source components designed for use with shadcn/ui.", "short_description": "Kibo UI is a custom registry of composable, accessible and open source components designed for use with shadcn/ui.", "description": "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.", "homepage": "https://www.kibo-ui.com/", "docs": "https://www.kibo-ui.com/docs", "github": "https://github.com/haydenbleasel/kibo", "components_github": null, "github_default_branch": "main", "github_stars": 3851, "last_commit": "2026-05-04T06:00:08Z", "archived": false, "license": "MIT", "open_issues": 33, "registry_template": "https://www.kibo-ui.com/r/{name}.json", "registry_index": "https://www.kibo-ui.com/r/registry.json", "components": [ "announcement", "avatar-stack", "banner", "calendar", "choicebox", "code-block", "color-picker", "combobox", "comparison", "contribution-graph", "credit-card", "cursor", "deck", "dialog-stack", "dropzone", "editor", "gantt", "glimpse", "image-crop", "image-zoom", "kanban", "list", "marquee", "mini-calendar", "pill", "qr-code", "rating", "reel", "relative-time", "sandbox", "snippet", "spinner", "status", "stories", "table", "tags", "theme-switcher", "ticker", "tree", "typography", "video-player" ], "component_items": [ { "name": "announcement", "type": "registry:ui", "title": "announcement", "description": "A compound badge designed to display an announcement." }, { "name": "avatar-stack", "type": "registry:ui", "title": "avatar-stack", "description": "Avatar Stack is a component that allows you to stack and overlap avatars." }, { "name": "banner", "type": "registry:ui", "title": "banner", "description": "A banner is a full-width component that can be used to show a message and action to the user." }, { "name": "calendar", "type": "registry:ui", "title": "calendar", "description": "The calendar view displays features on a grid calendar. Specifically it shows the end date of each feature, and groups features by day." }, { "name": "choicebox", "type": "registry:ui", "title": "choicebox", "description": "Choiceboxes are a great way to show radio or checkbox options with a card style." }, { "name": "code-block", "type": "registry:ui", "title": "code-block", "description": "Provides syntax highlighting, line numbers, and copy to clipboard functionality for code blocks." }, { "name": "color-picker", "type": "registry:ui", "title": "color-picker", "description": "Allows users to select a color. Modeled after the color picker in Figma." }, { "name": "combobox", "type": "registry:ui", "title": "combobox", "description": "Autocomplete input and command palette with a list of suggestions." }, { "name": "comparison", "type": "registry:ui", "title": "comparison", "description": "A slider-based component for comparing two items in an overlay." }, { "name": "contribution-graph", "type": "registry:ui", "title": "contribution-graph", "description": "A GitHub-style contribution graph component that displays activity levels over time." }, { "name": "credit-card", "type": "registry:ui", "title": "credit-card", "description": "Credit card components for displaying and validating credit card information." }, { "name": "cursor", "type": "registry:ui", "title": "cursor", "description": "A cursor component, great for realtime interactive applications." }, { "name": "deck", "type": "registry:ui", "title": "deck", "description": "A Tinder-like swipeable card stack component with smooth animations." }, { "name": "dialog-stack", "type": "registry:ui", "title": "dialog-stack", "description": "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…" }, { "name": "dropzone", "type": "registry:ui", "title": "dropzone", "description": "Allows users to drag-and-drop files into a container to upload or process them." }, { "name": "editor", "type": "registry:ui", "title": "editor", "description": "The Editor component is a powerful and flexible text editor that allows you to create and edit rich text content." }, { "name": "gantt", "type": "registry:ui", "title": "gantt", "description": "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…" }, { "name": "glimpse", "type": "registry:ui", "title": "glimpse", "description": "A component that shows a preview of a URL when hovering over a link." }, { "name": "image-crop", "type": "registry:ui", "title": "image-crop", "description": "Helps you crop images to a specific size or aspect ratio." }, { "name": "image-zoom", "type": "registry:ui", "title": "image-zoom", "description": "Image zoom is a component that allows you to zoom in on an image." }, { "name": "kanban", "type": "registry:ui", "title": "kanban", "description": "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\",…" }, { "name": "list", "type": "registry:ui", "title": "list", "description": "List views are a great way to show a list of tasks grouped by status and ranked by priority." }, { "name": "marquee", "type": "registry:ui", "title": "marquee", "description": "Marquees are a great way to show a list of items in a horizontal scrolling motion." }, { "name": "mini-calendar", "type": "registry:ui", "title": "mini-calendar", "description": "A composable mini calendar component for picking dates close to today." }, { "name": "pill", "type": "registry:ui", "title": "pill", "description": "A flexible badge component designed for a variety of use cases." }, { "name": "qr-code", "type": "registry:ui", "title": "qr-code", "description": "QR Code is a component that generates a QR code from a string." }, { "name": "rating", "type": "registry:ui", "title": "rating", "description": "A star rating component with keyboard navigation and hover effects." }, { "name": "reel", "type": "registry:ui", "title": "reel", "description": "A composable Reel component that looks like Instagram Stories - a full-height, 9:16 aspect ratio container with video playback and progress indicators." }, { "name": "relative-time", "type": "registry:ui", "title": "relative-time", "description": "A component that displays time in various timezones." }, { "name": "sandbox", "type": "registry:ui", "title": "sandbox", "description": "The sandbox component allows you to preview and test components in a sandboxed environment." }, { "name": "snippet", "type": "registry:ui", "title": "snippet", "description": "Snippet is a component that allows you to display and copy code in a tabbed interface." }, { "name": "spinner", "type": "registry:ui", "title": "spinner", "description": "A spinner is a visual indicator that shows progress or activity." }, { "name": "status", "type": "registry:ui", "title": "status", "description": "Status components are used to display the uptime of a service." }, { "name": "stories", "type": "registry:ui", "title": "stories", "description": "A composable Stories component - a carousel of individual video cards like you'd see on Facebook." }, { "name": "table", "type": "registry:ui", "title": "table", "description": "Table views are used to display data in a tabular format. They are useful for displaying large amounts of data in a structured way." }, { "name": "tags", "type": "registry:ui", "title": "tags", "description": "Tags are a way to apply multiple labels to an item." }, { "name": "theme-switcher", "type": "registry:ui", "title": "theme-switcher", "description": "A component to switch between light, dark and system theme." }, { "name": "ticker", "type": "registry:ui", "title": "ticker", "description": "A composable finance ticker for displaying symbols, prices and changes." }, { "name": "tree", "type": "registry:ui", "title": "tree", "description": "A composable tree component with animated expand/collapse and customizable nodes." }, { "name": "typography", "type": "registry:style", "title": "typography", "description": "A typography component designed to display text with a consistent style." }, { "name": "video-player", "type": "registry:ui", "title": "video-player", "description": "A composable, shadcn/ui styled video player component that uses the media-chrome library." } ], "component_count": 41, "components_truncated": false, "component_types": { "registry:ui": 40, "registry:style": 1 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 89, "name": "@kokonutui", "category": "Animated components", "tags": [ "saas", "ai", "aesthetic" ], "tagline": "Collection of stunning components built with Tailwind CSS, shadcn/ui and Motion to use on your websites.", "short_description": "Collection of stunning components built with Tailwind CSS, shadcn/ui and Motion to use on your websites.", "description": "Kokonut UI is an open-source collection of 100+ animated React components and 8+ templates built with Tailwind CSS, shadcn/ui, and Motion (framer-motion). Categories include Backgrounds (Beams, Paths, Shapes, Flow Field), Cards (Flip, Stack, Liquid Glass, Apple Activity, Mouse Effect, Bento Grid), Navigations (Morphic Navbar, Smooth Tabs, Action Search Bar), AI Inputs, loaders, text effects (Matrix, Glitch, Shimmer, Swoosh), and animated Buttons. A Kokonut UI Pro tier adds 70+ premium components and templates. Sponsored by Vercel OSS Program. Use for: injecting polished, motion-forward UI elements into SaaS or marketing sites that need standout visual effects beyond default shadcn components.", "homepage": "https://kokonutui.com", "docs": "https://kokonutui.com/docs", "github": "https://github.com/kokonut-labs/kokonutui", "components_github": "https://github.com/kokonut-labs/kokonutui/tree/main/registry", "github_default_branch": "main", "github_stars": 1908, "last_commit": "2026-05-22T06:57:42Z", "archived": false, "license": "MIT", "open_issues": 1, "registry_template": "https://kokonutui.com/r/{name}.json", "registry_index": "https://kokonutui.com/r/registry.json", "components": [ "ai-prompt", "command-button", "card-flip", "smooth-drawer", "shape-hero", "ai-text-loading", "shimmer-text", "carousel-cards", "file-upload", "action-search-bar", "ai-input-search", "currency-transfer", "background-paths", "beams-background", "apple-activity-card", "ai-voice", "smooth-tab", "team-selector", "switch-button", "bento-grid", "social-button", "hold-button", "attract-button", "gradient-button", "v0-button", "toolbar", "ai-loading", "card-stack", "avatar-picker", "type-writer", "swoosh-text", "sliced-text", "glitch-text", "matrix-text", "dynamic-text", "particle-button", "tweet-card", "scroll-text", "liquid-glass-card", "profile-dropdown" ], "component_items": [ { "name": "ai-prompt", "type": "registry:component", "title": "AI Input Selector", "description": "My own style of chat AI input." }, { "name": "command-button", "type": "registry:component", "title": "Command Button", "description": "Command button for shortcut." }, { "name": "card-flip", "type": "registry:component", "title": "Card Flip", "description": "Animated flip card with gradient button and animation." }, { "name": "smooth-drawer", "type": "registry:component", "title": "Smooth Drawer", "description": "Smooth slide-in drawer. (this was harder than i thought to make that one)" }, { "name": "shape-hero", "type": "registry:component", "title": "Shapes Hero", "description": "Shapes that fall from the top." }, { "name": "ai-text-loading", "type": "registry:component", "title": "AI Text Loading", "description": "Thinking mode." }, { "name": "shimmer-text", "type": "registry:component", "title": "Shimmer Text", "description": "Quite fancy." }, { "name": "carousel-cards", "type": "registry:component", "title": "Carousel Cards", "description": "Interactive carousel with card navigation." }, { "name": "file-upload", "type": "registry:component", "title": "File Upload", "description": "File upload with special uploading animation. Make sure to try the drag and drop." }, { "name": "action-search-bar", "type": "registry:component", "title": "Action Search Bar", "description": "Action Bar with shortcuts, and smooth dropdown animation." }, { "name": "ai-input-search", "type": "registry:component", "title": "AI Input Search", "description": "AI input with search mode." }, { "name": "currency-transfer", "type": "registry:component", "title": "Currency Transfer", "description": "Multiples step animation transaction inspired." }, { "name": "background-paths", "type": "registry:component", "title": "Background Paths", "description": "Drawed line paths in the middle." }, { "name": "beams-background", "type": "registry:component", "title": "Beams Background", "description": "Animated Beams in the background that are customizable." }, { "name": "apple-activity-card", "type": "registry:component", "title": "Apple Activity Card", "description": "Inspired by Apple activity app." }, { "name": "ai-voice", "type": "registry:component", "title": "AI Voice", "description": "Voice mode." }, { "name": "smooth-tab", "type": "registry:component", "title": "Smooth Tab", "description": "Animated tab switcher." }, { "name": "team-selector", "type": "registry:component", "title": "Team Selector", "description": "Group selector with a different style." }, { "name": "switch-button", "type": "registry:component", "title": "Switch Button", "description": "Animated shadow theme switcher button." }, { "name": "bento-grid", "type": "registry:component", "title": "Bento Grid", "description": "Grid of 4 cards with different content and animations." }, { "name": "social-button", "type": "registry:component", "title": "Social Button", "description": "Animated Social show-up" }, { "name": "hold-button", "type": "registry:component", "title": "Hold Button", "description": "Hold Button with different hold duration and colors." }, { "name": "attract-button", "type": "registry:component", "title": "Magnet Button", "description": "Attract particles button!" }, { "name": "gradient-button", "type": "registry:component", "title": "Gradient Button", "description": "That was so hard to make." }, { "name": "v0-button", "type": "registry:component", "title": "V0 Button", "description": "Open in V0." }, { "name": "toolbar", "type": "registry:component", "title": "Toolbar", "description": "Multiples actions toolbar inspired by Figma." }, { "name": "ai-loading", "type": "registry:component", "title": "AI State Loading", "description": "Code loading pending." }, { "name": "card-stack", "type": "registry:component", "title": "Stack", "description": "Stack of cards that expend onclick." }, { "name": "avatar-picker", "type": "registry:component", "title": "Avatar Picker", "description": "Avatar picker with rotation animation." }, { "name": "type-writer", "type": "registry:component", "title": "Typing Text", "description": "Animated TypeWritter with multiples options." }, { "name": "swoosh-text", "type": "registry:component", "title": "Swoosh Text", "description": "Nike inspired Text" }, { "name": "sliced-text", "type": "registry:component", "title": "Sliced Text", "description": "I haven't found any usage for that component, but i like it." }, { "name": "glitch-text", "type": "registry:component", "title": "Glitch Text", "description": "Why not?" }, { "name": "matrix-text", "type": "registry:component", "title": "Matrix Text", "description": "010110010110111101110101011100100010000001110111011001010110110001100011011011110110110101100101" }, { "name": "dynamic-text", "type": "registry:component", "title": "Dynamic Text", "description": "Dynamic switcher text." }, { "name": "particle-button", "type": "registry:component", "title": "Particle Button", "description": "Particle Button Animation on click." }, { "name": "tweet-card", "type": "registry:component", "title": "X Card", "description": "Gradient on hover X card. (The post is real!)" }, { "name": "scroll-text", "type": "registry:component", "title": "Scroll Text", "description": "Animated on scroll texts." }, { "name": "liquid-glass-card", "type": "registry:component", "title": "Liquid Glass", "description": "Liquid Glass inspired by @Apple" }, { "name": "profile-dropdown", "type": "registry:component", "title": "Profile Dropdown", "description": "Menu dropdown with action buttons." } ], "component_count": 40, "components_truncated": false, "component_types": { "registry:component": 40 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 90, "name": "@launchui", "category": "Blocks & sections (marketing/SaaS)", "tags": [ "saas" ], "tagline": "Carefully crafted landing page components and templates built with React, Shadcn/ui and Tailwind.", "short_description": "Carefully crafted landing page components and templates built with React, Shadcn/ui and Tailwind.", "description": "Launch UI is a landing-page-focused block and template library built with React 19, shadcn/ui, and Tailwind CSS, versioned at v2.9. Blocks cover every section a marketing site needs: Hero (multiple variants), Top Navbar, Bento Grid, Carousel, FAQ, Feature, Gallery, Items, Logos, Pricing, Social Proof, Stats, Tabs, Testimonials, CTA, and Footer. Supports multiple color themes (ember, fire, ultraviolet, titanium, ice, holo, emerald, electro) and border-radius tokens. Includes Illustrations and full-page Templates. Free and open source, with an optional paid course. Use for: rapidly assembling polished, on-brand SaaS or product landing pages without designing every section from scratch.", "homepage": "https://www.launchuicomponents.com/", "docs": "https://www.launchuicomponents.com/docs/getting-started/introduction", "github": "https://github.com/launch-ui/launch-ui", "components_github": "https://github.com/launch-ui/launch-ui/tree/main/components", "github_default_branch": "main", "github_stars": 807, "last_commit": "2026-06-24T14:23:15Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://www.launchuicomponents.com/r/{name}.json", "registry_index": "https://www.launchuicomponents.com/r/registry.json", "components": [ "launchui", "navbar", "hero", "items", "logos", "bento-grid", "feature", "tabs", "social-proof", "testimonials", "faq", "cta", "carousel", "stats", "pricing", "footer", "gallery", "pro", "button", "badge", "card", "screenshot", "mockup", "glow" ], "component_items": [ { "name": "launchui", "type": "registry:ui", "title": "Launch UI Base", "description": "Base styles, CSS utilities, and configuration for Launch UI components." }, { "name": "navbar", "type": "registry:block", "title": "Navbar", "description": "A responsive navigation bar with mobile menu support and customizable links." }, { "name": "hero", "type": "registry:block", "title": "Hero Section", "description": "A hero section with badge, title, description, CTA buttons, and mockup display." }, { "name": "items", "type": "registry:block", "title": "Items Section", "description": "A grid of items with icons and descriptions, perfect for features or benefits." }, { "name": "logos", "type": "registry:block", "title": "Logos Section", "description": "A logo cloud section to showcase partners, clients, or technologies." }, { "name": "bento-grid", "type": "registry:block", "title": "Bento Grid", "description": "A bento-style grid layout for showcasing features or content blocks." }, { "name": "feature", "type": "registry:block", "title": "Feature Section", "description": "Feature sections with various layouts for highlighting product capabilities." }, { "name": "tabs", "type": "registry:block", "title": "Tabs Section", "description": "Tabbed content sections for organizing information." }, { "name": "social-proof", "type": "registry:block", "title": "Social Proof", "description": "Social proof sections with testimonials, ratings, and trust badges." }, { "name": "testimonials", "type": "registry:block", "title": "Testimonials", "description": "Customer testimonial sections with carousel and grid layouts." }, { "name": "faq", "type": "registry:block", "title": "FAQ Section", "description": "Frequently asked questions section with accordion functionality." }, { "name": "cta", "type": "registry:block", "title": "CTA Section", "description": "Call-to-action sections with various styles and glow effects." }, { "name": "carousel", "type": "registry:block", "title": "Carousel", "description": "Image and content carousels with multiple display options." }, { "name": "stats", "type": "registry:block", "title": "Stats Section", "description": "Statistics display section for showcasing numbers and metrics." }, { "name": "pricing", "type": "registry:block", "title": "Pricing Section", "description": "Pricing tables and cards with feature comparisons." }, { "name": "footer", "type": "registry:block", "title": "Footer", "description": "Website footer with navigation links, social icons, and theme toggle." }, { "name": "gallery", "type": "registry:block", "title": "Gallery", "description": "Image gallery sections with grid and masonry layouts." }, { "name": "pro", "type": "registry:ui", "title": "Pro Dependencies", "description": "All dependencies required for Launch UI Pro components." }, { "name": "button", "type": "registry:ui", "title": "Button", "description": "A customizable button component with multiple variants and sizes." }, { "name": "badge", "type": "registry:ui", "title": "Badge", "description": "A badge component for labels, tags, and status indicators." }, { "name": "card", "type": "registry:ui", "title": "Card", "description": "A card component for containing related content." }, { "name": "screenshot", "type": "registry:ui", "title": "Screenshot", "description": "A theme-aware screenshot component that switches between light and dark images." }, { "name": "mockup", "type": "registry:ui", "title": "Mockup", "description": "Device mockup frames for showcasing app screenshots." }, { "name": "glow", "type": "registry:ui", "title": "Glow", "description": "Decorative glow effects for adding visual interest." } ], "component_count": 24, "components_truncated": false, "component_types": { "registry:ui": 8, "registry:block": 16 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 91, "name": "@lens-blocks", "category": "Crypto/web3", "tags": [ "components" ], "tagline": "A collection of social media components for use with Lens Social Protocol.", "short_description": "A collection of social media components for use with Lens Social Protocol.", "description": "Lens Blocks is a beta shadcn/ui registry of social UI components built for the Lens Social Protocol, integrating the official Lens React SDK with wagmi and ConnectKit. Blocks include Account Chooser, Account Hover Card, Collect Post Dialog, Login, Post, Quote Post Dialog, Tip Dialog; components include Account List Item, Audio Player, Follow Button, Link Preview, Login Button, Markdown renderer, Paginated List, Text Editor, and Video Player. Hooks cover authenticated account, login with Viem, reaction toggle, tip actions, and post context. Handles wallet connection, signing, session lifecycle, and optimistic updates out of the box. Use for: building decentralized social features on Lens Protocol without hand-rolling wallet auth and SDK wiring.", "homepage": "https://lensblocks.com", "docs": "https://lensblocks.com", "github": "https://github.com/iPaulPro/lens-blocks", "components_github": "https://github.com/iPaulPro/lens-blocks/tree/main/registry", "github_default_branch": "main", "github_stars": 6, "last_commit": "2025-12-07T03:12:02Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://lensblocks.com/r/{name}.json", "registry_index": "https://lensblocks.com/r/registry.json", "components": [ "paginated-list", "login-button", "utils", "use-authenticated-account", "use-login-with-viem", "use-reaction-toggle", "use-tip-post-action", "use-tip-account-action", "use-post-context", "post-provider", "account-chooser", "account-list-item", "audio-player", "video-player", "text-editor", "follow-button", "account-hover-card", "login", "lens-markdown", "tip-dialog", "quote-dialog", "collect-dialog", "link-preview", "post" ], "component_items": [ { "name": "paginated-list", "type": "registry:component", "title": "Paginated List", "description": "A reusable paginated list component that fetches and displays items in pages, with support for loading states and end-of-list indicators, based on Paginated an…" }, { "name": "login-button", "type": "registry:component", "title": "Lens Login Button", "description": "A button component to initiate the Lens login flow, displaying the lens icon and a call to action." }, { "name": "utils", "type": "registry:lib", "title": "Lens Utilities", "description": "Utility functions for interacting with Lens Social Protocol, including formatting and data manipulation." }, { "name": "use-authenticated-account", "type": "registry:hook", "title": "Use Authenticated Lens Account", "description": "A hook to get the currently authenticated Lens account using the Lens React SDK." }, { "name": "use-login-with-viem", "type": "registry:hook", "title": "Use Lens Login with Viem", "description": "A hook to execute login with the Lens React SDK using the Viem library for wallet interaction." }, { "name": "use-reaction-toggle", "type": "registry:hook", "title": "Use Reaction Toggle", "description": "A hook to toggle reactions (like/unlike) on Lens posts using the Lens React SDK." }, { "name": "use-tip-post-action", "type": "registry:hook", "title": "Use Tip Post Action", "description": "A hook for tipping Lens Posts using the Lens React SDK." }, { "name": "use-tip-account-action", "type": "registry:hook", "title": "Use Tip Account Action", "description": "A hook for tipping Lens Accounts using the Lens React SDK." }, { "name": "use-post-context", "type": "registry:hook", "title": "Use Lens Post Context", "description": "A hook for state, queries, and operations in a shared Lens post context" }, { "name": "post-provider", "type": "registry:lib", "title": "Lens Post Provider", "description": "A provider of a shared Lens post context for state, queries, and operations." }, { "name": "account-chooser", "type": "registry:block", "title": "Lens Account Chooser", "description": "A list of available Lens accounts for the user to choose from, with support for pagination." }, { "name": "account-list-item", "type": "registry:component", "title": "Lens Account List Item", "description": "A list item for a Lens account displaying the avatar, name, and handle." }, { "name": "audio-player", "type": "registry:component", "title": "Lens Audio Player", "description": "An audio player component for playing audio attachments in Lens posts." }, { "name": "video-player", "type": "registry:component", "title": "Lens Video Player", "description": "An video player component for playing video attachments in Lens posts." }, { "name": "text-editor", "type": "registry:component", "title": "Lens Text Editor", "description": "A rich text editor component for composing Lens posts using TipTap, with support for mentions." }, { "name": "follow-button", "type": "registry:component", "title": "Lens Follow Button", "description": "A button component to follow or unfollow a Lens Account, displaying the current follow state." }, { "name": "account-hover-card", "type": "registry:block", "title": "Lens Account Hover Card", "description": "A hover card that displays Lens account details when hovering over an account name or handle." }, { "name": "login", "type": "registry:block", "title": "Lens Login", "description": "A full-featured login flow for Lens Social Protocol that hooks into the Lens React SDK, uses ConnectKit for wallet connections, supports account switching and …" }, { "name": "lens-markdown", "type": "registry:component", "title": "Lens Markdown", "description": "A Markdown renderer for Lens posts and comments, supporting mentions, links, and rich text formatting." }, { "name": "tip-dialog", "type": "registry:block", "title": "Lens Tip Dialog", "description": "A dialog component for sending tips to Lens Posts and Accounts, with support for multiple tokens and payment sources." }, { "name": "quote-dialog", "type": "registry:block", "title": "Lens Quote Post Dialog", "description": "A dialog component for quoting Lens Posts, allowing users to add their own commentary while sharing the original post." }, { "name": "collect-dialog", "type": "registry:block", "title": "Lens Collect Post Dialog", "description": "A dialog component for collecting Lens Posts with support for paid collects." }, { "name": "link-preview", "type": "registry:component", "title": "Link Preview", "description": "A component to display a link preview for URLs included in Lens posts, showing the title, description, and image." }, { "name": "post", "type": "registry:block", "title": "Lens Post", "description": "Displays a post from Lens Social Protocol, including the content, author, attachments, and engagement actions." } ], "component_count": 24, "components_truncated": false, "component_types": { "registry:component": 9, "registry:lib": 2, "registry:hook": 6, "registry:block": 7 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 92, "name": "@limeplay", "category": "Niche/single-purpose", "tags": [ "components" ], "tagline": "Modern UI Library for building media players in React. Powered by Shaka Player.", "short_description": "Modern UI Library for building media players in React. Powered by Shaka Player.", "description": "Limeplay is an open-source React UI library for building custom video player interfaces, powered by Shaka Player (Google's adaptive-streaming engine) and distributed as a shadcn/ui-style copy-paste registry. Components cover the full player shell: Controls, Progress/Timeline, Playback, Track selector, Volume, Caption, and more. Designed to replace heavy black-box video player SDKs with composable, Tailwind-styled primitives you own. Install via npx shadcn add @limeplay/video-player. Use for: React projects that need a fully customizable HLS/DASH video player UI that integrates naturally with an existing shadcn/ui design system.", "homepage": "https://limeplay.winoffrg.dev", "docs": "https://limeplay.winoffrg.dev/docs", "github": "https://github.com/winoffrg/limeplay", "components_github": null, "github_default_branch": "main", "github_stars": 276, "last_commit": "2026-07-04T19:40:10Z", "archived": false, "license": "MIT", "open_issues": 2, "registry_template": "https://limeplay.winoffrg.dev/r/{name}.json", "registry_index": "https://limeplay.winoffrg.dev/r/registry.json", "components": [ "index", "error-screen", "fallback-poster", "mute-control", "media-provider", "player-layout", "media", "volume-control", "playback-control", "picture-in-picture-control", "playback-rate", "timeline-labels", "timeline-control", "limeplay-logo", "root-container", "captions", "seek-controls", "video-player", "audio-player", "utils", "time", "use-media", "use-volume", "use-controls-visibility", "use-track-events", "use-timeline", "use-player", "use-asset", "use-playback-source", "use-interval", "use-captions", "use-playback-rate", "use-seek", "use-playlist", "use-playback", "use-picture-in-picture", "use-idle", "custom-demo-controls", "internal-media", "error-screen-demo", "fallback-poster-demo", "playback-state-control-demo", "picture-in-picture-control-demo", "volume-slider-control-horizontal-demo", "volume-slider-control-vertical-demo", "volume-state-control-demo", "timeline-control-demo", "timeline-labels-demo", "captions-state-control-demo", "playback-rate-demo", "seek-control-demo" ], "component_items": [ { "name": "index", "type": "registry:style", "title": null, "description": null }, { "name": "error-screen", "type": "registry:ui", "title": null, "description": null }, { "name": "fallback-poster", "type": "registry:ui", "title": null, "description": null }, { "name": "mute-control", "type": "registry:ui", "title": null, "description": null }, { "name": "media-provider", "type": "registry:ui", "title": null, "description": null }, { "name": "player-layout", "type": "registry:ui", "title": null, "description": null }, { "name": "media", "type": "registry:ui", "title": null, "description": null }, { "name": "volume-control", "type": "registry:ui", "title": null, "description": null }, { "name": "playback-control", "type": "registry:ui", "title": null, "description": null }, { "name": "picture-in-picture-control", "type": "registry:ui", "title": null, "description": null }, { "name": "playback-rate", "type": "registry:ui", "title": null, "description": null }, { "name": "timeline-labels", "type": "registry:ui", "title": null, "description": null }, { "name": "timeline-control", "type": "registry:ui", "title": null, "description": null }, { "name": "limeplay-logo", "type": "registry:ui", "title": null, "description": null }, { "name": "root-container", "type": "registry:ui", "title": null, "description": null }, { "name": "captions", "type": "registry:ui", "title": null, "description": null }, { "name": "seek-controls", "type": "registry:ui", "title": null, "description": null }, { "name": "video-player", "type": "registry:block", "title": null, "description": "Modern seamless flat video player" }, { "name": "audio-player", "type": "registry:block", "title": "Audio Player", "description": "Compact audio player with playlist support" }, { "name": "utils", "type": "registry:lib", "title": null, "description": null }, { "name": "time", "type": "registry:lib", "title": null, "description": null }, { "name": "use-media", "type": "registry:hook", "title": null, "description": null }, { "name": "use-volume", "type": "registry:hook", "title": null, "description": null }, { "name": "use-controls-visibility", "type": "registry:hook", "title": null, "description": null }, { "name": "use-track-events", "type": "registry:hook", "title": null, "description": null }, { "name": "use-timeline", "type": "registry:hook", "title": null, "description": null }, { "name": "use-player", "type": "registry:hook", "title": null, "description": null }, { "name": "use-asset", "type": "registry:hook", "title": null, "description": null }, { "name": "use-playback-source", "type": "registry:hook", "title": null, "description": null }, { "name": "use-interval", "type": "registry:hook", "title": null, "description": null }, { "name": "use-captions", "type": "registry:hook", "title": null, "description": null }, { "name": "use-playback-rate", "type": "registry:hook", "title": null, "description": null }, { "name": "use-seek", "type": "registry:hook", "title": null, "description": null }, { "name": "use-playlist", "type": "registry:hook", "title": null, "description": null }, { "name": "use-playback", "type": "registry:hook", "title": null, "description": null }, { "name": "use-picture-in-picture", "type": "registry:hook", "title": null, "description": null }, { "name": "use-idle", "type": "registry:hook", "title": null, "description": null }, { "name": "custom-demo-controls", "type": "registry:ui", "title": null, "description": null }, { "name": "internal-media", "type": "registry:lib", "title": null, "description": null }, { "name": "error-screen-demo", "type": "registry:example", "title": null, "description": null }, { "name": "fallback-poster-demo", "type": "registry:example", "title": null, "description": null }, { "name": "playback-state-control-demo", "type": "registry:example", "title": null, "description": null }, { "name": "picture-in-picture-control-demo", "type": "registry:example", "title": null, "description": null }, { "name": "volume-slider-control-horizontal-demo", "type": "registry:example", "title": null, "description": null }, { "name": "volume-slider-control-vertical-demo", "type": "registry:example", "title": null, "description": null }, { "name": "volume-state-control-demo", "type": "registry:example", "title": null, "description": null }, { "name": "timeline-control-demo", "type": "registry:example", "title": null, "description": null }, { "name": "timeline-labels-demo", "type": "registry:example", "title": null, "description": null }, { "name": "captions-state-control-demo", "type": "registry:example", "title": null, "description": null }, { "name": "playback-rate-demo", "type": "registry:example", "title": null, "description": null }, { "name": "seek-control-demo", "type": "registry:example", "title": null, "description": null } ], "component_count": 51, "components_truncated": false, "component_types": { "registry:style": 1, "registry:ui": 17, "registry:block": 2, "registry:lib": 3, "registry:hook": 16, "registry:example": 12 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 93, "name": "@lmscn", "category": "Niche/single-purpose", "tags": [ "components" ], "tagline": "LMS components for building interactive learning experiences — quiz, flashcards, matching, fill-in-the-blank, word scramble, sequencing, reading comprehension, spaced repetition and more.", "short_description": "LMS components for building interactive learning experiences — quiz, flashcards, matching, fill-in-the-blank, word scramble, sequencing, reading comprehension, spaced repetition and more.", "description": "lmscn is a focused shadcn/ui registry of 10 interactive LMS (learning management system) components built on Tailwind v4, with full TypeScript types, accessibility, and SM-2 spaced-repetition algorithm support. Components: quiz (multi-type with scoring/pass-fail), flashcards (3D flip with self-rating), match (term/definition pairs), fill-blank (cloze exercises), scramble (word unscrambling), order (drag-and-drop sequencing), reading-passage (three-phase comprehension), progress-tracker (gamified XP/streak lesson map), spaced-repetition (SM-2 review session), and hotspot (click-marker diagrams). All components expose onComplete callbacks. MIT licensed. Use for: embedding ready-made interactive learning widgets — quizzes, flashcards, drag-and-drop exercises — directly into an e-learning or edtech product.", "homepage": "https://lmscn.vercel.app", "docs": "https://lmscn.vercel.app/docs", "github": "https://github.com/SiphoChris/lmscn", "components_github": "https://github.com/SiphoChris/lmscn/tree/main/registry", "github_default_branch": "main", "github_stars": 19, "last_commit": "2026-02-27T06:50:49Z", "archived": false, "license": null, "open_issues": 3, "registry_template": "https://lmscn.vercel.app/r/{name}.json", "registry_index": "https://lmscn.vercel.app/r/registry.json", "components": [ "quiz", "flashcards", "match", "fill-blank", "scramble", "order", "reading-passage", "progress-tracker", "spaced-repetition", "hotspot" ], "component_items": [ { "name": "quiz", "type": "registry:component", "title": "Quiz", "description": "Multi-type quiz (single-choice, multi-select, true/false) with per-question scoring, progress bar, answer explanations and a pass/fail results screen." }, { "name": "flashcards", "type": "registry:component", "title": "Flashcards", "description": "CSS 3-D flip-card deck with optional self-rating (Again / Hard / Good / Easy) and a session summary." }, { "name": "match", "type": "registry:component", "title": "Match", "description": "Click-to-match term/definition pairs with mistake tracking and animated wrong-answer shake." }, { "name": "fill-blank", "type": "registry:component", "title": "Fill in the Blank", "description": "Inline blank-filling exercise supporting multiple blanks per sentence, alternative accepted answers and keyboard navigation." }, { "name": "scramble", "type": "registry:component", "title": "Word Scramble", "description": "Letter-tile word unscrambling game with optional image/text clues and a reset button." }, { "name": "order", "type": "registry:component", "title": "Order / Sequence", "description": "Drag-and-drop (or ↑↓ keyboard) item-sequencing exercise that reveals the correct order on failure." }, { "name": "reading-passage", "type": "registry:component", "title": "Reading Passage", "description": "Three-phase reading comprehension: passage view → inline questions → results. Supports plain text or HTML and optional passage-hiding." }, { "name": "progress-tracker", "type": "registry:component", "title": "Progress Tracker", "description": "Gamified zigzag lesson map with XP bar, level badge, daily streak and tooltip-rich lesson nodes." }, { "name": "spaced-repetition", "type": "registry:component", "title": "Spaced Repetition", "description": "SM-2 algorithm review session: flip cards, grade with Again/Hard/Good/Easy, computes next interval and ease factor." }, { "name": "hotspot", "type": "registry:component", "title": "Image Hotspot", "description": "Click labelled markers on a diagram or photo, type the answer in a popover, check all labels at once." } ], "component_count": 10, "components_truncated": false, "component_types": { "registry:component": 10 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 94, "name": "@loading-ui", "category": "Animated components", "tags": [ "aesthetic" ], "tagline": "Spinners, loaders, and loading animations for modern web apps. Free and open-source.", "short_description": "Spinners, loaders, and loading animations for modern web apps. Free and open-source.", "description": "Loading UI is a small, focused open-source shadcn/ui registry of spinners, loaders, and loading animations for React and Tailwind CSS apps, from the TurboStarter team. Ships 35+ named variants including Arc, Bars, Bobbing Dots, Classic, Clock Ring, Comet Spinner, Concentric Ring, Dash Ring, Diamond, Dots Ring, Dual Arc, Fade Arc, Infinity, Morphing Infinity, Orbit Ring, Pulsating Dots, Ring, Ripple, Satellite Ring, Skeleton, Spiral, Spokes, Swirling, Terminal, Text Blink, Text Dots, Text Shimmer Wave, Typing, Wandering Eyes, and Wave. Copy-paste and CLI-friendly; no animation framework dependency beyond Tailwind. MIT licensed. Use for: adding polished, intentional loading states to any React/Tailwind project without importing a full design system.", "homepage": "https://loading-ui.com", "docs": "https://loading-ui.com/docs", "github": "https://github.com/turbostarter/loading-ui", "components_github": "https://github.com/turbostarter/loading-ui/tree/main/registry", "github_default_branch": "main", "github_stars": 399, "last_commit": "2026-07-01T21:01:48Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://loading-ui.com/r/{name}.json", "registry_index": "https://loading-ui.com/r/registry.json", "components": [ "index", "style", "ring", "spokes", "classic", "dots-ring", "spiral", "swirling", "arc", "dual-arc", "fade-arc", "concentric-ring", "orbit-ring", "satellite-ring", "clock-ring", "quarter-ring", "dash-ring", "comet-spinner", "pulse", "ripple", "pulse-dot", "dots", "bobbing-dots", "bouncing-dots", "typing", "twin-orbit", "pulsating-dots", "triple-dot-spinner", "text-shimmer", "text-blink", "text-dots", "text-shimmer-wave", "morphing-infinity", "infinity", "accordion-loader", "symmetric-wave", "square-grid", "square-accordion", "conveyor-loop", "square-snake", "infinity-square-snake", "infinity-track", "diamond", "wave", "bars", "analyzing-image", "skeleton", "terminal", "wandering-eyes", "utils" ], "component_items": [ { "name": "index", "type": "registry:style", "title": null, "description": null }, { "name": "style", "type": "registry:style", "title": null, "description": null }, { "name": "ring", "type": "registry:component", "title": null, "description": null }, { "name": "spokes", "type": "registry:component", "title": null, "description": null }, { "name": "classic", "type": "registry:component", "title": null, "description": null }, { "name": "dots-ring", "type": "registry:component", "title": null, "description": null }, { "name": "spiral", "type": "registry:component", "title": null, "description": null }, { "name": "swirling", "type": "registry:component", "title": null, "description": null }, { "name": "arc", "type": "registry:component", "title": null, "description": null }, { "name": "dual-arc", "type": "registry:component", "title": null, "description": null }, { "name": "fade-arc", "type": "registry:component", "title": null, "description": null }, { "name": "concentric-ring", "type": "registry:component", "title": null, "description": null }, { "name": "orbit-ring", "type": "registry:component", "title": null, "description": null }, { "name": "satellite-ring", "type": "registry:component", "title": null, "description": null }, { "name": "clock-ring", "type": "registry:component", "title": null, "description": null }, { "name": "quarter-ring", "type": "registry:component", "title": null, "description": null }, { "name": "dash-ring", "type": "registry:component", "title": null, "description": null }, { "name": "comet-spinner", "type": "registry:component", "title": null, "description": null }, { "name": "pulse", "type": "registry:component", "title": null, "description": null }, { "name": "ripple", "type": "registry:component", "title": null, "description": null }, { "name": "pulse-dot", "type": "registry:component", "title": null, "description": null }, { "name": "dots", "type": "registry:component", "title": null, "description": null }, { "name": "bobbing-dots", "type": "registry:component", "title": null, "description": null }, { "name": "bouncing-dots", "type": "registry:component", "title": null, "description": null }, { "name": "typing", "type": "registry:component", "title": null, "description": null }, { "name": "twin-orbit", "type": "registry:component", "title": null, "description": null }, { "name": "pulsating-dots", "type": "registry:component", "title": null, "description": null }, { "name": "triple-dot-spinner", "type": "registry:component", "title": null, "description": null }, { "name": "text-shimmer", "type": "registry:component", "title": null, "description": null }, { "name": "text-blink", "type": "registry:component", "title": null, "description": null }, { "name": "text-dots", "type": "registry:component", "title": null, "description": null }, { "name": "text-shimmer-wave", "type": "registry:component", "title": null, "description": null }, { "name": "morphing-infinity", "type": "registry:component", "title": null, "description": null }, { "name": "infinity", "type": "registry:component", "title": null, "description": null }, { "name": "accordion-loader", "type": "registry:component", "title": null, "description": null }, { "name": "symmetric-wave", "type": "registry:component", "title": null, "description": null }, { "name": "square-grid", "type": "registry:component", "title": null, "description": null }, { "name": "square-accordion", "type": "registry:component", "title": null, "description": null }, { "name": "conveyor-loop", "type": "registry:component", "title": null, "description": null }, { "name": "square-snake", "type": "registry:component", "title": null, "description": null }, { "name": "infinity-square-snake", "type": "registry:component", "title": null, "description": null }, { "name": "infinity-track", "type": "registry:component", "title": null, "description": null }, { "name": "diamond", "type": "registry:component", "title": null, "description": null }, { "name": "wave", "type": "registry:component", "title": null, "description": null }, { "name": "bars", "type": "registry:component", "title": null, "description": null }, { "name": "analyzing-image", "type": "registry:component", "title": null, "description": null }, { "name": "skeleton", "type": "registry:component", "title": null, "description": null }, { "name": "terminal", "type": "registry:component", "title": null, "description": null }, { "name": "wandering-eyes", "type": "registry:component", "title": null, "description": null }, { "name": "utils", "type": "registry:lib", "title": null, "description": null } ], "component_count": 50, "components_truncated": false, "component_types": { "registry:style": 2, "registry:component": 47, "registry:lib": 1 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 95, "name": "@lucide-animated", "category": "Icons/logos", "tags": [ "saas", "dashboard", "aesthetic" ], "tagline": "An open-source collection of smooth animated lucide icons for your projects", "short_description": "An open-source collection of smooth animated lucide icons for your projects", "description": "lucide-animated is a free, MIT-licensed open-source collection of 350+ smooth animated React icons built with Motion (formerly Framer Motion) and Lucide as the base SVG set. Every icon is a drop-in replacement for its static Lucide counterpart, adding entrance and hover animations. Installed via shadcn CLI. Copy-paste ownership model; 7,600+ GitHub stars. No paid tier. Use for: upgrading static Lucide icons to animated versions throughout a React UI without writing animation code, particularly effective on marketing sites or interactive dashboards where subtle motion adds polish.", "homepage": "https://lucide-animated.com", "docs": "https://lucide-animated.com", "github": "https://github.com/pqoqubbw/icons", "components_github": "https://github.com/pqoqubbw/icons/tree/main/components", "github_default_branch": "main", "github_stars": 7765, "last_commit": "2026-06-29T10:58:37Z", "archived": false, "license": "MIT", "open_issues": 12, "registry_template": "https://lucide-animated.com/r/{name}.json", "registry_index": "https://lucide-animated.com/r/registry.json", "components": [ "a-arrow-down", "a-arrow-up", "accessibility", "activity", "air-vent", "airplane", "alarm-clock", "align-center", "align-horizontal", "align-vertical", "ambulance", "angry", "annoyed", "archive", "arrow-big-down-dash", "arrow-big-down", "arrow-big-left-dash", "arrow-big-left", "arrow-big-right-dash", "arrow-big-right", "arrow-big-up-dash", "arrow-big-up", "arrow-down-0-1", "arrow-down-1-0", "arrow-down-a-z", "arrow-down-left", "arrow-down-right", "arrow-up-left", "arrow-up-right", "arrow-down-z-a", "arrow-down", "arrow-left", "arrow-right", "arrow-up", "at-sign", "attach-file", "audio-lines", "badge-alert", "badge-percent", "ban", "banana", "battery-full", "battery-low", "battery-medium", "bell", "blocks", "bluetooth-connected", "bluetooth-off", "bluetooth-searching", "bluetooth", "bold", "bone", "book-text", "bookmark-check", "bookmark-minus", "bookmark-plus", "bookmark-x", "bookmark", "bot-message-square", "bot", "boxes", "brain", "calendar-check-2", "calendar-check", "calendar-cog", "calendar-days", "cart", "cast", "cctv", "chart-bar-decreasing", "chart-bar-increasing", "chart-column-decreasing", "chart-column-increasing", "chart-line", "chart-no-axes-column-decreasing", "chart-no-axes-column-increasing", "chart-pie", "chart-scatter", "chart-spline", "check-check", "check", "chevron-down", "chevron-first", "chevron-left", "chevron-right", "chevron-up", "chevrons-down-up", "chevrons-left-right", "chevrons-right-left", "chevrons-up-down", "chrome", "circle-check", "circle-chevron-down", "circle-chevron-left", "circle-chevron-right", "circle-chevron-up", "circle-dashed", "circle-dollar-sign", "circle-help", "clap" ], "component_items": [ { "name": "a-arrow-down", "type": "registry:ui", "title": null, "description": null }, { "name": "a-arrow-up", "type": "registry:ui", "title": null, "description": null }, { "name": "accessibility", "type": "registry:ui", "title": null, "description": null }, { "name": "activity", "type": "registry:ui", "title": null, "description": null }, { "name": "air-vent", "type": "registry:ui", "title": null, "description": null }, { "name": "airplane", "type": "registry:ui", "title": null, "description": null }, { "name": "alarm-clock", "type": "registry:ui", "title": null, "description": null }, { "name": "align-center", "type": "registry:ui", "title": null, "description": null }, { "name": "align-horizontal", "type": "registry:ui", "title": null, "description": null }, { "name": "align-vertical", "type": "registry:ui", "title": null, "description": null }, { "name": "ambulance", "type": "registry:ui", "title": null, "description": null }, { "name": "angry", "type": "registry:ui", "title": null, "description": null }, { "name": "annoyed", "type": "registry:ui", "title": null, "description": null }, { "name": "archive", "type": "registry:ui", "title": null, "description": null }, { "name": "arrow-big-down-dash", "type": "registry:ui", "title": null, "description": null }, { "name": "arrow-big-down", "type": "registry:ui", "title": null, "description": null }, { "name": "arrow-big-left-dash", "type": "registry:ui", "title": null, "description": null }, { "name": "arrow-big-left", "type": "registry:ui", "title": null, "description": null }, { "name": "arrow-big-right-dash", "type": "registry:ui", "title": null, "description": null }, { "name": "arrow-big-right", "type": "registry:ui", "title": null, "description": null }, { "name": "arrow-big-up-dash", "type": "registry:ui", "title": null, "description": null }, { "name": "arrow-big-up", "type": "registry:ui", "title": null, "description": null }, { "name": "arrow-down-0-1", "type": "registry:ui", "title": null, "description": null }, { "name": "arrow-down-1-0", "type": "registry:ui", "title": null, "description": null }, { "name": "arrow-down-a-z", "type": "registry:ui", "title": null, "description": null }, { "name": "arrow-down-left", "type": "registry:ui", "title": null, "description": null }, { "name": "arrow-down-right", "type": "registry:ui", "title": null, "description": null }, { "name": "arrow-up-left", "type": "registry:ui", "title": null, "description": null }, { "name": "arrow-up-right", "type": "registry:ui", "title": null, "description": null }, { "name": "arrow-down-z-a", "type": "registry:ui", "title": null, "description": null }, { "name": "arrow-down", "type": "registry:ui", "title": null, "description": null }, { "name": "arrow-left", "type": "registry:ui", "title": null, "description": null }, { "name": "arrow-right", "type": "registry:ui", "title": null, "description": null }, { "name": "arrow-up", "type": "registry:ui", "title": null, "description": null }, { "name": "at-sign", "type": "registry:ui", "title": null, "description": null }, { "name": "attach-file", "type": "registry:ui", "title": null, "description": null }, { "name": "audio-lines", "type": "registry:ui", "title": null, "description": null }, { "name": "badge-alert", "type": "registry:ui", "title": null, "description": null }, { "name": "badge-percent", "type": "registry:ui", "title": null, "description": null }, { "name": "ban", "type": "registry:ui", "title": null, "description": null }, { "name": "banana", "type": "registry:ui", "title": null, "description": null }, { "name": "battery-full", "type": "registry:ui", "title": null, "description": null }, { "name": "battery-low", "type": "registry:ui", "title": null, "description": null }, { "name": "battery-medium", "type": "registry:ui", "title": null, "description": null }, { "name": "bell", "type": "registry:ui", "title": null, "description": null }, { "name": "blocks", "type": "registry:ui", "title": null, "description": null }, { "name": "bluetooth-connected", "type": "registry:ui", "title": null, "description": null }, { "name": "bluetooth-off", "type": "registry:ui", "title": null, "description": null }, { "name": "bluetooth-searching", "type": "registry:ui", "title": null, "description": null }, { "name": "bluetooth", "type": "registry:ui", "title": null, "description": null }, { "name": "bold", "type": "registry:ui", "title": null, "description": null }, { "name": "bone", "type": "registry:ui", "title": null, "description": null }, { "name": "book-text", "type": "registry:ui", "title": null, "description": null }, { "name": "bookmark-check", "type": "registry:ui", "title": null, "description": null }, { "name": "bookmark-minus", "type": "registry:ui", "title": null, "description": null }, { "name": "bookmark-plus", "type": "registry:ui", "title": null, "description": null }, { "name": "bookmark-x", "type": "registry:ui", "title": null, "description": null }, { "name": "bookmark", "type": "registry:ui", "title": null, "description": null }, { "name": "bot-message-square", "type": "registry:ui", "title": null, "description": null }, { "name": "bot", "type": "registry:ui", "title": null, "description": null } ], "component_count": 440, "components_truncated": true, "component_types": { "registry:ui": 440 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 96, "name": "@lumiui", "category": "Component library (general)", "tags": [ "dashboard", "components" ], "tagline": "Composable React components powered by Base UI and Tailwind CSS — Build fast, customize everything.", "short_description": "Composable React components powered by Base UI and Tailwind CSS — Build fast, customize everything.", "description": "Lumi UI is a composable React component library built on Base UI (MUI team's headless primitives) and Tailwind CSS, offering both pre-assembled composite components and raw primitive building blocks. Ships form and input components (Form, Input, Autocomplete, Combobox, OTP Field, Number Field, Select, Slider, Switch, Textarea), layout and navigation (Accordion, Tabs, Command Menu, Navigation Menu, Scroll Area, Sidebar), overlays (Dialog, Alert Dialog, Context Menu, Drawer, Dropdown Menu, Popover, Sheet, Tooltip), feedback (Meter, Progress, Toast), and display (Avatar, Chart, Resizable, Toolbar). Multiple built-in themes (Dune, Canopy, Celeste, Lagoon, Orchid). Use for: teams that prefer Base UI's accessibility model over Radix UI while still wanting Tailwind-styled, fully owned components.", "homepage": "https://www.lumiui.dev", "docs": "https://www.lumiui.dev/docs/introduction", "github": "https://github.com/patrick-xin/lumi-ui", "components_github": null, "github_default_branch": "main", "github_stars": 25, "last_commit": "2026-07-06T19:54:16Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://www.lumiui.dev/r/{name}.json", "registry_index": "https://www.lumiui.dev/r/registry.json", "components": [ "ui", "chat-input", "utils", "use-mobile", "accordion", "avatar", "alert-dialog", "dialog", "drawer", "tabs", "scroll-area", "popover", "dropdown-menu", "autocomplete", "input", "button", "checkbox", "switch", "select", "navigation-menu", "collapsible", "command-menu", "preview-card", "progress", "field", "fieldset", "form", "radio", "tooltip", "toggle", "toggle-group", "toast", "checkbox-group", "slider", "separator", "number-field", "meter", "otp-field", "toolbar", "context-menu", "combobox", "menubar", "sheet", "resizable", "arrow-svg", "label", "sidebar", "textarea", "chart", "breadcrumb", "badge", "card", "kbd", "skeleton", "sidebar-01", "sidebar-02", "dialog-01", "dialog-02", "project-status-picker", "expandable-dialog", "morphing-dialog", "vercel-notification", "t3-model-selector", "slider-video-trimmer", "team-switcher", "collapsible-file-tree", "onboarding-dialog" ], "component_items": [ { "name": "ui", "type": "registry:ui", "title": null, "description": null }, { "name": "chat-input", "type": "registry:ui", "title": "Chat Input", "description": "A chat input component." }, { "name": "utils", "type": "registry:lib", "title": null, "description": null }, { "name": "use-mobile", "type": "registry:hook", "title": null, "description": null }, { "name": "accordion", "type": "registry:ui", "title": "Accordion", "description": "A set of collapsible panels with headings." }, { "name": "avatar", "type": "registry:ui", "title": "Avatar", "description": "An easily stylable avatar component." }, { "name": "alert-dialog", "type": "registry:ui", "title": "Alert Dialog", "description": "A dialog that requires user response to proceed." }, { "name": "dialog", "type": "registry:ui", "title": "Dialog", "description": "A popup that opens on top of the entire page." }, { "name": "drawer", "type": "registry:ui", "title": "Drawer", "description": "A panel that slides in from the edge of the screen." }, { "name": "tabs", "type": "registry:ui", "title": "Tabs", "description": "A component for toggling between related panels on the same page." }, { "name": "scroll-area", "type": "registry:ui", "title": "Scroll Area", "description": "A native scroll container with custom scrollbars." }, { "name": "popover", "type": "registry:ui", "title": "Popover", "description": "An accessible popup anchored to a button." }, { "name": "dropdown-menu", "type": "registry:ui", "title": "Dropdown Menu", "description": "A list of actions in a dropdown, enhanced with keyboard navigation." }, { "name": "autocomplete", "type": "registry:ui", "title": "Autocomplete", "description": "An input that suggests options as you type." }, { "name": "input", "type": "registry:ui", "title": "Input", "description": "A native input element that automatically works with Field." }, { "name": "button", "type": "registry:ui", "title": "Button", "description": "A button component that can be rendered as another tag or focusable when disabled." }, { "name": "checkbox", "type": "registry:ui", "title": "Checkbox", "description": "An easily stylable checkbox component." }, { "name": "switch", "type": "registry:ui", "title": "Switch", "description": "A control that indicates whether a setting is on or off." }, { "name": "select", "type": "registry:ui", "title": "Select", "description": "A common form component for choosing a predefined value in a dropdown menu." }, { "name": "navigation-menu", "type": "registry:ui", "title": "Navigation Menu", "description": "A collection of links and menus for website navigation." }, { "name": "collapsible", "type": "registry:ui", "title": "Collapsible", "description": "A collapsible panel controlled by a button." }, { "name": "command-menu", "type": "registry:ui", "title": "Command Menu", "description": "A mobile-friendly command palette for search and quick actions." }, { "name": "preview-card", "type": "registry:ui", "title": "Preview Card", "description": "An accessible popup anchored to a button." }, { "name": "progress", "type": "registry:ui", "title": "Progress", "description": "Displays the status of a task that takes a long time." }, { "name": "field", "type": "registry:ui", "title": "Field", "description": "A component that provides labeling and validation for form controls." }, { "name": "fieldset", "type": "registry:ui", "title": "Field Set", "description": "A native fieldset element with an easily stylable legend." }, { "name": "form", "type": "registry:ui", "title": "Form", "description": "A native form element with consolidated error handling." }, { "name": "radio", "type": "registry:ui", "title": "Radio", "description": "An easily stylable radio button component." }, { "name": "tooltip", "type": "registry:ui", "title": "Tooltip", "description": "A popup that appears when an element is hovered or focused, showing a hint for sighted users." }, { "name": "toggle", "type": "registry:ui", "title": "Toggle", "description": "A two-state button that can be on or off." }, { "name": "toggle-group", "type": "registry:ui", "title": "Toggle Group", "description": "Provides a shared state to a series of toggle buttons." }, { "name": "toast", "type": "registry:ui", "title": "Toast", "description": "Generates toast notifications." }, { "name": "checkbox-group", "type": "registry:ui", "title": "Checkbox Group", "description": "Provides a shared state to a series of checkboxes." }, { "name": "slider", "type": "registry:ui", "title": "Slider", "description": "An easily stylable range input." }, { "name": "separator", "type": "registry:ui", "title": "Separator", "description": "A separator element accessible to screen readers." }, { "name": "number-field", "type": "registry:ui", "title": "Number Field", "description": "A numeric input element with increment and decrement buttons, and a scrub area." }, { "name": "meter", "type": "registry:ui", "title": "Meter", "description": "A graphical display of a numeric value within a range." }, { "name": "otp-field", "type": "registry:ui", "title": "OTP Field", "description": "A one-time password input composed of individual character slots." }, { "name": "toolbar", "type": "registry:ui", "title": "Toolbar", "description": "A container for grouping a set of buttons and controls." }, { "name": "context-menu", "type": "registry:ui", "title": "Context Menu", "description": "A menu that appears at the pointer on right click or long press." }, { "name": "combobox", "type": "registry:ui", "title": "Combobox", "description": "An input combined with a list of predefined items to select." }, { "name": "menubar", "type": "registry:ui", "title": "Menubar", "description": "A menu bar providing commands and options for your application." }, { "name": "sheet", "type": "registry:ui", "title": "Sheet", "description": "Extends the Dialog component to display content that complements the main content of the screen." }, { "name": "resizable", "type": "registry:ui", "title": "Resizable", "description": "Accessible resizable panel groups and layouts with keyboard support." }, { "name": "arrow-svg", "type": "registry:ui", "title": "Arrow SVG", "description": "Arrow SVG component." }, { "name": "label", "type": "registry:ui", "title": "Label", "description": "Renders an accessible label associated with controls." }, { "name": "sidebar", "type": "registry:ui", "title": "Sidebar", "description": "App sidebar" }, { "name": "textarea", "type": "registry:ui", "title": "Textarea", "description": "A native textarea element." }, { "name": "chart", "type": "registry:ui", "title": "Chart", "description": "Beautiful charts. Built using Recharts." }, { "name": "breadcrumb", "type": "registry:ui", "title": "Breadcrumb", "description": "Displays the path to the current resource using a hierarchy of links." }, { "name": "badge", "type": "registry:ui", "title": "Badge", "description": "Displays a small count or status indicator." }, { "name": "card", "type": "registry:ui", "title": "Card", "description": "Displays content inside a themed container." }, { "name": "kbd", "type": "registry:ui", "title": "KBD", "description": "Styles keyboard key hints and key groups." }, { "name": "skeleton", "type": "registry:ui", "title": "Skeleton", "description": "A placeholder used while content is loading." }, { "name": "sidebar-01", "type": "registry:block", "title": null, "description": "Sidebar with collapsible icons and sections." }, { "name": "sidebar-02", "type": "registry:block", "title": null, "description": "Dashboard layout with sidebar and main content area." }, { "name": "dialog-01", "type": "registry:block", "title": null, "description": "Complex user management UI with nested dialogs." }, { "name": "dialog-02", "type": "registry:block", "title": null, "description": "Image gallery with nested auth dialogs. Inspired by Unsplash." }, { "name": "project-status-picker", "type": "registry:component", "title": "Project Status Picker", "description": "A compact status selector optimized for efficiency. Features custom hotkey logic for instant selection, rich item rendering with status colors, and contextual …" }, { "name": "expandable-dialog", "type": "registry:component", "title": "Expandable Dialog", "description": "Responsive dialog that can expand and shrink" } ], "component_count": 67, "components_truncated": false, "component_types": { "registry:ui": 52, "registry:lib": 1, "registry:hook": 1, "registry:block": 4, "registry:component": 9 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 97, "name": "@lytenyte", "category": "Charts/data viz", "tags": [ "dashboard" ], "tagline": "LyteNyte Grid is a high performance, light weight, headless, React data grid. Our registry provides LyteNyte Grid themed using Tailwind and the Shadcn theme variables.", "short_description": "LyteNyte Grid is a high performance, light weight, headless, React data grid. Our registry provides LyteNyte Grid themed using Tailwind and the Shadcn theme variables.", "description": "LyteNyte Grid is a ~40 KB zero-dependency React data grid from 1771 Technologies engineered for enterprise-scale datasets, capable of 10,000 updates/second and millions of rows. The shadcn registry provides a Tailwind-themed, shadcn CSS-variable-aware wrapper around LyteNyte Grid. Core (free, open source) includes sorting, filtering, editing, row selection, detail views, aggregation, row grouping, and cell range selection. PRO (commercial license) adds server-side data loading, pivoting, tree data, and advanced filtering. Headless or pre-styled options available. Use for: replacing AG Grid or TanStack Table with a lighter, React-native data grid that slots into a shadcn/ui design system without wrapper overhead.", "homepage": "https://www.1771technologies.com", "docs": "https://www.1771technologies.com/docs/intro-getting-started", "github": "https://github.com/1771-Technologies/lytenyte", "components_github": null, "github_default_branch": "main", "github_stars": 941, "last_commit": "2026-07-07T02:33:46Z", "archived": false, "license": null, "open_issues": 3, "registry_template": "https://www.1771technologies.com/r/{name}.json", "registry_index": "https://www.1771technologies.com/r/registry.json", "components": [ "lytenyte-core", "lytenyte-pro" ], "component_items": [ { "name": "lytenyte-core", "type": "registry:component", "title": "LyteNyte Core", "description": "The free Core edition of LyteNyte Grid, an incredibly fast and feature complete React DataGrid." }, { "name": "lytenyte-pro", "type": "registry:component", "title": "LyteNyte PRO", "description": "The commercial PRO edition of LyteNyte Grid, the fastest data grid every created for the modern web." } ], "component_count": 2, "components_truncated": false, "component_types": { "registry:component": 2 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 98, "name": "@magicui", "category": "Animated components", "tags": [ "saas", "aesthetic" ], "tagline": "UI Library for Design Engineers. 150+ free and open-source animated components and effects built with React, Typescript, Tailwind CSS, and Motion. Perfect companion for shadcn/ui.", "short_description": "UI Library for Design Engineers. 150+ free and open-source animated components and effects built with React, Typescript, Tailwind CSS, and Motion. Perfect companion for shadcn/ui.", "description": "Magic UI is a flagship open-source animated component library for design engineers, offering 150+ free React components and effects built with TypeScript, Tailwind CSS, and Motion. Categories span Backgrounds (Flickering Grid, Aurora, Interactive), Text effects (Aurora Text, Comic Text, Blur Fade), Buttons (Magnetic, Animated Shiny), Cards (Bento Grid, Card Glare), Borders (Magic Border, Beam Shine), Devices, Social Proof (Avatar Circles, Marquee), and standalone Templates. Companion to shadcn/ui (same install pattern). 100% free, MIT licensed, 20k+ GitHub stars. Use for: adding high-impact animated hero sections, bento grids, shimmer effects, and interactive backgrounds to SaaS landing pages or portfolios built on shadcn/ui.", "homepage": "https://magicui.design", "docs": "https://magicui.design/docs", "github": "https://github.com/magicuidesign/magicui", "components_github": null, "github_default_branch": "main", "github_stars": 21473, "last_commit": "2026-07-02T14:24:52Z", "archived": false, "license": "MIT", "open_issues": 1, "registry_template": "https://magicui.design/r/{name}", "registry_index": "https://magicui.design/r/registry", "components": [ "index", "magic-card", "android", "warp-background", "line-shadow-text", "aurora-text", "morphing-text", "scroll-progress", "lens", "pointer", "smooth-cursor", "progressive-blur", "neon-gradient-card", "noise-texture", "meteors", "grid-pattern", "hexagon-pattern", "striped-pattern", "interactive-grid-pattern", "dot-pattern", "flickering-grid", "hero-video-dialog", "code-comparison", "marquee", "globe", "glyph-matrix", "glare-hover", "shimmer-button", "tweet-card", "client-tweet-card", "bento-grid", "particles", "number-ticker", "ripple", "retro-grid", "animated-list", "animated-shiny-text", "animated-grid-pattern", "border-beam", "animated-beam", "text-reveal", "dia-text-reveal", "hyper-text", "animated-gradient-text", "orbiting-circles", "dock", "word-rotate", "avatar-circles", "typing-animation", "sparkles-text", "spinning-text", "comic-text", "icon-cloud", "text-animate", "scroll-based-velocity", "shiny-button", "shine-border", "animated-circular-progress-bar", "confetti", "cool-mode", "pulsating-button", "ripple-button", "file-tree", "blur-fade", "safari", "iphone", "rainbow-button", "interactive-hover-button", "terminal", "video-text", "pixel-image", "highlighter", "animated-theme-toggler", "light-rays", "dotted-map", "backlight", "kinetic-text", "text-3d-flip", "magic-card-demo", "magic-card-demo-2", "android-demo", "android-demo-2", "android-demo-3", "warp-background-demo", "line-shadow-text-demo", "aurora-text-demo", "morphing-text-demo", "scroll-progress-demo", "lens-demo", "lens-demo-2", "lens-demo-3", "pointer-demo-1", "smooth-cursor-demo", "progressive-blur-demo", "neon-gradient-card-demo", "noise-texture-demo", "noise-texture-demo-2", "noise-texture-demo-3", "noise-texture-demo-4", "meteors-demo" ], "component_items": [ { "name": "index", "type": "registry:style", "title": null, "description": null }, { "name": "magic-card", "type": "registry:ui", "title": "Magic Card", "description": "A spotlight effect that follows your mouse cursor and highlights borders on hover." }, { "name": "android", "type": "registry:ui", "title": "Android", "description": "A mockup of an Android device." }, { "name": "warp-background", "type": "registry:ui", "title": "Warp Background", "description": "A card with a time warping background effect." }, { "name": "line-shadow-text", "type": "registry:ui", "title": "Line Shadow Text", "description": "A text component with a moving line shadow." }, { "name": "aurora-text", "type": "registry:ui", "title": "Aurora Text", "description": "A beautiful aurora text effect" }, { "name": "morphing-text", "type": "registry:ui", "title": "Morphing Text", "description": "A dynamic text morphing component for Magic UI." }, { "name": "scroll-progress", "type": "registry:ui", "title": "Scroll Progress", "description": "Animated Scroll Progress for your pages" }, { "name": "lens", "type": "registry:ui", "title": "Lens", "description": "A interactive component that enables zooming into images, videos and other elements." }, { "name": "pointer", "type": "registry:ui", "title": "Pointer", "description": "A component that displays a pointer when hovering over an element" }, { "name": "smooth-cursor", "type": "registry:ui", "title": null, "description": "A customizable, physics-based smooth cursor animation component with spring animations and rotation effects" }, { "name": "progressive-blur", "type": "registry:ui", "title": "Progressive Blur", "description": "The Progressive Blur component adds a smooth blur gradient effect to scrollable content, indicating more content below or above." }, { "name": "neon-gradient-card", "type": "registry:ui", "title": "Neon Gradient Card", "description": "A beautiful neon card effect" }, { "name": "noise-texture", "type": "registry:ui", "title": "Noise Texture", "description": "An SVG fractal noise layer using feTurbulence, desaturation, and contrast controls for subtle texture overlays." }, { "name": "meteors", "type": "registry:ui", "title": "Meteors", "description": "A meteor shower effect." }, { "name": "grid-pattern", "type": "registry:ui", "title": "Grid Pattern", "description": "A background grid pattern made with SVGs, fully customizable using Tailwind CSS." }, { "name": "hexagon-pattern", "type": "registry:ui", "title": "Hexagon Pattern", "description": "A background hexagon pattern made with SVGs, fully customizable using Tailwind CSS." }, { "name": "striped-pattern", "type": "registry:ui", "title": "Striped Pattern", "description": "A background striped pattern made with SVGs, fully customizable using Tailwind CSS." }, { "name": "interactive-grid-pattern", "type": "registry:ui", "title": "Interactive Grid Pattern", "description": "A interactive background grid pattern made with SVGs, fully customizable using Tailwind CSS." }, { "name": "dot-pattern", "type": "registry:ui", "title": "Dot Pattern", "description": "A background dot pattern made with SVGs, fully customizable using Tailwind CSS." }, { "name": "flickering-grid", "type": "registry:ui", "title": "Flickering Grid", "description": "A flickering grid background made with SVGs, fully customizable using Tailwind CSS." }, { "name": "hero-video-dialog", "type": "registry:ui", "title": "Hero Video Dialog", "description": "A hero video dialog component." }, { "name": "code-comparison", "type": "registry:ui", "title": "Code Comparison", "description": "A component which compares two code snippets." }, { "name": "marquee", "type": "registry:ui", "title": "Marquee", "description": "An infinite scrolling component that can be used to display text, images, or videos." }, { "name": "globe", "type": "registry:ui", "title": "Globe", "description": "An autorotating, interactive, and highly performant globe made using WebGL." }, { "name": "glyph-matrix", "type": "registry:ui", "title": "Glyph Matrix", "description": "An animated grid of subtly shifting glyphs with fade effect and theme support." }, { "name": "glare-hover", "type": "registry:ui", "title": "Glare Hover", "description": "A diagonal glare on hover using a ::before gradient and CSS variables (angle, size, duration, color)." }, { "name": "shimmer-button", "type": "registry:ui", "title": "Shimmer Button", "description": "A button with a shimmering light which travels around the perimeter." }, { "name": "tweet-card", "type": "registry:ui", "title": "Tweet Card", "description": "A card that displays a tweet with the author's name, handle, and profile picture." }, { "name": "client-tweet-card", "type": "registry:ui", "title": "Client Tweet Card", "description": "A client-side version of the tweet card that displays a tweet with the author's name, handle, and profile picture." }, { "name": "bento-grid", "type": "registry:ui", "title": "Bento Grid", "description": "Bento grid is a layout used to showcase the features of a product in a simple and elegant way." }, { "name": "particles", "type": "registry:ui", "title": "Particles", "description": "Particles are a fun way to add some visual flair to your website. They can be used to create a sense of depth, movement, and interactivity." }, { "name": "number-ticker", "type": "registry:ui", "title": "Number Ticker", "description": "Animate numbers to count up or down to a target number" }, { "name": "ripple", "type": "registry:ui", "title": "Ripple", "description": "An animated ripple effect typically used behind elements to emphasize them." }, { "name": "retro-grid", "type": "registry:ui", "title": "Retro Grid", "description": "An animated scrolling retro grid effect" }, { "name": "animated-list", "type": "registry:ui", "title": "Animated List", "description": "A list that animates each item in sequence with a delay. Used to showcase notifications or events on your landing page." }, { "name": "animated-shiny-text", "type": "registry:ui", "title": "Animated Shiny Text", "description": "A light glare effect which pans across text making it appear as if it is shimmering." }, { "name": "animated-grid-pattern", "type": "registry:ui", "title": "Animated Grid Pattern", "description": "A animated background grid pattern made with SVGs, fully customizable using Tailwind CSS." }, { "name": "border-beam", "type": "registry:ui", "title": "Border Beam", "description": "An animated beam of light which travels along the border of its container." }, { "name": "animated-beam", "type": "registry:ui", "title": "Animated Beam", "description": "An animated beam of light which travels along a path. Useful for showcasing the integration features of a website." }, { "name": "text-reveal", "type": "registry:ui", "title": "Text Reveal", "description": "Fade in text as you scroll down the page." }, { "name": "dia-text-reveal", "type": "registry:ui", "title": "Dia Text Reveal", "description": "A horizontal color band sweeps across text, revealing a gradient shine before settling on the base color." }, { "name": "hyper-text", "type": "registry:ui", "title": "Hyper Text", "description": "A text animation that scrambles letters before revealing the final text." }, { "name": "animated-gradient-text", "type": "registry:ui", "title": "Animated Gradient Text", "description": "An animated gradient background which transitions between colors for text." }, { "name": "orbiting-circles", "type": "registry:ui", "title": "Orbiting Circles", "description": "A collection of circles which move in orbit along a circular path" }, { "name": "dock", "type": "registry:ui", "title": "Dock", "description": "An implementation of the MacOS dock using react + tailwindcss + motion" }, { "name": "word-rotate", "type": "registry:ui", "title": "Word Rotate", "description": "A vertical rotation of words" }, { "name": "avatar-circles", "type": "registry:ui", "title": "Avatar Circles", "description": "Overlapping circles of avatars." }, { "name": "typing-animation", "type": "registry:ui", "title": "Typing Animation", "description": "Characters appearing in typed animation" }, { "name": "sparkles-text", "type": "registry:ui", "title": "Sparkles Text", "description": "A dynamic text that generates continuous sparkles with smooth transitions, perfect for highlighting text with animated stars." }, { "name": "spinning-text", "type": "registry:ui", "title": "Spinning Text", "description": "The Spinning Text component animates text in a circular motion with customizable speed, direction, color, and transitions for dynamic and engaging effects." }, { "name": "comic-text", "type": "registry:ui", "title": "Comic Text", "description": "Comic text animation" }, { "name": "icon-cloud", "type": "registry:ui", "title": "Icon Cloud", "description": "An interactive 3D tag cloud component" }, { "name": "text-animate", "type": "registry:ui", "title": "Text Animate", "description": "A text animation component that animates text using a variety of different animations." }, { "name": "scroll-based-velocity", "type": "registry:ui", "title": "Scroll Based Velocity", "description": "Scrolling text whose speed changes based on scroll speed" }, { "name": "shiny-button", "type": "registry:ui", "title": "Shiny Button", "description": "A shiny button component with dynamic styles in the dark mode or light mode." }, { "name": "shine-border", "type": "registry:ui", "title": "Shine Border", "description": "Shine border is an animated background border effect." }, { "name": "animated-circular-progress-bar", "type": "registry:ui", "title": "Animated Circular Progress Bar", "description": "Animated Circular Progress Bar is a component that displays a circular gauge with a percentage value." }, { "name": "confetti", "type": "registry:ui", "title": "Confetti", "description": "Confetti animations are best used to delight your users when something special happens" }, { "name": "cool-mode", "type": "registry:ui", "title": "Cool Mode", "description": "Cool mode effect for buttons, links, and other DOMs" } ], "component_count": 247, "components_truncated": true, "component_types": { "registry:style": 1, "registry:ui": 77, "registry:example": 168, "registry:lib": 1 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 99, "name": "@manifest", "category": "AI/chat UI", "tags": [ "ai" ], "tagline": "Agentic UI toolkit for building MCP Apps. Open-source components and blocks ready to use within your chat app.", "short_description": "Agentic UI toolkit for building MCP Apps. Open-source components and blocks ready to use within your chat app.", "description": "Manifest UI is a free, open-source shadcn/ui registry of blocks and components designed specifically for building ChatGPT custom apps and MCP agentic UIs. Block categories include Blogging (Post Card, Post Detail, Post List), Events (Event Card, Confirmation, Ticket Tier Select), Forms (Contact Form, Date & Time Picker, Issue Report), Lists & Tables, Map/Map Carousel, Messaging (Chat Conversation, Message Bubble), Payment (Amount Input, Order Confirm, Payment Confirmed), Selection (Option List, Quick Reply, Tag Select), Social (Instagram, LinkedIn, X, YouTube Post), and Status & Progress. Tailwind CSS v4 required. MIT licensed. Use for: embedding ready-made conversational UI blocks — chat flows, product selection, payment confirmation, social post previews — into ChatGPT or agent-powered applications.", "homepage": "https://ui.manifest.build", "docs": "https://ui.manifest.build", "github": "https://github.com/mnfst/manifest-ui", "components_github": "https://github.com/mnfst/manifest-ui/tree/main/registry", "github_default_branch": "main", "github_stars": 30, "last_commit": "2026-02-19T07:01:54Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://ui.manifest.build/r/{name}.json", "registry_index": "https://ui.manifest.build/r/registry.json", "components": [ "contact-form", "date-time-picker", "issue-report-form", "order-confirm", "payment-confirmed", "product-list", "option-list", "amount-input", "tag-select", "quick-reply", "progress-steps", "status-badge", "stat-card", "post-card", "post-list", "post-detail", "table", "message-bubble", "chat-conversation", "x-post", "instagram-post", "linkedin-post", "youtube-post", "map-carousel", "event-card", "event-list", "event-detail", "ticket-tier-select", "event-confirmation", "hero", "event-shared", "manifest-types" ], "component_items": [ { "name": "contact-form", "type": "registry:block", "title": "Contact Form", "description": "A complete contact form with name fields, phone with country selector, email, message textarea, and file attachment." }, { "name": "date-time-picker", "type": "registry:block", "title": "Date & Time Picker", "description": "A Calendly-style date and time picker with calendar, available time slots, and timezone display." }, { "name": "issue-report-form", "type": "registry:block", "title": "Issue Report Form", "description": "A compact issue reporting form for team members with categories, impact/urgency levels, and file attachments." }, { "name": "order-confirm", "type": "registry:block", "title": "Order Confirm", "description": "Order confirmation with product image, delivery info, and confirm action." }, { "name": "payment-confirmed", "type": "registry:block", "title": "Payment Confirmed", "description": "Payment confirmation card with product image, price, delivery info, and tracking button. Supports default and compressed variants." }, { "name": "product-list", "type": "registry:block", "title": "Product List", "description": "Product list with list, grid, carousel, and picker variants." }, { "name": "option-list", "type": "registry:block", "title": "Option List", "description": "Tag-style option selector with single or multiple selection modes." }, { "name": "amount-input", "type": "registry:block", "title": "Amount Input", "description": "Amount input with increment/decrement buttons and preset values." }, { "name": "tag-select", "type": "registry:block", "title": "Tag Select", "description": "Colored tag selector with single or multiple selection and color variants." }, { "name": "quick-reply", "type": "registry:block", "title": "Quick Reply", "description": "Quick reply buttons for common chat responses." }, { "name": "progress-steps", "type": "registry:block", "title": "Progress Steps", "description": "Progress indicator with horizontal or vertical layout and step statuses." }, { "name": "status-badge", "type": "registry:block", "title": "Status Badge", "description": "Status badge with multiple states (success, pending, processing, error, shipped, delivered)." }, { "name": "stat-card", "type": "registry:block", "title": "Stat Card", "description": "Scrollable stat cards with values, trends, and change indicators." }, { "name": "post-card", "type": "registry:block", "title": "Post Card", "description": "Post card with image, title, excerpt, author info and read more button. Supports default, compact, horizontal, and covered variants. Includes post-detail for f…" }, { "name": "post-list", "type": "registry:block", "title": "Post List", "description": "Post list with list, grid, carousel, and fullwidth variants. Fullwidth mode shows paginated posts." }, { "name": "post-detail", "type": "registry:block", "title": "Post Detail", "description": "Full post view with cover image, author info, content, tags and related posts section." }, { "name": "table", "type": "registry:block", "title": "Table", "description": "Data table with optional single or multi-select modes for chat interfaces." }, { "name": "message-bubble", "type": "registry:block", "title": "Message Bubble", "description": "Chat message bubbles with text, image, voice, and reaction variants." }, { "name": "chat-conversation", "type": "registry:block", "title": "Chat Conversation", "description": "Full chat conversation component with multiple message types." }, { "name": "x-post", "type": "registry:block", "title": "X Post", "description": "X (Twitter) post card with engagement metrics." }, { "name": "instagram-post", "type": "registry:block", "title": "Instagram Post", "description": "Instagram post card with image and engagement." }, { "name": "linkedin-post", "type": "registry:block", "title": "LinkedIn Post", "description": "LinkedIn post card with professional styling." }, { "name": "youtube-post", "type": "registry:block", "title": "YouTube Post", "description": "YouTube video card with playable embed." }, { "name": "map-carousel", "type": "registry:block", "title": "Map Carousel", "description": "Interactive map with location markers and a draggable carousel of cards." }, { "name": "event-card", "type": "registry:block", "title": "Event Card", "description": "Display event information with multiple layouts. Supports events with images, signals, vibe tags, and display-formatted date/time. Entire card is clickable." }, { "name": "event-list", "type": "registry:block", "title": "Event List", "description": "Display events in grid, list, or carousel layouts. Fullscreen mode shows interactive split-screen map with Leaflet and animated filter panel." }, { "name": "event-detail", "type": "registry:block", "title": "Event Detail", "description": "Full event detail view with organizer info, interactive map, policies, and ticket purchase. Fullwidth mode only." }, { "name": "ticket-tier-select", "type": "registry:block", "title": "Ticket Tier Select", "description": "Ticket tier selection with quantity controls and order summary. Shows price breakdown with fees." }, { "name": "event-confirmation", "type": "registry:block", "title": "Event Confirmation", "description": "Order confirmation with event details, ticket delivery info, organizer follow, and social sharing." }, { "name": "hero", "type": "registry:block", "title": "Hero", "description": "Landing hero section with optional logos, title, subtitle, CTA buttons, and tech logos footer. Supports image or text logos with separator." }, { "name": "event-shared", "type": "registry:lib", "title": "Event Shared Utilities", "description": "Shared utilities for event components (Leaflet map helpers, signal badges)." }, { "name": "manifest-types", "type": "registry:lib", "title": "Manifest Types", "description": "Shared type definitions for Manifest UI components." } ], "component_count": 32, "components_truncated": false, "component_types": { "registry:block": 30, "registry:lib": 2 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 100, "name": "@mapcn", "category": "Maps", "tags": [ "components" ], "tagline": "Beautiful maps, made simple. Ready to use, customizable map components for React. Built on MapLibre. Styled with Tailwind CSS.", "short_description": "Beautiful maps, made simple. Ready to use, customizable map components for React. Built on MapLibre. Styled with Tailwind CSS.", "description": "mapcn is a free, open-source shadcn/ui-style copy-paste registry of map components for React, built on MapLibre GL and styled with Tailwind CSS. Components cover the full map interaction set: Map, Controls, Markers, Popups, Routes, Arcs, Clusters, plus pre-built Blocks. Works with any MapLibre-compatible tile provider (OpenStreetMap, MapTiler, Carto, Stadia, Thunderforest) and automatically adapts to light/dark themes. Zero config out of the box; full TypeScript support. Use for: adding customizable, design-system-integrated interactive maps to a React/Next.js app without a heavyweight SDK, especially when the app already uses shadcn/ui patterns.", "homepage": "https://mapcn.dev", "docs": "https://mapcn.dev/docs", "github": "https://github.com/AnmolSaini16/mapcn", "components_github": "https://github.com/AnmolSaini16/mapcn/tree/main/src/registry", "github_default_branch": "main", "github_stars": 10614, "last_commit": "2026-07-04T09:26:21Z", "archived": false, "license": "MIT", "open_issues": 17, "registry_template": "https://mapcn.dev/r/{name}.json", "registry_index": "https://mapcn.dev/r/registry.json", "components": [ "map", "analytics-map", "choropleth", "uptime-monitor", "logistics-network", "store-locator", "heatmap", "delivery-tracker" ], "component_items": [ { "name": "map", "type": "registry:ui", "title": "Map", "description": "A MapLibre-powered map component with markers, popups, tooltips, routes, and controls." }, { "name": "analytics-map", "type": "registry:block", "title": "Analytics Map", "description": "Real-time analytics overview with a world map, breakdown cards, and device stats." }, { "name": "choropleth", "type": "registry:block", "title": "Choropleth", "description": "World choropleth map shading countries by a metric, with a hover tooltip and legend." }, { "name": "uptime-monitor", "type": "registry:block", "title": "Uptime Monitor", "description": "Status-page style map of edge network locations with live health, latency, and uptime." }, { "name": "logistics-network", "type": "registry:block", "title": "Logistics Network", "description": "Domestic logistics map with a sidebar of stats." }, { "name": "store-locator", "type": "registry:block", "title": "Store Locator", "description": "Searchable store list synced with map markers." }, { "name": "heatmap", "type": "registry:block", "title": "Heatmap", "description": "Globe-projected heatmap visualizing earthquake density with zoom-dependent styling." }, { "name": "delivery-tracker", "type": "registry:block", "title": "Delivery Tracker", "description": "Live order tracking with route progress, courier position, and order details." } ], "component_count": 8, "components_truncated": false, "component_types": { "registry:ui": 1, "registry:block": 7 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 101, "name": "@mksingh", "category": "Personal/portfolio registry", "tags": [ "components" ], "tagline": "A personal registry of production-ready ShadCN components and utilities. Everything is built to drop into your existing ShadCN project with no extra setup.", "short_description": "A personal registry of production-ready ShadCN components and utilities. Everything is built to drop into your existing ShadCN project with no extra setup.", "description": "mksingh.dev is the personal shadcn/ui registry of Mukesh Singh, a Staff Software Engineer working across Rust, TypeScript, and Go. The registry documents ReactJS components, hooks, JSON form renderers, and TanStack integrations alongside notes on open-source projects including Shield (self-hosted IAM/CIAM in Rust inspired by Google Zanzibar) and TypeSense UI (a UI layer for Typesense search). Focused on production-ready, drop-in additions with no extra setup required for existing shadcn projects. Use for: borrowing specific utilities, form renderers, or search-UI primitives from a senior engineer's personal collection when the standard shadcn set is insufficient.", "homepage": "https://mksingh.dev/docs", "docs": "https://mksingh.dev/docs", "github": "https://github.com/mksinghdev/ui", "components_github": null, "github_default_branch": "trunk", "github_stars": 0, "last_commit": "2023-12-29T06:19:10Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://mksingh.dev/r/{name}.json", "registry_index": "https://mksingh.dev/r/registry.json", "components": [ "typography", "use-isomorphic-layout-effect", "use-media-query-hook", "jsonforms-anyof-string-or-enum-control", "jsonforms-array-layout", "jsonforms-boolean-control", "jsonforms-boolean-toggle-control", "jsonforms-categorization", "jsonforms-boolean-cell", "jsonforms-boolean-toggle-cell", "jsonforms-date-cell", "jsonforms-enum-cell", "jsonforms-integer-cell", "jsonforms-number-cell", "jsonforms-number-format-cell", "jsonforms-oneof-enum-cell", "jsonforms-text-cell", "jsonforms-time-cell", "jsonforms-control", "jsonforms-date-control", "jsonforms-datetime-control", "jsonforms-enum-control", "jsonforms-group", "jsonforms-horizontal-layout", "jsonforms-label", "jsonforms-number-control", "jsonforms-oneof-enum-control", "jsonforms-oneof-radio-group-control", "jsonforms-radio-group-control", "jsonforms-slider-control", "jsonforms-textarea-control", "jsonforms-time-control", "jsonforms-vertical-layout", "jsonforms-renderers", "jsonforms-utils", "tanstack-start-react-themes" ], "component_items": [ { "name": "typography", "type": "registry:component", "title": null, "description": "A polymorphic Typography component with 14 variants (hero, h1–h4, p, lead, large, small, muted, tiny, blockquote, code, error) built with cva. Renders the sema…" }, { "name": "use-isomorphic-layout-effect", "type": "registry:hook", "title": null, "description": "A React hook that provides cross-platform compatibility for useLayoutEffect, automatically falling back to useEffect on the server-side to prevent hydration mi…" }, { "name": "use-media-query-hook", "type": "registry:hook", "title": null, "description": "A React hook for responsive design that listens to CSS media queries and returns boolean values, enabling components to conditionally render content based on s…" }, { "name": "jsonforms-anyof-string-or-enum-control", "type": "registry:component", "title": null, "description": "JSONForms combobox renderer for anyOf schemas that combine enum values with a plain string type. Renders a text input with a datalist dropdown — user can pick …" }, { "name": "jsonforms-array-layout", "type": "registry:component", "title": null, "description": "JSONForms accordion-based renderer for arrays of objects. Each item renders in a collapsible panel with add, remove, and reorder controls." }, { "name": "jsonforms-boolean-control", "type": "registry:component", "title": null, "description": "JSONForms checkbox renderer for boolean type fields." }, { "name": "jsonforms-boolean-toggle-control", "type": "registry:component", "title": null, "description": "JSONForms switch/toggle renderer for boolean fields. Activated by setting options.toggle to true in the UISchema." }, { "name": "jsonforms-categorization", "type": "registry:component", "title": null, "description": "JSONForms tabs/categorization layout renderer for UISchema Categorization elements." }, { "name": "jsonforms-boolean-cell", "type": "registry:component", "title": null, "description": "JSONForms checkbox cell for boolean fields inside array table layouts." }, { "name": "jsonforms-boolean-toggle-cell", "type": "registry:component", "title": null, "description": "JSONForms switch cell for boolean fields inside array table layouts." }, { "name": "jsonforms-date-cell", "type": "registry:component", "title": null, "description": "JSONForms date cell for date fields inside array table layouts." }, { "name": "jsonforms-enum-cell", "type": "registry:component", "title": null, "description": "JSONForms select cell for enum fields inside array table layouts." }, { "name": "jsonforms-integer-cell", "type": "registry:component", "title": null, "description": "JSONForms integer cell for integer fields inside array table layouts." }, { "name": "jsonforms-number-cell", "type": "registry:component", "title": null, "description": "JSONForms number cell for number fields inside array table layouts." }, { "name": "jsonforms-number-format-cell", "type": "registry:component", "title": null, "description": "JSONForms formatted number cell for fields inside array table layouts. Displays the current value formatted; on focus switches to a raw number input." }, { "name": "jsonforms-oneof-enum-cell", "type": "registry:component", "title": null, "description": "JSONForms select cell for oneOf enum fields inside array table layouts." }, { "name": "jsonforms-text-cell", "type": "registry:component", "title": null, "description": "JSONForms text cell for string fields inside array table layouts." }, { "name": "jsonforms-time-cell", "type": "registry:component", "title": null, "description": "JSONForms time cell for time fields inside array table layouts." }, { "name": "jsonforms-control", "type": "registry:component", "title": null, "description": "JSONForms text input renderer for string type fields." }, { "name": "jsonforms-date-control", "type": "registry:component", "title": null, "description": "JSONForms date input renderer." }, { "name": "jsonforms-datetime-control", "type": "registry:component", "title": null, "description": "JSONForms datetime-local input renderer." }, { "name": "jsonforms-enum-control", "type": "registry:component", "title": null, "description": "JSONForms select/dropdown renderer for enum type fields." }, { "name": "jsonforms-group", "type": "registry:component", "title": null, "description": "JSONForms collapsible accordion renderer for UISchema Group elements." }, { "name": "jsonforms-horizontal-layout", "type": "registry:component", "title": null, "description": "JSONForms horizontal row layout renderer. Children are distributed equally." }, { "name": "jsonforms-label", "type": "registry:component", "title": null, "description": "JSONForms static label/heading renderer for UISchema Label elements." }, { "name": "jsonforms-number-control", "type": "registry:component", "title": null, "description": "JSONForms number/integer input renderer." }, { "name": "jsonforms-oneof-enum-control", "type": "registry:component", "title": null, "description": "JSONForms select renderer for oneOf enum fields. Uses withJsonFormsOneOfEnumProps so options include title/const pairs." }, { "name": "jsonforms-oneof-radio-group-control", "type": "registry:component", "title": null, "description": "JSONForms radio group renderer for oneOf enum fields. Activated by setting options.format to 'radio' in the UISchema." }, { "name": "jsonforms-radio-group-control", "type": "registry:component", "title": null, "description": "JSONForms radio group renderer for enum fields. Activated by setting options.format to 'radio' in the UISchema." }, { "name": "jsonforms-slider-control", "type": "registry:component", "title": null, "description": "JSONForms slider renderer for numeric fields with minimum/maximum defined in schema." }, { "name": "jsonforms-textarea-control", "type": "registry:component", "title": null, "description": "JSONForms multi-line textarea renderer. Activated by setting options.multi to true in the UISchema." }, { "name": "jsonforms-time-control", "type": "registry:component", "title": null, "description": "JSONForms time input renderer." }, { "name": "jsonforms-vertical-layout", "type": "registry:component", "title": null, "description": "JSONForms vertical stack layout renderer." }, { "name": "jsonforms-renderers", "type": "registry:component", "title": null, "description": "Complete set of JSONForms renderers and cells built on ShadCN. Covers all controls from @jsonforms/material-renderers: text, number, integer, boolean (checkbox…" }, { "name": "jsonforms-utils", "type": "registry:lib", "title": null, "description": "Utility functions for JSONForms — includes translateError for rendering custom error messages from JSON Schema errorMessage annotations." }, { "name": "tanstack-start-react-themes", "type": "registry:lib", "title": null, "description": "A comprehensive theme management library for TanStack React Start applications with server-side rendering support, automatic system preference detection, and s…" } ], "component_count": 36, "components_truncated": false, "component_types": { "registry:component": 32, "registry:hook": 2, "registry:lib": 2 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 102, "name": "@moleculeui", "category": "Animated components", "tags": [ "mobile", "aesthetic" ], "tagline": "A modern React component library focused on intuitive interactions and seamless user experiences.", "short_description": "A modern React component library focused on intuitive interactions and seamless user experiences.", "description": "Molecule UI is a small open-source React component library focused on interaction-heavy, mobile-style UI patterns. Components include Accordion, Checkbox, Dialog, Discussion thread, Expandable Button, Profile Menu, Swipe Row (iOS-style swipe-to-reveal actions), Voice Input, and Warp Dialog. Loaders section covers Bouncing Dots, Morphing Square, Orbital Loader, Spinning Circle, Typewriter, and Wave Loader. Typography includes Word Rotate. Built with Tailwind CSS and Radix UI primitives; WCAG-compliant with ARIA attributes and keyboard navigation. Use for: adding swipe gestures, voice input UI, and mobile-inspired interaction patterns to a React/shadcn project where standard components feel too desktop-centric.", "homepage": "https://www.moleculeui.design/", "docs": "https://www.moleculeui.design/docs", "github": "https://github.com/molecule-lab/molecule-ui", "components_github": "https://github.com/molecule-lab/molecule-ui/tree/main/registry", "github_default_branch": "main", "github_stars": 36, "last_commit": "2026-01-09T10:14:32Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://www.moleculeui.design/r/{name}.json", "registry_index": null, "components": [], "component_items": [], "component_count": null, "components_truncated": false, "component_types": {}, "has_logo": true, "enrichment_errors": [ "registry_index_unresolved" ], "featured": false }, { "number": 103, "name": "@motion-primitives", "category": "Animated components", "tags": [ "aesthetic" ], "tagline": "Beautifully designed motions components. Easy copy-paste. Customizable. Open Source. Built for engineers and designers.", "short_description": "Beautifully designed motions components. Easy copy-paste. Customizable. Open Source. Built for engineers and designers.", "description": "Motion Primitives is a curated open-source library of beautifully designed, easy-to-integrate motion components built with Motion (formerly Framer Motion) and Tailwind CSS, distributed via shadcn CLI. The components directory ships primitives focused purely on animation and transition behaviors — including Blur Fade, animated transitions, gestures, and layout effects — rather than full UI widgets. Designed as a complement to shadcn/ui, not a replacement. MIT licensed; actively developed with regular new component releases. Use for: layering production-quality entrance animations, shared layout transitions, and gesture-driven interactions onto components that already exist in a shadcn/ui project.", "homepage": "https://www.motion-primitives.com", "docs": "https://www.motion-primitives.com/docs", "github": "https://github.com/ibelick/motion-primitives", "components_github": "https://github.com/ibelick/motion-primitives/tree/main/components", "github_default_branch": "main", "github_stars": 5655, "last_commit": "2026-03-19T14:09:01Z", "archived": false, "license": "MIT", "open_issues": 34, "registry_template": "https://motion-primitives.com/c/{name}.json", "registry_index": null, "components": [], "component_items": [], "component_count": null, "components_truncated": false, "component_types": {}, "has_logo": true, "enrichment_errors": [ "registry_index_unresolved" ], "featured": true }, { "number": 119, "name": "@mozaika", "category": "Uncategorized", "tags": [], "tagline": "Design systems measured from real product UIs — color roles, typography and spacing as themes installable with the shadcn CLI. Free open shelf; companion MCP server for AI coding agents.", "short_description": "", "description": "Design systems measured from real product UIs — color roles, typography and spacing as themes installable with the shadcn CLI. Free open shelf; companion MCP server for AI coding agents.", "homepage": "https://mozaika.design", "docs": null, "github": null, "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://mozaika.design/r/{name}.json", "registry_index": "https://mozaika.design/r/registry.json", "components": [ "1password", "adyen", "aesop", "airbyte", "airtable", "akiflow", "allbirds", "amie", "amplitude", "anytype", "apple-music", "appsmith", "appwrite", "arc", "are-na", "ashby", "assemblyai", "astro", "attio", "augment", "away", "axiom", "baseten", "bear", "beehiiv", "bellroy", "bento", "better-stack", "bilt", "biome", "bolt", "braintrust", "brex", "browserbase", "builder-io", "bun", "cal-com", "calendly", "calm", "canva", "cap", "capacities", "captions", "caraway", "cargo", "carrd", "cartesia", "cash-app", "census", "cerebras", "checkout-com", "chroma", "claude", "clay", "clerk", "clickhouse", "cluely", "co-star", "coda", "coder", "codesandbox", "cognition", "cohere", "coinbase", "colophon", "column", "commercial-type", "continue", "convex", "copilot-money", "cosmos", "courier", "craft", "cuberto", "cursor", "dagger", "dagster", "datadog", "daytona", "dbt", "decagon", "deel", "deepgram", "deepnote", "default", "deno", "depot", "descript", "dia", "digits", "dinamo", "doppler", "drata", "drizzle", "duolingo", "dust", "e2b", "eight-sleep", "electricsql", "elevenlabs" ], "component_items": [ { "name": "1password", "type": "registry:theme", "title": "1Password — decoded design system", "description": null }, { "name": "adyen", "type": "registry:theme", "title": "Adyen — decoded design system", "description": null }, { "name": "aesop", "type": "registry:theme", "title": "Aesop — decoded design system", "description": null }, { "name": "airbyte", "type": "registry:theme", "title": "Airbyte — decoded design system", "description": null }, { "name": "airtable", "type": "registry:theme", "title": "Airtable — decoded design system", "description": null }, { "name": "akiflow", "type": "registry:theme", "title": "Akiflow — decoded design system", "description": null }, { "name": "allbirds", "type": "registry:theme", "title": "Allbirds — decoded design system", "description": null }, { "name": "amie", "type": "registry:theme", "title": "Amie — decoded design system", "description": null }, { "name": "amplitude", "type": "registry:theme", "title": "Amplitude — decoded design system", "description": null }, { "name": "anytype", "type": "registry:theme", "title": "Anytype — decoded design system", "description": null }, { "name": "apple-music", "type": "registry:theme", "title": "Apple Music — decoded design system", "description": null }, { "name": "appsmith", "type": "registry:theme", "title": "Appsmith — decoded design system", "description": null }, { "name": "appwrite", "type": "registry:theme", "title": "Appwrite — decoded design system", "description": null }, { "name": "arc", "type": "registry:theme", "title": "Arc — decoded design system", "description": null }, { "name": "are-na", "type": "registry:theme", "title": "Are.na — decoded design system", "description": null }, { "name": "ashby", "type": "registry:theme", "title": "Ashby — decoded design system", "description": null }, { "name": "assemblyai", "type": "registry:theme", "title": "AssemblyAI — decoded design system", "description": null }, { "name": "astro", "type": "registry:theme", "title": "Astro — decoded design system", "description": null }, { "name": "attio", "type": "registry:theme", "title": "Attio — decoded design system", "description": null }, { "name": "augment", "type": "registry:theme", "title": "Augment — decoded design system", "description": null }, { "name": "away", "type": "registry:theme", "title": "Away — decoded design system", "description": null }, { "name": "axiom", "type": "registry:theme", "title": "Axiom — decoded design system", "description": null }, { "name": "baseten", "type": "registry:theme", "title": "Baseten — decoded design system", "description": null }, { "name": "bear", "type": "registry:theme", "title": "Bear — decoded design system", "description": null }, { "name": "beehiiv", "type": "registry:theme", "title": "Beehiiv — decoded design system", "description": null }, { "name": "bellroy", "type": "registry:theme", "title": "Bellroy — decoded design system", "description": null }, { "name": "bento", "type": "registry:theme", "title": "Bento — decoded design system", "description": null }, { "name": "better-stack", "type": "registry:theme", "title": "Better Stack — decoded design system", "description": null }, { "name": "bilt", "type": "registry:theme", "title": "Bilt — decoded design system", "description": null }, { "name": "biome", "type": "registry:theme", "title": "Biome — decoded design system", "description": null }, { "name": "bolt", "type": "registry:theme", "title": "Bolt — decoded design system", "description": null }, { "name": "braintrust", "type": "registry:theme", "title": "Braintrust — decoded design system", "description": null }, { "name": "brex", "type": "registry:theme", "title": "Brex — decoded design system", "description": null }, { "name": "browserbase", "type": "registry:theme", "title": "Browserbase — decoded design system", "description": null }, { "name": "builder-io", "type": "registry:theme", "title": "Builder.io — decoded design system", "description": null }, { "name": "bun", "type": "registry:theme", "title": "Bun — decoded design system", "description": null }, { "name": "cal-com", "type": "registry:theme", "title": "Cal.com — decoded design system", "description": null }, { "name": "calendly", "type": "registry:theme", "title": "Calendly — decoded design system", "description": null }, { "name": "calm", "type": "registry:theme", "title": "Calm — decoded design system", "description": null }, { "name": "canva", "type": "registry:theme", "title": "Canva — decoded design system", "description": null }, { "name": "cap", "type": "registry:theme", "title": "Cap — decoded design system", "description": null }, { "name": "capacities", "type": "registry:theme", "title": "Capacities — decoded design system", "description": null }, { "name": "captions", "type": "registry:theme", "title": "Captions — decoded design system", "description": null }, { "name": "caraway", "type": "registry:theme", "title": "Caraway — decoded design system", "description": null }, { "name": "cargo", "type": "registry:theme", "title": "Cargo — decoded design system", "description": null }, { "name": "carrd", "type": "registry:theme", "title": "Carrd — decoded design system", "description": null }, { "name": "cartesia", "type": "registry:theme", "title": "Cartesia — decoded design system", "description": null }, { "name": "cash-app", "type": "registry:theme", "title": "Cash App — decoded design system", "description": null }, { "name": "census", "type": "registry:theme", "title": "Census — decoded design system", "description": null }, { "name": "cerebras", "type": "registry:theme", "title": "Cerebras — decoded design system", "description": null }, { "name": "checkout-com", "type": "registry:theme", "title": "Checkout.com — decoded design system", "description": null }, { "name": "chroma", "type": "registry:theme", "title": "Chroma — decoded design system", "description": null }, { "name": "claude", "type": "registry:theme", "title": "Claude — decoded design system", "description": null }, { "name": "clay", "type": "registry:theme", "title": "Clay — decoded design system", "description": null }, { "name": "clerk", "type": "registry:theme", "title": "Clerk — decoded design system", "description": null }, { "name": "clickhouse", "type": "registry:theme", "title": "ClickHouse — decoded design system", "description": null }, { "name": "cluely", "type": "registry:theme", "title": "Cluely — decoded design system", "description": null }, { "name": "co-star", "type": "registry:theme", "title": "Co-Star — decoded design system", "description": null }, { "name": "coda", "type": "registry:theme", "title": "Coda — decoded design system", "description": null }, { "name": "coder", "type": "registry:theme", "title": "Coder — decoded design system", "description": null } ], "component_count": 351, "components_truncated": true, "component_types": { "registry:theme": 351 }, "has_logo": true, "enrichment_errors": [ "docs_unresolved", "github_unresolved" ], "featured": false }, { "number": 104, "name": "@mui-treasury", "category": "Design system", "tags": [ "aesthetic", "components" ], "tagline": "A collection of hand-crafted interfaces built on top of MUI components", "short_description": "A collection of hand-crafted interfaces built on top of MUI components", "description": "MUI Treasury is a collection of hand-crafted, extended UI patterns and components built on top of Material UI (MUI v5/v6), addressing design gaps left by the core MUI library — refined shadows, monochromatic palettes, pure-black dark mode, icon variants, and elevated header/navigation patterns. It provides an optional CLI for adding components. Built around MUI's CSS variable theming, Emotion, and Material Design tokens rather than Tailwind. Open source. Use for: MUI-based React apps that need polished, opinionated extensions to the default Material Design system without switching to a Tailwind-first stack.", "homepage": "https://www.mui-treasury.com", "docs": "https://www.mui-treasury.com", "github": "https://github.com/siriwatknp/mui-treasury", "components_github": null, "github_default_branch": "master", "github_stars": 2443, "last_commit": "2026-05-22T09:10:00Z", "archived": false, "license": null, "open_issues": 39, "registry_template": "https://mui-treasury.com/r/{name}.json", "registry_index": "https://mui-treasury.com/r/registry.json", "components": [ "accordion-mui-treasury", "ai-actions", "ai-artifact", "ai-branch", "ai-chain-of-thought", "ai-code-block", "ai-context", "ai-conversation", "ai-elements", "ai-image", "ai-inline-citation", "ai-loader", "ai-message", "ai-open-in-chat", "ai-prompt-input", "ai-reasoning", "ai-response", "ai-sources", "ai-suggestion", "ai-task", "ai-tool", "ai-web-preview", "alert-mui-treasury", "app-analytics", "app-bar-mui-treasury", "app-footer-01", "app-messenger", "app-react-legacy", "app-shopping-cart", "autocomplete-mui-treasury", "avatar-mui-treasury", "badge-mui-treasury", "breadcrumbs-mui-treasury", "button-group-mui-treasury", "button-mui-treasury", "call-volume-trends", "card-action-01", "card-action-02", "card-blog", "card-engagement", "card-galaxy", "card-highlight", "card-kanban", "card-music", "card-news", "card-news2", "card-news3", "card-offer", "card-post", "card-preview-01", "card-profile", "card-project", "card-review", "card-review2", "card-reward", "card-social", "card-solid-game", "card-sysi", "card-tag", "card-team", "card-tutor", "carousel-css-01", "checkbox-mui-treasury", "chip-mui-treasury", "collapsible", "collapsible-icon", "color-picker-field", "color-scheme-select-basic", "color-scheme-select-icon", "color-scheme-select-minimal", "color-scheme-tabs-basic", "command-search-ui", "customer-metrics-card", "dashboard-sidebar", "data-metrics", "database-metrics-card", "dialog-mui-treasury", "dropzone-01", "file-upload-field", "firebase-analyze-image", "firebase-chat-transport", "firebase-generate-text", "firebase-google-search", "firebase-image-generation", "firebase-story-telling", "firebase-thinking-model", "firebase-tool-calling", "info-apex", "info-basic", "info-beats", "info-blog", "info-chatz", "info-n01", "info-n02", "info-n03", "info-n04", "keycap-01", "layout-core", "layout-docs-edge-sidebar", "layout-docs-footer" ], "component_items": [ { "name": "accordion-mui-treasury", "type": "registry:item", "title": "Accordion (MUI Treasury)", "description": "Accordion styled with the MUI Treasury theme — install the theme alongside." }, { "name": "ai-actions", "type": "registry:item", "title": "AI Actions", "description": "Interactive AI action components" }, { "name": "ai-artifact", "type": "registry:item", "title": "AI Artifact", "description": "A container component for displaying artifacts with header, actions, and content areas" }, { "name": "ai-branch", "type": "registry:item", "title": "Ai Branch", "description": "A ai-branch item." }, { "name": "ai-chain-of-thought", "type": "registry:item", "title": "AI Chain of Thought", "description": "Component for displaying AI reasoning steps with collapsible content" }, { "name": "ai-code-block", "type": "registry:item", "title": "Ai Code Block", "description": "A ai-code-block item." }, { "name": "ai-context", "type": "registry:item", "title": "Ai Context", "description": "A ai-context item." }, { "name": "ai-conversation", "type": "registry:item", "title": "Ai Conversation", "description": "A ai-conversation item." }, { "name": "ai-elements", "type": "registry:item", "title": "AI Elements", "description": "All AI Elements from MUI Treasury" }, { "name": "ai-image", "type": "registry:item", "title": "Ai Image", "description": "A ai-image item." }, { "name": "ai-inline-citation", "type": "registry:item", "title": "Ai Inline Citation", "description": "A ai-inline-citation item." }, { "name": "ai-loader", "type": "registry:item", "title": "Ai Loader", "description": "A ai-loader item." }, { "name": "ai-message", "type": "registry:item", "title": "Ai Message", "description": "A ai-message item." }, { "name": "ai-open-in-chat", "type": "registry:item", "title": "Ai Open In Chat", "description": "A ai-open-in-chat item." }, { "name": "ai-prompt-input", "type": "registry:item", "title": "Ai Prompt Input", "description": "A ai-prompt-input item." }, { "name": "ai-reasoning", "type": "registry:item", "title": "Ai Reasoning", "description": "A ai-reasoning item." }, { "name": "ai-response", "type": "registry:item", "title": "Ai Response", "description": "A ai-response item." }, { "name": "ai-sources", "type": "registry:item", "title": "Ai Sources", "description": "A ai-sources item." }, { "name": "ai-suggestion", "type": "registry:item", "title": "Ai Suggestion", "description": "A ai-suggestion item." }, { "name": "ai-task", "type": "registry:item", "title": "Ai Task", "description": "A ai-task item." }, { "name": "ai-tool", "type": "registry:item", "title": "Ai Tool", "description": "A ai-tool item." }, { "name": "ai-web-preview", "type": "registry:item", "title": "Ai Web Preview", "description": "A ai-web-preview item." }, { "name": "alert-mui-treasury", "type": "registry:item", "title": "Alert (MUI Treasury)", "description": "Alert styled with the MUI Treasury theme — install the theme alongside." }, { "name": "app-analytics", "type": "registry:item", "title": "App Analytics", "description": "A app-analytics item." }, { "name": "app-bar-mui-treasury", "type": "registry:item", "title": "App Bar (MUI Treasury)", "description": "App Bar styled with the MUI Treasury theme — install the theme alongside." }, { "name": "app-footer-01", "type": "registry:item", "title": "App Footer 01", "description": "A responsive footer component with logo, social media links, and multi-column navigation" }, { "name": "app-messenger", "type": "registry:item", "title": "App Messenger", "description": "A app-messenger item." }, { "name": "app-react-legacy", "type": "registry:item", "title": "App React Legacy", "description": "A app-react-legacy item." }, { "name": "app-shopping-cart", "type": "registry:item", "title": "App Shopping Cart", "description": "A app-shopping-cart item." }, { "name": "autocomplete-mui-treasury", "type": "registry:item", "title": "Autocomplete (MUI Treasury)", "description": "Autocomplete styled with the MUI Treasury theme — install the theme alongside." }, { "name": "avatar-mui-treasury", "type": "registry:item", "title": "Avatar (MUI Treasury)", "description": "Avatar styled with the MUI Treasury theme — install the theme alongside." }, { "name": "badge-mui-treasury", "type": "registry:item", "title": "Badge (MUI Treasury)", "description": "Badge styled with the MUI Treasury theme — install the theme alongside." }, { "name": "breadcrumbs-mui-treasury", "type": "registry:item", "title": "Breadcrumbs (MUI Treasury)", "description": "Breadcrumbs styled with the MUI Treasury theme — install the theme alongside." }, { "name": "button-group-mui-treasury", "type": "registry:item", "title": "Button Group (MUI Treasury)", "description": "Button Group styled with the MUI Treasury theme — install the theme alongside." }, { "name": "button-mui-treasury", "type": "registry:item", "title": "Button (MUI Treasury)", "description": "Button styled with the MUI Treasury theme — install the theme alongside." }, { "name": "call-volume-trends", "type": "registry:item", "title": "Call Volume Trends", "description": "A call-volume-trends block." }, { "name": "card-action-01", "type": "registry:item", "title": "Card Action 01", "description": "Card with full-bleed background, heading text overlay, and floating circular add button in bottom-right corner with hover scale effect" }, { "name": "card-action-02", "type": "registry:item", "title": "Card Action 02", "description": "Card with branded icon, large heading, description text, and floating circular add button with customizable props" }, { "name": "card-blog", "type": "registry:item", "title": "Card Blog", "description": "Blog card with image featuring gradient overlay, Info components for eyebrow/title/subtitle, and gradient CTA button" }, { "name": "card-engagement", "type": "registry:item", "title": "Card Engagement", "description": "Card with landscape image, Info title/subtitle, and AvatarGroup footer showing participant avatars" }, { "name": "card-galaxy", "type": "registry:item", "title": "Card Galaxy", "description": "Card with full-height background image, bottom gradient overlay, and white text Info components positioned at bottom" }, { "name": "card-highlight", "type": "registry:item", "title": "Card Highlight", "description": "Card with game branding, cover image, gradient overlay, logo avatar with hover scale, and date badge" }, { "name": "card-kanban", "type": "registry:item", "title": "Card Kanban", "description": "Compact horizontal card with avatar, user name, location info, and progress slider showing completion status" }, { "name": "card-music", "type": "registry:item", "title": "Card Music", "description": "Music card with rounded album artwork and Info components displaying artist/title/description using N04 styles" }, { "name": "card-news", "type": "registry:item", "title": "Card News", "description": "News card with image, Info components using N01 styles, and 'Find Out More' button with hover scale effect" }, { "name": "card-news2", "type": "registry:item", "title": "Card News2", "description": "Full-bleed image card with centered white text heading and explore label, positioned absolutely over background" }, { "name": "card-news3", "type": "registry:item", "title": "Card News3", "description": "News card with image overlay, gradient backdrop, fashion tag badge, author info with avatar, and layered shadow effect on hover" }, { "name": "card-offer", "type": "registry:item", "title": "Card Offer", "description": "Promotional card with cyan background, decorative bow image, circular background elements, and 'Learn more' button" }, { "name": "card-post", "type": "registry:item", "title": "Card Post", "description": "Social post card with clipped polygon image, positioned avatar overlay, Info title/subtitle, and share/like action buttons" }, { "name": "card-preview-01", "type": "registry:item", "title": "Card Preview 01", "description": "Preview card using Base UI PreviewCard with hover popup displaying content preview and Material UI styling" }, { "name": "card-profile", "type": "registry:item", "title": "Card Profile", "description": "Profile card with centered avatar, name/location info, and followers/following stats displayed in divided columns" }, { "name": "card-project", "type": "registry:item", "title": "Card Project", "description": "Project card with brand logo, time indicator, and Info components using Blog styles for title/subtitle" }, { "name": "card-review", "type": "registry:item", "title": "Card Review", "description": "Review card with image, star rating, location info, and avatar group showing reviewers" }, { "name": "card-review2", "type": "registry:item", "title": "Card Review2", "description": "Magazine-style review card with image, star rating, content excerpt, and comment/view/share metrics" }, { "name": "card-reward", "type": "registry:item", "title": "Card Reward", "description": "Purple gradient reward card with trophy image, contest title, date range, and 'Enter Now' button" }, { "name": "card-social", "type": "registry:item", "title": "Card Social", "description": "Social connection card with avatar, user name, mutual friends count, and follow button" }, { "name": "card-solid-game", "type": "registry:item", "title": "Card Solid Game", "description": "Game cards with solid color backgrounds, logo images, game titles, and hover shadow/scale animations" }, { "name": "card-sysi", "type": "registry:item", "title": "Card Sysi", "description": "Program enrollment card with Thai content, Info components, and dual 'Learn more' / 'Apply now' buttons" }, { "name": "card-tag", "type": "registry:item", "title": "Card Tag", "description": "Decorative tag-shaped card with hole punch cutout design for menu items or categories" }, { "name": "card-team", "type": "registry:item", "title": "Card Team", "description": "Team group cards with cover images, avatar groups, member counts, and join/leave action buttons with gradient styling" } ], "component_count": 192, "components_truncated": true, "component_types": { "registry:item": 185, "registry:block": 6, "registry:hook": 1 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 105, "name": "@ncdai", "category": "Personal/portfolio registry", "tags": [ "dashboard", "aesthetic" ], "tagline": "Pixel-perfect, uniquely crafted.", "short_description": "Pixel-perfect, uniquely crafted.", "description": "ncdai is the personal shadcn/ui registry embedded in Chanh Dai's developer portfolio site (chanhdai.com), built with Next.js 16 and Tailwind CSS v4. The registry exposes pixel-perfect, uniquely crafted components and pages documented with live previews, code snippets, and one-click install commands (pnpm/npm/yarn/bun). The portfolio itself demonstrates the registry's quality: light/dark themes, vCard integration, PWA support, PostHog/OpenPanel analytics, and MDX-powered content. MIT licensed — code is free to use after removing personal information. Use for: borrowing high-craft, design-engineer-level shadcn components that show attention to pixel-perfect detail and Tailwind v4 patterns.", "homepage": "https://chanhdai.com/components", "docs": "https://chanhdai.com/components", "github": "https://github.com/ncdai/chanhdai.com", "components_github": "https://github.com/ncdai/chanhdai.com/tree/main/src/registry", "github_default_branch": "main", "github_stars": 2110, "last_commit": "2026-07-08T02:43:33Z", "archived": false, "license": "MIT", "open_issues": 2, "registry_template": "https://chanhdai.com/r/{name}.json", "registry_index": "https://chanhdai.com/r/registry.json", "components": [ "haptic", "use-sound", "use-controllable-state", "theme-switcher", "text-flip", "apple-hello-effect", "apple-hello-effect-hindi", "apple-hello-effect-spanish", "apple-hello-effect-vietnamese", "wheel-picker", "chevrons-up-down-icon", "typography", "work-experience", "shimmering-text", "slide-to-unlock", "testimonials-marquee", "testimonial", "github-stars", "scroll-fade-effect", "consent-manager", "copy-button", "code-block-command", "testimonial-spotlight", "glow-card-grid", "middle-truncation", "twemoji", "elastic-slider", "contribution-graph", "github-contributions", "toc-minimap", "fluid-gradient-text", "brand-assets-menu", "icon-swap", "dot-grid-spotlight", "spinning-circular-text", "mobius-loop-icon", "logos-carousel", "testimonial-2", "line-nav", "share-menu", "spotlight-logo", "login-01", "hero-01", "blog-01", "blog-02", "testimonials-01", "testimonials-02", "experience-01", "team-01", "metrics-01", "social-links-01", "social-proof-01", "style", "theme-toggle-effect-triangle", "theme-toggle-effect-triangle-blur", "theme-toggle-effect-circle", "theme-toggle-effect-circle-blur", "theme-toggle-effect-circle-blur-top-left", "theme-toggle-effect-polygon", "theme-toggle-effect-polygon-gradient", "thin-scrollbar" ], "component_items": [ { "name": "haptic", "type": "registry:lib", "title": "Haptic Feedback", "description": "Trigger haptic feedback on mobile devices." }, { "name": "use-sound", "type": "registry:hook", "title": "useSound", "description": "Hook for playing sound effects with volume, playback rate, and interrupt controls." }, { "name": "use-controllable-state", "type": "registry:hook", "title": "useControllableState", "description": null }, { "name": "theme-switcher", "type": "registry:component", "title": "Theme Switcher", "description": "Toggle between system, light, and dark themes in Next.js apps." }, { "name": "text-flip", "type": "registry:component", "title": "Text Flip", "description": "Animated text that cycles through items with a smooth flip transition." }, { "name": "apple-hello-effect", "type": "registry:component", "title": "Apple Hello Effect", "description": "SVG writing animation inspired by Apple’s Hello screen." }, { "name": "apple-hello-effect-hindi", "type": "registry:component", "title": "Apple Hello Effect - Hindi", "description": "SVG writing animation inspired by Apple’s Hello screen." }, { "name": "apple-hello-effect-spanish", "type": "registry:component", "title": "Apple Hello Effect - Spanish", "description": "SVG writing animation inspired by Apple’s Hello screen." }, { "name": "apple-hello-effect-vietnamese", "type": "registry:component", "title": "Apple Hello Effect - Vietnamese", "description": "SVG writing animation inspired by Apple’s Hello screen." }, { "name": "wheel-picker", "type": "registry:component", "title": "Wheel Picker", "description": "iOS-like wheel picker for React with smooth inertia scrolling and infinite loop support." }, { "name": "chevrons-up-down-icon", "type": "registry:component", "title": null, "description": "Animated chevrons icon that morphs between up and down directions." }, { "name": "typography", "type": "registry:component", "title": "Typography", "description": "Custom prose styles for headings, links, inline code, and emphasis." }, { "name": "work-experience", "type": "registry:component", "title": "Work Experience", "description": "Display work experiences with role details, company logos, and durations." }, { "name": "shimmering-text", "type": "registry:component", "title": "Shimmering Text", "description": "Smooth, light-sweeping shimmer animation for text." }, { "name": "slide-to-unlock", "type": "registry:component", "title": "Slide to Unlock", "description": "Interactive slider inspired by the classic iPhone “slide to unlock” gesture." }, { "name": "testimonials-marquee", "type": "registry:component", "title": "Testimonials Marquee", "description": "Scrolling marquee to showcase user testimonials." }, { "name": "testimonial", "type": "registry:component", "title": "Testimonial", "description": "Display user feedback with author info, avatar, and verified badge." }, { "name": "github-stars", "type": "registry:component", "title": "GitHub Stars", "description": "Display GitHub repo star count with formatted numbers and full-count tooltip." }, { "name": "scroll-fade-effect", "type": "registry:component", "title": "Scroll Fade Effect", "description": "Fade content edges as you scroll, for both vertical and horizontal layouts." }, { "name": "consent-manager", "type": "registry:component", "title": "Consent Manager", "description": "Cookie and tracking consent banner for Next.js, built on c15t." }, { "name": "copy-button", "type": "registry:component", "title": "Copy Button", "description": "Copy text to clipboard with visual, haptic, and audio feedback." }, { "name": "code-block-command", "type": "registry:component", "title": "Code Block Command", "description": "Display install commands with package manager switcher and copy button." }, { "name": "testimonial-spotlight", "type": "registry:component", "title": "Testimonial Spotlight", "description": "Testimonial card with spotlight effect on hover." }, { "name": "glow-card-grid", "type": "registry:component", "title": "Glow Card Grid", "description": "Display cards with glowing border and background effects." }, { "name": "middle-truncation", "type": "registry:component", "title": "Middle Truncation", "description": "Truncate text in the middle while preserving start and end." }, { "name": "twemoji", "type": "registry:component", "title": "Twemoji", "description": "Render Unicode emoji as Twemoji SVG images inline with text." }, { "name": "elastic-slider", "type": "registry:component", "title": "Elastic Slider", "description": "Slider with elastic rubber-band drag and magnetic snap feedback." }, { "name": "contribution-graph", "type": "registry:component", "title": "Contribution Graph", "description": "A GitHub-style contribution graph component that displays activity levels over time." }, { "name": "github-contributions", "type": "registry:component", "title": "GitHub Contributions", "description": "Visualize year-long GitHub contribution activity with daily counts, tooltips, and a profile link." }, { "name": "toc-minimap", "type": "registry:component", "title": "TOC Minimap", "description": "Navigate page sections with a compact, hoverable TOC minimap." }, { "name": "fluid-gradient-text", "type": "registry:component", "title": "Fluid Gradient Text", "description": "Render text with a fluid gradient that shifts with pointer movement." }, { "name": "brand-assets-menu", "type": "registry:component", "title": "Brand Assets Menu", "description": "Context menu for copying brand SVGs and opening asset links." }, { "name": "icon-swap", "type": "registry:component", "title": "Icon Swap", "description": "Animate icon swaps with scale, blur, and fade transitions." }, { "name": "dot-grid-spotlight", "type": "registry:component", "title": "Dot Grid Spotlight", "description": "Interactive dot grid with a cursor-tracking spotlight effect." }, { "name": "spinning-circular-text", "type": "registry:component", "title": "Spinning Circular Text", "description": "Text arranged in a circle with a continuous spinning animation." }, { "name": "mobius-loop-icon", "type": "registry:component", "title": "Mobius Loop Icon", "description": "Animated Mobius loop icon that morphs between circles and infinity shape." }, { "name": "logos-carousel", "type": "registry:component", "title": "Logos Carousel", "description": "Cycle through logos column by column in a staggered wave." }, { "name": "testimonial-2", "type": "registry:component", "title": "Testimonial 2", "description": "Display a testimonial quote with author attribution and source link." }, { "name": "line-nav", "type": "registry:component", "title": "Line Nav", "description": "Vertical navigation with a line marker that expands on hover and active state." }, { "name": "share-menu", "type": "registry:component", "title": "Share Menu", "description": "Share menu to copy a link or post to X, LinkedIn, and the native share sheet." }, { "name": "spotlight-logo", "type": "registry:component", "title": "Spotlight Logo", "description": "SVG logo with a cursor-tracking gradient highlight and tactile press." }, { "name": "login-01", "type": "registry:block", "title": "Login 01", "description": "A simple login form." }, { "name": "hero-01", "type": "registry:block", "title": "Hero 01", "description": "A hero section with a golden spiral background." }, { "name": "blog-01", "type": "registry:block", "title": "Blog 01", "description": "A blog section with a grid layout." }, { "name": "blog-02", "type": "registry:block", "title": "Blog 02", "description": "A blog section with a lined grid layout." }, { "name": "testimonials-01", "type": "registry:block", "title": "Testimonials 01", "description": "A testimonials section with dual marquees." }, { "name": "testimonials-02", "type": "registry:block", "title": "Testimonials 02", "description": "A testimonials section with a lined layout." }, { "name": "experience-01", "type": "registry:block", "title": "Experience 01", "description": "A work experience section with a lined layout." }, { "name": "team-01", "type": "registry:block", "title": "Team 01", "description": "A team section with glowing cards." }, { "name": "metrics-01", "type": "registry:block", "title": "Metrics 01", "description": "A metrics section with a line chart." }, { "name": "social-links-01", "type": "registry:block", "title": "Social Links 01", "description": "A social links section with a lined grid layout." }, { "name": "social-proof-01", "type": "registry:block", "title": "Social Proof 01", "description": "A social proof section with a logos carousel." }, { "name": "style", "type": "registry:style", "title": null, "description": null }, { "name": "theme-toggle-effect-triangle", "type": "registry:style", "title": null, "description": null }, { "name": "theme-toggle-effect-triangle-blur", "type": "registry:style", "title": null, "description": null }, { "name": "theme-toggle-effect-circle", "type": "registry:style", "title": null, "description": null }, { "name": "theme-toggle-effect-circle-blur", "type": "registry:style", "title": null, "description": null }, { "name": "theme-toggle-effect-circle-blur-top-left", "type": "registry:style", "title": null, "description": null }, { "name": "theme-toggle-effect-polygon", "type": "registry:style", "title": null, "description": null }, { "name": "theme-toggle-effect-polygon-gradient", "type": "registry:style", "title": null, "description": null } ], "component_count": 61, "components_truncated": false, "component_types": { "registry:lib": 1, "registry:hook": 2, "registry:component": 38, "registry:block": 11, "registry:style": 9 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 106, "name": "@neobrutalism", "category": "Component library (general)", "tags": [ "dashboard", "aesthetic", "components" ], "tagline": "A collection of neobrutalism-styled components based on shadcn/ui", "short_description": "A collection of neobrutalism-styled components based on shadcn/ui", "description": "A collection of neobrutalism-styled React components built on shadcn/ui, covering 40+ components including Accordion, Alert Dialog, Avatar, Badge, Button, Calendar, Card, Carousel, Chart, Checkbox, Command, Combobox, Context Menu, Data Table, Date Picker, Dialog, Drawer, Dropdown Menu, Form, Hover Card, Input OTP, Label, Marquee, Menubar, Navigation Menu, Pagination, Popover, Progress, Radio Group, Resizable, Scroll Area, Select, Sheet, Sidebar, Skeleton, Slider, Switch, Table, Tabs, Textarea, and Tooltip. Uses Tailwind CSS and follows shadcn/ui conventions. The repo is no longer actively maintained (archived post-v3). Free and MIT-licensed. Use for: projects requiring a bold, retro-brutalist aesthetic with a full shadcn-compatible component set.", "homepage": "https://www.neobrutalism.dev", "docs": "https://www.neobrutalism.dev/docs", "github": "https://github.com/ekmas/neobrutalism-components", "components_github": "https://github.com/ekmas/neobrutalism-components/tree/main/src/components", "github_default_branch": "main", "github_stars": 5243, "last_commit": "2026-05-10T01:28:00Z", "archived": false, "license": "MIT", "open_issues": 11, "registry_template": "https://www.neobrutalism.dev/r/{name}.json", "registry_index": null, "components": [], "component_items": [], "component_count": null, "components_truncated": false, "component_types": {}, "has_logo": true, "enrichment_errors": [ "registry_index_unresolved" ], "featured": false }, { "number": 107, "name": "@nessra-ui", "category": "Component library (general)", "tags": [ "components" ], "tagline": "Beautiful, accessible components built with Tailwind CSS v4 and Radix UI. Includes auth blocks, data tables, and TanStack Form integration.", "short_description": "Beautiful, accessible components built with Tailwind CSS v4 and Radix UI. Includes auth blocks, data tables, and TanStack Form integration.", "description": "A production-ready registry of 60+ React and Next.js components built on Radix UI primitives with Tailwind CSS v4, strictly typed with TypeScript. Covers standard UI (Accordion through Tooltip), plus extras like Button Group, Code Block, Copy Button, Empty Field, Input Group, Number Input, Spinner, Stat Card, Tag Input, Toggle Group, and Typography. Auth blocks include Sign In, Sign Up, Forgot Password, and Reset Password flows. Also includes a TanStack Form integration and a Data Table. Accessible by default with full keyboard navigation; no runtime dependency. Use for: app scaffolding that needs accessible Radix-based components on Tailwind v4 without a paid tier.", "homepage": "https://nessra-ui.vercel.app", "docs": "https://nessra-ui.vercel.app/docs", "github": "https://github.com/codewithmehmet/nessra-ui", "components_github": "https://github.com/codewithmehmet/nessra-ui/tree/main/registry", "github_default_branch": "main", "github_stars": 1, "last_commit": "2026-05-01T07:36:33Z", "archived": false, "license": "MIT", "open_issues": 1, "registry_template": "https://nessra-ui.vercel.app/r/{name}.json", "registry_index": "https://nessra-ui.vercel.app/r/registry.json", "components": [ "utils", "use-mobile", "button", "card", "input", "label", "form", "textarea", "select", "checkbox", "switch", "dialog", "alert-dialog", "dropdown-menu", "tabs", "accordion", "avatar", "badge", "separator", "tooltip", "collapsible", "code-block", "alert", "progress", "sheet", "sonner", "popover", "skeleton", "slider", "scroll-area", "radio-group", "toggle", "aspect-ratio", "hover-card", "breadcrumb", "pagination", "table", "tag-input", "command", "copy-button", "drawer", "calendar", "date-picker", "data-table", "spinner", "empty", "typography", "toggle-group", "button-group", "field", "input-group", "combobox", "sidebar", "input-otp", "number-input", "chart", "stat-card", "dashboard-stats", "signin-form", "signup-form", "forgot-password-form", "reset-password-form" ], "component_items": [ { "name": "utils", "type": "registry:lib", "title": null, "description": null }, { "name": "use-mobile", "type": "registry:hook", "title": null, "description": null }, { "name": "button", "type": "registry:ui", "title": "Button", "description": "Displays a button or a component that looks like a button." }, { "name": "card", "type": "registry:ui", "title": "Card", "description": "Displays a card with header, content, and footer." }, { "name": "input", "type": "registry:ui", "title": "Input", "description": "Displays a form input field." }, { "name": "label", "type": "registry:ui", "title": "Label", "description": "Renders an accessible label associated with controls." }, { "name": "form", "type": "registry:ui", "title": "Form", "description": "Form field components for building accessible forms with TanStack Form." }, { "name": "textarea", "type": "registry:ui", "title": "Textarea", "description": "Displays a form textarea." }, { "name": "select", "type": "registry:ui", "title": "Select", "description": "Displays a list of options for the user to pick from." }, { "name": "checkbox", "type": "registry:ui", "title": "Checkbox", "description": "A control that allows the user to toggle between checked and not checked." }, { "name": "switch", "type": "registry:ui", "title": "Switch", "description": "A control that allows the user to toggle between on and off." }, { "name": "dialog", "type": "registry:ui", "title": "Dialog", "description": "A window overlaid on the primary window." }, { "name": "alert-dialog", "type": "registry:ui", "title": "Alert Dialog", "description": "A modal dialog that interrupts the user with important content." }, { "name": "dropdown-menu", "type": "registry:ui", "title": "Dropdown Menu", "description": "Displays a menu to the user with a list of actions or options." }, { "name": "tabs", "type": "registry:ui", "title": "Tabs", "description": "A set of layered sections of content, known as tab panels." }, { "name": "accordion", "type": "registry:ui", "title": "Accordion", "description": "A vertically stacked set of interactive headings." }, { "name": "avatar", "type": "registry:ui", "title": "Avatar", "description": "An image element with a fallback for representing the user." }, { "name": "badge", "type": "registry:ui", "title": "Badge", "description": "Displays a badge or a component that looks like a badge." }, { "name": "separator", "type": "registry:ui", "title": "Separator", "description": "Visually separates content." }, { "name": "tooltip", "type": "registry:ui", "title": "Tooltip", "description": "A popup that displays information related to an element." }, { "name": "collapsible", "type": "registry:ui", "title": "Collapsible", "description": "An interactive component which expands/collapses a panel." }, { "name": "code-block", "type": "registry:ui", "title": "Code Block", "description": "Display code with syntax highlighting powered by Shiki." }, { "name": "alert", "type": "registry:ui", "title": "Alert", "description": "Displays a callout for user attention." }, { "name": "progress", "type": "registry:ui", "title": "Progress", "description": "Displays an indicator showing the completion progress of a task." }, { "name": "sheet", "type": "registry:ui", "title": "Sheet", "description": "Extends the Dialog component to display content that complements the main content of the screen." }, { "name": "sonner", "type": "registry:ui", "title": "Sonner", "description": "An opinionated toast component for React." }, { "name": "popover", "type": "registry:ui", "title": "Popover", "description": "Displays rich content in a portal, triggered by a button." }, { "name": "skeleton", "type": "registry:ui", "title": "Skeleton", "description": "Use to show a placeholder while content is loading." }, { "name": "slider", "type": "registry:ui", "title": "Slider", "description": "An input where the user selects a value from within a given range." }, { "name": "scroll-area", "type": "registry:ui", "title": "Scroll Area", "description": "Augments native scroll functionality for custom, cross-browser styling." }, { "name": "radio-group", "type": "registry:ui", "title": "Radio Group", "description": "A set of checkable buttons where only one can be checked at a time." }, { "name": "toggle", "type": "registry:ui", "title": "Toggle", "description": "A two-state button that can be either on or off." }, { "name": "aspect-ratio", "type": "registry:ui", "title": "Aspect Ratio", "description": "Displays content within a desired ratio." }, { "name": "hover-card", "type": "registry:ui", "title": "Hover Card", "description": "For sighted users to preview content available behind a link." }, { "name": "breadcrumb", "type": "registry:ui", "title": "Breadcrumb", "description": "Displays the path to the current resource using a hierarchy of links." }, { "name": "pagination", "type": "registry:ui", "title": "Pagination", "description": "Pagination with page navigation, next and previous links." }, { "name": "table", "type": "registry:ui", "title": "Table", "description": "A responsive table component for displaying data." }, { "name": "tag-input", "type": "registry:ui", "title": "Tag Input", "description": "An input for entering multiple tags with keyboard support." }, { "name": "command", "type": "registry:ui", "title": "Command", "description": "A command menu with search and keyboard navigation." }, { "name": "copy-button", "type": "registry:ui", "title": "Copy Button", "description": "A button that copies text to the clipboard with visual feedback." }, { "name": "drawer", "type": "registry:ui", "title": "Drawer", "description": "A drawer component for mobile-friendly navigation and content." }, { "name": "calendar", "type": "registry:ui", "title": "Calendar", "description": "A date field component that allows users to enter and edit date." }, { "name": "date-picker", "type": "registry:ui", "title": "Date Picker", "description": "A date picker component with range and presets." }, { "name": "data-table", "type": "registry:ui", "title": "Data Table", "description": "A powerful data table with sorting, filtering, pagination, row selection and faceted filters." }, { "name": "spinner", "type": "registry:ui", "title": "Spinner", "description": "A loading indicator for asynchronous operations." }, { "name": "empty", "type": "registry:ui", "title": "Empty", "description": "Display an empty state when no data is available." }, { "name": "typography", "type": "registry:ui", "title": "Typography", "description": "Styled text components for headings, paragraphs, lists, and more." }, { "name": "toggle-group", "type": "registry:ui", "title": "Toggle Group", "description": "A set of two-state buttons that can be toggled on or off." }, { "name": "button-group", "type": "registry:ui", "title": "Button Group", "description": "Groups related buttons together with consistent styling." }, { "name": "field", "type": "registry:ui", "title": "Field", "description": "Combine labels, controls, and help text to compose accessible form fields." }, { "name": "input-group", "type": "registry:ui", "title": "Input Group", "description": "Add addons, buttons, and helper content to inputs." }, { "name": "combobox", "type": "registry:ui", "title": "Combobox", "description": "An autocomplete input with a dropdown list of suggestions." }, { "name": "sidebar", "type": "registry:ui", "title": "Sidebar", "description": "A composable, themeable and customizable sidebar component." }, { "name": "input-otp", "type": "registry:ui", "title": "Input OTP", "description": "Accessible one-time password input with copy/paste support." }, { "name": "number-input", "type": "registry:ui", "title": "Number Input", "description": "A numeric input with increment and decrement buttons." }, { "name": "chart", "type": "registry:ui", "title": "Chart", "description": "Beautiful and responsive charts built with Recharts." }, { "name": "stat-card", "type": "registry:ui", "title": "Stat Card", "description": "Display key metrics and KPIs with value, label, icon and trend indicator." }, { "name": "dashboard-stats", "type": "registry:block", "title": "Dashboard Stats", "description": "A dashboard page with KPI stat cards, overview chart placeholder and recent sales list." }, { "name": "signin-form", "type": "registry:block", "title": "Sign In Form", "description": "A complete sign in page with email and password validation." }, { "name": "signup-form", "type": "registry:block", "title": "Sign Up Form", "description": "A complete signup page with name, email, password and confirmation." } ], "component_count": 62, "components_truncated": false, "component_types": { "registry:lib": 1, "registry:hook": 1, "registry:ui": 55, "registry:block": 5 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 108, "name": "@nexus-elements", "category": "Component library (general)", "tags": [ "components" ], "tagline": "Ready-made React components for almost any use case. Use as is or customise and go to market fast", "short_description": "Ready-made React components for almost any use case. Use as is or customise and go to market fast", "description": "Ready-made React components from Avail Project's Nexus design system, targeting Web3 and general application use cases. The registry surfaces view-focused primitives suited for data-heavy interfaces. Built with shadcn/ui conventions and Tailwind CSS. Maintained by a single developer (decocereus). Free and open source. Use for: teams building on Avail's ecosystem or needing a lightweight starting point for Web3-adjacent UIs that want shadcn CLI compatibility.", "homepage": "https://elements.nexus.availproject.org/docs/view-components", "docs": "https://elements.nexus.availproject.org/docs/view-components", "github": "https://github.com/decocereus", "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://elements.nexus.availproject.org/r/{name}.json", "registry_index": null, "components": [], "component_items": [], "component_count": null, "components_truncated": false, "component_types": {}, "has_logo": true, "enrichment_errors": [ "registry_index_unresolved", "github_lookup_failed" ], "featured": false }, { "number": 109, "name": "@nexus-labs", "category": "Commercial/paid product", "tags": [ "saas", "ai", "aesthetic" ], "tagline": "Motion-native animated components for Next.js — backgrounds, heroes, inputs, carousels, and more. Open source. Copy-ready TypeScript.", "short_description": "Motion-native animated components for Next.js — backgrounds, heroes, inputs, carousels, and more. Open source. Copy-ready TypeScript.", "description": "A premium marketplace for animated React components, full-page templates, and marketing blocks engineered for Next.js App Router with Tailwind CSS and Framer Motion. Contains 82+ components across categories: Background Effects (63+), Motion Effects (27+), Cards (13+), 3D Components, Pricing blocks, Feature grids, Logo clouds, Navbars, Footers, Login/Signup forms, Text Animations, and AI Components. Full-page templates include SaaS launch, AI startup, agency, and developer-tool themes. Freemium — base components free; premium subscription or lifetime pass required for full access and commercial license. Use for: shipping polished Next.js marketing sites or SaaS landing pages with motion-rich animated sections quickly.", "homepage": "https://nexus-ui.com", "docs": "https://nexus-ui.com/docs/installation", "github": "N/A", "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://nexus-ui.com/r/{name}.json", "registry_index": "https://nexus-ui.com/r/registry.json", "components": [ "nexus-font", "scroll-progress-bar", "wheel-selector", "cinematic-card-deck", "cursor-text-reveal", "cinematic-logo-cloud", "step-flow", "phone-input", "hero-aurora-spotlight", "bento-signal-grid", "nebula-glass-card", "float-glass-navbar", "orbit-footer", "depth-testimonials", "toggle-pricing-pro", "beam-sweep-field", "vector-tilt-scene", "glass-login-stack", "split-signup-convert", "signup-form", "workbench-sidebar", "pulse-dashboard-kpis", "orbital-loader", "milestone-timeline", "lattice-feature-grid", "motion-faq-disclosure", "nebula-cta-glow", "glow-button", "word-magnet", "three-d-folder", "draggable-card-stack", "card-carousel-3d", "real-time-cursors", "editorial-blog-rail", "split-contact-glass", "svg-noise-shader", "tracing-spotlight-panel", "forge-ai-command-bar", "gooey-input", "terminal", "squiggly-text", "floating-dock", "stateful-button", "sparkles", "text-generate-effect", "background-gradient", "typewriter-effect", "text-reveal-card", "glowing-effect-cards", "infinite-moving-cards", "meteors", "background-boxes", "encrypted-text", "mac-keyboard", "images-badge", "dot-grid-hero", "starfield-hero", "compare", "expandable-cards", "animated-select-headline", "warp-speed-card", "circular-carousel", "chat-messages", "shader-flow", "ask-nexus-input", "interactive-globe-explorer", "scroll-reveal-text", "animated-countdown", "shooting-stars-grid", "hover-highlight-text", "motion-layer-scroller", "animated-bento-grid", "bento-grid-skeleton", "scrolling-testimonials", "spectra-frame", "profile-orbit", "command-palette", "image-trail", "avatar-group", "feature-tools-card", "link-preview", "pricing-section", "logo-clouds", "sidebar", "contact-page", "blog-content-sections" ], "component_items": [ { "name": "nexus-font", "type": "registry:font", "title": "Nexus UI Inter Font", "description": "Inter font setup used by Nexus UI components so installed components match the preview typography." }, { "name": "scroll-progress-bar", "type": "registry:component", "title": "Scroll Progress Bar", "description": "A minimal vertical progress rail that fills smoothly as a target section moves through the viewport or a scrollable container." }, { "name": "wheel-selector", "type": "registry:component", "title": "Wheel Selector", "description": "An interactive radial navigation dial for services, features, or portfolio items with drag, wheel, and click input plus a responsive mobile arch." }, { "name": "cinematic-card-deck", "type": "registry:component", "title": "Cinematic Card Deck", "description": "A scroll-linked 3D card stack with depth, ambient glow, progress dots, cursor parallax, and optional image-backed cards." }, { "name": "cursor-text-reveal", "type": "registry:component", "title": "Cursor Text Reveal", "description": "An immersive cursor-following spotlight that reveals alternate text, gradients, or imagery beneath perfectly aligned headline layers." }, { "name": "cinematic-logo-cloud", "type": "registry:component", "title": "Cinematic Logo Cloud", "description": "A staggered blur-fade entrance animation for brand logos. Uses framer-motion and fully semantic responsive layouts." }, { "name": "step-flow", "type": "registry:component", "title": "Step Flow", "description": "A responsive four-step process section with a sliding highlight, animated image swaps, and hover or click step selection." }, { "name": "phone-input", "type": "registry:component", "title": "Phone Input", "description": "A modern animated phone number input with country selector and validation." }, { "name": "hero-aurora-spotlight", "type": "registry:component", "title": "Aurora Hero Spotlight", "description": "Cursor-reactive spotlight layered over an aurora field for launch heroes." }, { "name": "bento-signal-grid", "type": "registry:component", "title": "Signal Bento Grid", "description": "Animated bento tiles with breathing gradients for product metrics." }, { "name": "nebula-glass-card", "type": "registry:component", "title": "Nebula Glass Card", "description": "3D tilt card with spring physics and luminous edge lighting." }, { "name": "float-glass-navbar", "type": "registry:component", "title": "Float Glass Navbar", "description": "Glass navigation rail with spring entrance and CTA emphasis." }, { "name": "orbit-footer", "type": "registry:component", "title": "Orbit Footer", "description": "Compact footer with balanced columns and developer-first links." }, { "name": "depth-testimonials", "type": "registry:component", "title": "Depth Testimonials", "description": "Stacked testimonial planes with staggered motion reveals." }, { "name": "toggle-pricing-pro", "type": "registry:component", "title": "Toggle Pricing", "description": "Annual/monthly toggle with spring knob and contextual savings callout." }, { "name": "beam-sweep-field", "type": "registry:component", "title": "Beam Sweep Field", "description": "Slow sweeping light column for cinematic section backgrounds." }, { "name": "vector-tilt-scene", "type": "registry:component", "title": "Vector Tilt Scene", "description": "High depth glass panel for hero cards and feature highlights." }, { "name": "glass-login-stack", "type": "registry:component", "title": "Glass Login Stack", "description": "Minimal glass authentication panel with crisp focus states." }, { "name": "split-signup-convert", "type": "registry:component", "title": "Split Signup Convert", "description": "Two-column signup with narrative panel and compact fields." }, { "name": "signup-form", "type": "registry:component", "title": "Signup Form", "description": "Customizable signup form built on shadcn input + label with subtle framer-motion transitions and async submit states." }, { "name": "workbench-sidebar", "type": "registry:component", "title": "Workbench Sidebar", "description": "Dense sidebar navigation tuned for dashboards and tools." }, { "name": "pulse-dashboard-kpis", "type": "registry:component", "title": "Pulse Dashboard KPIs", "description": "KPI strip with micro-hover lifts and soft chart placeholders." }, { "name": "orbital-loader", "type": "registry:component", "title": "Orbital Loader", "description": "Dual counter-rotating rings with breathing inner glow." }, { "name": "milestone-timeline", "type": "registry:component", "title": "Milestone Timeline", "description": "Vertical roadmap timeline with glowing nodes." }, { "name": "lattice-feature-grid", "type": "registry:component", "title": "Lattice Feature Grid", "description": "Four-up feature grid with scroll reveals and glass tiles." }, { "name": "motion-faq-disclosure", "type": "registry:component", "title": "Motion FAQ Disclosure", "description": "Lightweight FAQ with directional affordance and animated answers." }, { "name": "nebula-cta-glow", "type": "registry:component", "title": "Nebula CTA Glow", "description": "Pulsing dual nebula glow behind a high-contrast CTA." }, { "name": "glow-button", "type": "registry:component", "title": "Glow Button", "description": "Framer-style glowing CTA button with expanding shadow, radial border sweep, glass edge, and animated arrow." }, { "name": "word-magnet", "type": "registry:component", "title": "Word Magnet", "description": "Cursor-reactive text where whole words gently repel from the pointer and spring back without splitting letters." }, { "name": "three-d-folder", "type": "registry:component", "title": "3D Folder Card", "description": "Interactive folder card that opens on hover, fans project cards upward, and includes a lightbox gallery for visual collections." }, { "name": "draggable-card-stack", "type": "registry:component", "title": "Draggable Card Stack", "description": "Shuffled deck of portrait cards on a dark surface. Drag or fling the top card to send it to the back; press ← to pull the bottom card to the front. Supports im…" }, { "name": "card-carousel-3d", "type": "registry:component", "title": "3D Card Carousel", "description": "Cylindrical 3D card carousel — cards arranged in a circle on the Z axis, rotating continuously or on scroll. Radius, perspective, item size, speed, and directi…" }, { "name": "real-time-cursors", "type": "registry:component", "title": "Real-Time Cursors", "description": "Collaborative workspace preview with animated teammate cursors, code review cards, and simulated live presence trails." }, { "name": "editorial-blog-rail", "type": "registry:component", "title": "Editorial Blog Rail", "description": "Featured article plus compact secondary headlines for content hubs." }, { "name": "split-contact-glass", "type": "registry:component", "title": "Split Contact Glass", "description": "Marketing narrative paired with a compact contact capture form." }, { "name": "svg-noise-shader", "type": "registry:component", "title": "SVG Noise Shader", "description": "FeTurbulence-driven noise field for textured sci-fi surfaces." }, { "name": "tracing-spotlight-panel", "type": "registry:component", "title": "Tracing Spotlight Panel", "description": "Cursor-traced highlight for feature callouts and pricing tiers." }, { "name": "forge-ai-command-bar", "type": "registry:component", "title": "Forge AI Command Bar", "description": "Command surface for AI copilots with motion layout container." }, { "name": "gooey-input", "type": "registry:component", "title": "Gooey Search Input", "description": "Expandable pill search with a detached icon bubble merged through an SVG goo filter and spring layout." }, { "name": "terminal", "type": "registry:component", "title": "Interactive Terminal", "description": "macOS-style terminal window with typewriter commands, cursor blink, output sequencing, and optional sound." }, { "name": "squiggly-text", "type": "registry:component", "title": "RippleLine squiggly text", "description": "Hero-grade headline with an animated wave underline, turbulence + Gaussian blur + displacement, optional glyph micro-warp, and reduced-motion fallbacks." }, { "name": "floating-dock", "type": "registry:component", "title": "Nexus floating dock", "description": "Bottom-centered macOS-style dock with pointer-driven magnification, neighbor scaling, glass pill chrome, tooltips, and a touch-friendly expandable mobile menu." }, { "name": "stateful-button", "type": "registry:component", "title": "Stateful message button", "description": "Animated async button with idle → loading → success transitions, built-in click guarding, and smooth icon/text motion." }, { "name": "sparkles", "type": "registry:component", "title": "Sparkles field", "description": "Configurable animated particle field for hero highlights, card backgrounds, and decorative UI layers with optional pointer interaction." }, { "name": "text-generate-effect", "type": "registry:component", "title": "Text Generate Effect", "description": "Animated text reveal that fades words, characters, or lines into view with optional blur and upward motion." }, { "name": "background-gradient", "type": "registry:component", "title": "Background Gradient", "description": "Animated gradient wrapper with soft glow and blur for cards, buttons, and hero sections." }, { "name": "typewriter-effect", "type": "registry:component", "title": "Typewriter Effect", "description": "Character-by-character typewriter text animation with blinking cursor, optional deleting, looping, and semantic heading support." }, { "name": "text-reveal-card", "type": "registry:component", "title": "Text Reveal Card", "description": "Interactive spotlight card with mouse-follow glow and bottom reveal content for features, case studies, and portfolio sections." }, { "name": "glowing-effect-cards", "type": "registry:component", "title": "Glowing Effect Cards", "description": "Cursor-reactive glowing border cards with a responsive 2-1-2 layout for refined SaaS sections and dashboards." }, { "name": "infinite-moving-cards", "type": "registry:component", "title": "Infinite Moving Cards", "description": "Customizable infinite marquee of cards with seamless looping, direction controls, hover pause, and optional custom rendering." }, { "name": "meteors", "type": "registry:component", "title": "Meteor Effect", "description": "Animated diagonal meteor beams with glow heads and trailing streaks, designed as a reusable background layer for cards and hero sections." }, { "name": "background-boxes", "type": "registry:component", "title": "Background Boxes", "description": "Animated isometric grid background with hover color effects and cross markers. Fully configurable skew, scale, box dimensions, and colors." }, { "name": "encrypted-text", "type": "registry:component", "title": "Encrypted Text", "description": "Characters shuffle through gibberish before locking into the final string — a futuristic cyber decoding reveal for hero headings, buttons, badges, and nav link…" }, { "name": "mac-keyboard", "type": "registry:component", "title": "Mac Keyboard", "description": "Fully interactive Mac-style keyboard with Web Audio synthesised click sounds, Framer Motion keycap animations, and real-time physical keyboard highlighting." }, { "name": "images-badge", "type": "registry:component", "title": "Images Badge", "description": "Stacked avatar/image pill that fans open on hover — ideal for team badges, social proof, avatar groups, and template galleries." }, { "name": "dot-grid-hero", "type": "registry:component", "title": "Interactive Dot Grid Hero", "description": "Cinematic hero section with a Canvas-rendered dot grid that reacts to cursor proximity — dots scale, brighten, and return to rest with a smooth radial glow spo…" }, { "name": "starfield-hero", "type": "registry:component", "title": "Interactive Starfield Hero", "description": "Dark hero section with a cursor-reactive starfield. Hundreds of glowing particles stretch, brighten, and rotate toward the cursor — built on Canvas + requestAn…" }, { "name": "compare", "type": "registry:component", "title": "Before / After Compare", "description": "Drag a vertical handle to compare two images side-by-side. Supports mouse and touch, optional labels, custom start position, and any aspect ratio." }, { "name": "expandable-cards", "type": "registry:component", "title": "Expandable Cards", "description": "Responsive card grid where clicking a card smoothly expands it into a full-detail overlay with image, description, and a CTA button." }, { "name": "animated-select-headline", "type": "registry:component", "title": "Animated Select Headline", "description": "A cycling word headline where each active word is highlighted with a Figma-style selection rectangle — thin border with corner handles — using blur-fade transi…" } ], "component_count": 86, "components_truncated": false, "component_types": { "registry:font": 1, "registry:component": 85 }, "has_logo": true, "enrichment_errors": [ "github_lookup_failed" ], "featured": true }, { "number": 110, "name": "@nexus-ui", "category": "AI/chat UI", "tags": [ "ai", "dashboard" ], "tagline": "Open-source component library of composable, copy-paste primitives for building AI interfaces (chat, streaming, multimodal)", "short_description": "Open-source component library of composable, copy-paste primitives for building AI interfaces (chat, streaming, multimodal)", "description": "Open-source copy-paste component library purpose-built for AI interfaces, designed as shadcn/ui for AI apps. Provides 14 composable primitives: PromptInput, ModelSelector, Suggestions, Attachments, Message, Thread, Citation, Reasoning, TextShimmer, Image, FeedbackBar, Toaster, ChainOfThought, and Tool. Built for streaming, voice, multimodal, and agentic UIs; integrates with Vercel AI SDK and ElevenLabs. React 19 + Next.js App Router, TypeScript, Radix primitives, Tailwind CSS. Fully free and MIT-licensed. Use for: building chat interfaces, AI copilots, or agent dashboards that need streaming-aware, accessible chat primitives.", "homepage": "https://nexus-ui.dev", "docs": "https://nexus-ui.dev/docs", "github": "https://github.com/victorcodess/nexus-ui", "components_github": "https://github.com/victorcodess/nexus-ui/tree/main/components", "github_default_branch": "main", "github_stars": 112, "last_commit": "2026-06-16T15:45:24Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://nexus-ui.dev/r/{name}.json", "registry_index": "https://nexus-ui.dev/r/registry.json", "components": [ "prompt-input", "suggestions", "attachments", "model-selector", "message", "thread", "citation", "image", "reasoning", "feedback-bar", "text-shimmer", "toaster", "chain-of-thought", "tool", "questions" ], "component_items": [ { "name": "prompt-input", "type": "registry:ui", "title": "Prompt Input", "description": "Composable chat input with auto-resizing textarea and action slots" }, { "name": "suggestions", "type": "registry:ui", "title": "Suggestions", "description": "Prompt suggestion chips for guiding user input" }, { "name": "attachments", "type": "registry:ui", "title": "Attachments", "description": "Composable file attachments for chat inputs and messages with preview, variants, and upload wiring" }, { "name": "model-selector", "type": "registry:ui", "title": "Model Selector", "description": "Dropdown for selecting AI models with radio groups, sub-menus, and custom items" }, { "name": "message", "type": "registry:ui", "title": "Message", "description": "Chat message layout with markdown, optional avatar, actions, and attachments" }, { "name": "thread", "type": "registry:ui", "title": "Thread", "description": "Scrollable chat thread with stick-to-bottom scrolling and jump-to-bottom control" }, { "name": "citation", "type": "registry:ui", "title": "Citation", "description": "Inline source references with hover preview and multi-source carousel" }, { "name": "image", "type": "registry:ui", "title": "Image", "description": "Image renderer for URLs, base64, and byte payloads with preview, loader, lightbox, and action slots" }, { "name": "reasoning", "type": "registry:ui", "title": "Reasoning", "description": "Collapsible model reasoning trace with streaming-aware labels and markdown body" }, { "name": "feedback-bar", "type": "registry:ui", "title": "Feedback Bar", "description": "Feedback prompt bar for per-message or thread ratings with action and close slots" }, { "name": "text-shimmer", "type": "registry:ui", "title": "Text Shimmer", "description": "Animated shimmer text for loading, tool runs, and other in-progress UI" }, { "name": "toaster", "type": "registry:ui", "title": "Toaster", "description": "Headless toast notifications powered by Sonner, with variant-aware styling and custom action/cancel controls" }, { "name": "chain-of-thought", "type": "registry:ui", "title": "Chain of Thought", "description": "Structured multi-step thought timeline with step status, optional expandable output, and auto-close when steps finish" }, { "name": "tool", "type": "registry:ui", "title": "Tool", "description": "Tool call component with state-aware header and JSON input/output blocks" }, { "name": "questions", "type": "registry:ui", "title": "Questions", "description": "Follow-up clarification questions with single or multiple choice, carousel navigation, and batch submission" } ], "component_count": 15, "components_truncated": false, "component_types": { "registry:ui": 15 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 111, "name": "@nordaun", "category": "Component library (general)", "tags": [ "components" ], "tagline": "Simple components for your extraordinary creations.", "short_description": "Simple components for your extraordinary creations.", "description": "A small personal registry of shadcn-extending components used daily by the Nordaun team, open-sourced for community use. Currently built on Base UI primitives (not Radix UI) — a noted distinction on the GitHub README. Components are described as clean, modular, and consistent extensions beyond the default shadcn/ui set. Free, MIT-licensed. Active development ongoing with Radix UI compatibility planned. Use for: projects already using Base UI that want additional clean, production-tested components installable via shadcn CLI.", "homepage": "https://ui.nordaun.com", "docs": "https://ui.nordaun.com", "github": "https://github.com/nordaun/ui", "components_github": null, "github_default_branch": "main", "github_stars": 6, "last_commit": "2026-05-28T09:26:03Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://ui.nordaun.com/r/{name}.json", "registry_index": "https://ui.nordaun.com/r/registry.json", "components": [ "audio", "file", "flag", "loading", "map", "password", "phone", "video" ], "component_items": [ { "name": "audio", "type": "registry:block", "title": "Audio", "description": "An audio playback with extendable control modules already included such as volume and speed." }, { "name": "file", "type": "registry:block", "title": "File", "description": "A context-based file uploader with customizable titles, descriptions and icons and a built-in workflow." }, { "name": "flag", "type": "registry:block", "title": "Flag", "description": "A simple flag display which renders a vector image of the selected country's flag by its country code." }, { "name": "loading", "type": "registry:block", "title": "Loading", "description": "A simple loading component that can be useful when working with long loading components or fallbacks." }, { "name": "map", "type": "registry:block", "title": "Map", "description": "A modular context-based map with built in controls such as projection, zoom, rotation and fullscreen." }, { "name": "password", "type": "registry:block", "title": "Password", "description": "A super simple password input component with a toggle options that hides or reveals your password." }, { "name": "phone", "type": "registry:block", "title": "Phone", "description": "A simple but clean phone input with a region selection so you dont have to worry about messing up." }, { "name": "video", "type": "registry:block", "title": "Video", "description": "A video playback with extendable control modules already included such as volume, speed and fullscreen." } ], "component_count": 8, "components_truncated": false, "component_types": { "registry:block": 8 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 112, "name": "@nteract", "category": "Editor (rich text/code)", "tags": [ "components" ], "tagline": "Components for interactive computing notebooks.", "short_description": "Components for interactive computing notebooks.", "description": "A React component library and design system for building interactive computational notebook interfaces, powering the nteract desktop editor (built with Tauri). Provides 15 Cell components (Markdown Cell, Code Cell, Cell Controls, Cell Header, Collaborator Avatars, Execution Count, Execution Status, Play Button, etc.), 9 Output renderers (ANSI, HTML, Image, SVG, Markdown, JSON, Media Router, Isolated Frame), and 50+ Jupyter Widget protocol components including ipycanvas, AnyWidget, and built-in controls. Uses shadcn/ui patterns; state management via useSyncExternalStore for React 18/19 compatibility; CodeMirror editor with Jupyter keybindings. Free, open source. Use for: building custom notebook UIs, REPL interfaces, or Jupyter-compatible front-ends in React.", "homepage": "https://nteract-elements.vercel.app/", "docs": "https://nteract-elements.vercel.app/docs", "github": "https://github.com/runtimed/runt", "components_github": "https://github.com/runtimed/runt/tree/main/src/components", "github_default_branch": "main", "github_stars": 140, "last_commit": "2026-07-08T05:28:27Z", "archived": false, "license": "BSD-3-Clause", "open_issues": 25, "registry_template": "https://nteract-elements.vercel.app/r/{name}.json", "registry_index": "https://nteract-elements.vercel.app/r/registry.json", "components": [ "ansi-output", "image-output", "html-output", "svg-output", "markdown-output", "json-output", "media-provider", "media-router", "cell-header", "cell-type-button", "execution-status", "play-button", "runtime-health-indicator", "cell-controls", "cell-container", "cell-betweener", "output-area", "execution-count", "collaborator-avatars", "presence-bookmarks", "codemirror-editor", "widget-store", "anywidget-view", "widget-view", "widget-controls", "ipycanvas", "isolated-frame", "cell-type-selector", "error-boundary", "highlight-text", "isolated-renderer", "all", "global-find-bar", "runtime-icons", "selection-card" ], "component_items": [ { "name": "ansi-output", "type": "registry:component", "title": "ANSI Output", "description": "Components for rendering ANSI escape sequences as colored text in notebook outputs. Includes AnsiOutput, AnsiStreamOutput, and AnsiErrorOutput variants." }, { "name": "image-output", "type": "registry:component", "title": "Image Output", "description": "Component for rendering images in notebook outputs. Handles base64-encoded image data from Jupyter kernels as well as regular URLs. Supports PNG, JPEG, GIF, an…" }, { "name": "html-output", "type": "registry:component", "title": "HTML Output", "description": "Component for rendering HTML content in notebook outputs. Handles pandas DataFrames, rich HTML displays, and interactive visualizations. Requires iframe isolat…" }, { "name": "svg-output", "type": "registry:component", "title": "SVG Output", "description": "Component for rendering SVG graphics in notebook outputs. Handles matplotlib figures, diagrams, and other vector graphics with proper scaling." }, { "name": "markdown-output", "type": "registry:component", "title": "Markdown Output", "description": "Component for rendering Markdown content in notebook outputs. Supports GitHub Flavored Markdown (GFM) with tables, task lists, and syntax-highlighted code bloc…" }, { "name": "json-output", "type": "registry:component", "title": "JSON Output", "description": "Component for rendering JSON data in an interactive, expandable tree view. Useful for inspecting complex data structures and API responses." }, { "name": "media-provider", "type": "registry:component", "title": "Media Provider", "description": "React context provider for shared media rendering configuration. Provides renderers and priority settings to all nested MediaRouter instances." }, { "name": "media-router", "type": "registry:component", "title": "Media Router", "description": "MIME type-based output dispatcher that automatically selects the best renderer for Jupyter outputs. Supports custom renderers and priority ordering for platfor…" }, { "name": "cell-header", "type": "registry:component", "title": "CellHeader", "description": "Slot-based header layout for notebook cells with left/right content areas and optional drag support." }, { "name": "cell-type-button", "type": "registry:component", "title": "CellTypeButton", "description": "Styled buttons for different notebook cell types with color coding. Includes CodeCellButton, MarkdownCellButton, SqlCellButton, and AiCellButton convenience co…" }, { "name": "execution-status", "type": "registry:component", "title": "ExecutionStatus", "description": "A badge component that displays the execution state of a notebook cell. Shows queued, running, or error states." }, { "name": "play-button", "type": "registry:component", "title": "PlayButton", "description": "Cell execution control button that shows Play, Stop, or Loading states based on execution state. Used in notebook cell toolbars." }, { "name": "runtime-health-indicator", "type": "registry:component", "title": "RuntimeHealthIndicator", "description": "A visual indicator for kernel connection status. Shows idle, busy, connecting, or disconnected states with color-coded dots. Can display kernel name and option…" }, { "name": "cell-controls", "type": "registry:component", "title": "CellControls", "description": "Cell action menu with source visibility toggle, move controls, and dropdown menu for delete and clear operations." }, { "name": "cell-container", "type": "registry:component", "title": "CellContainer", "description": "A focus and selection wrapper for notebook cells with gutter ribbon system. Color-coded ribbons indicate cell type, with action area for play button and execut…" }, { "name": "cell-betweener", "type": "registry:component", "title": "CellBetweener", "description": "Spacer component that maintains gutter ribbon continuity between cells. Creates an unbroken 'paper edge' effect down the left side of the notebook." }, { "name": "output-area", "type": "registry:component", "title": "OutputArea", "description": "Wrapper component for rendering multiple Jupyter outputs with collapsible state and scroll behavior." }, { "name": "execution-count", "type": "registry:component", "title": "ExecutionCount", "description": "Displays the classic Jupyter execution count indicator with bracket notation. Shows [ ]: for never executed, [*]: for executing, and [n]: for executed cells." }, { "name": "collaborator-avatars", "type": "registry:component", "title": "CollaboratorAvatars", "description": "Display avatars of users collaborating on a notebook with overflow handling." }, { "name": "presence-bookmarks", "type": "registry:component", "title": "PresenceBookmarks", "description": "Shows stacked user avatars indicating who is present on a cell. Displays a HoverCard with user details and a +N overflow indicator when users exceed the limit." }, { "name": "codemirror-editor", "type": "registry:component", "title": "CodeMirror Editor", "description": "A CodeMirror 6 editor component for notebook cells with syntax highlighting, key bindings, and language support for Python, IPython (with magics and shell comm…" }, { "name": "widget-store", "type": "registry:lib", "title": "Widget Store", "description": "Pure React state management for Jupyter widget models. Handles comm_open, comm_msg, and comm_close messages with fine-grained subscriptions via useSyncExternal…" }, { "name": "anywidget-view", "type": "registry:lib", "title": "AnyWidget View", "description": "React component for rendering anywidget ESM modules with the AFM (AnyWidget Frontend Module) interface. Handles dynamic ESM loading, CSS injection, and two-way…" }, { "name": "widget-view", "type": "registry:lib", "title": "Widget View", "description": "Universal widget router that renders Jupyter widgets. Routes anywidgets to ESM loader and standard ipywidgets to built-in shadcn-backed components." }, { "name": "widget-controls", "type": "registry:component", "title": "Widget Controls", "description": "Built-in shadcn-backed widget components for standard ipywidgets including controls (IntSlider, FloatSlider, IntRangeSlider, FloatRangeSlider, IntProgress, But…" }, { "name": "ipycanvas", "type": "registry:component", "title": "ipycanvas Widget", "description": "Canvas widget for ipycanvas. Renders an HTML canvas and processes drawing commands sent from Python via the ipycanvas binary protocol. Supports shapes, paths, …" }, { "name": "isolated-frame", "type": "registry:component", "title": "Isolated Frame", "description": "Secure iframe component for rendering untrusted output content. Uses blob URLs with sandbox restrictions to isolate JavaScript execution. Includes message brid…" }, { "name": "cell-type-selector", "type": "registry:component", "title": "CellTypeSelector", "description": "A dropdown selector for changing cell types in notebook interfaces. Supports filtering available types and displays the current type with color-coded styling." }, { "name": "error-boundary", "type": "registry:lib", "title": "Error Boundary", "description": "React error boundary with resetKeys support for automatic recovery. Includes OutputErrorFallback and WidgetErrorFallback components for graceful error display …" }, { "name": "highlight-text", "type": "registry:lib", "title": "Highlight Text", "description": "DOM utility for highlighting search matches in text content with customizable styling." }, { "name": "isolated-renderer", "type": "registry:component", "title": "Isolated Renderer", "description": "Complete isolated iframe renderer bundle for Jupyter outputs and widgets. Runs inside a sandboxed iframe with its own React app, receiving render commands via …" }, { "name": "all", "type": "registry:component", "title": "All nteract Components", "description": "Install all Jupyter frontend components: outputs, cell primitives, widgets, editor, icons, and UI components." }, { "name": "global-find-bar", "type": "registry:component", "title": "Global Find Bar", "description": "Floating search bar for notebook-wide find functionality. Supports keyboard navigation (Enter/Shift+Enter for next/prev, Escape to close). Works with search-hi…" }, { "name": "runtime-icons", "type": "registry:component", "title": "Runtime Icons", "description": "SVG icons for runtime environments and package managers. Includes DenoIcon, PythonIcon, UvIcon, CondaIcon, and PixiIcon for notebook and onboarding UIs." }, { "name": "selection-card", "type": "registry:component", "title": "Selection Card", "description": "A stylized selection card component for wizard and onboarding UIs. Includes SelectionCard with icon, title, description, and color-coded selection state, plus …" } ], "component_count": 35, "components_truncated": false, "component_types": { "registry:component": 30, "registry:lib": 5 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 113, "name": "@nuqs", "category": "Hooks/utilities", "tags": [ "components" ], "tagline": "Custom parsers, adapters and utilities from the community for type-safe URL state management.", "short_description": "Custom parsers, adapters and utilities from the community for type-safe URL state management.", "description": "Type-safe URL query-string state management for React frameworks, functioning like useState but backed by the URL. The shadcn registry distributes community-contributed custom parsers, adapters, and utilities that extend the core nuqs library. Supports Next.js (app and pages routers), React SPA, Remix, React Router v6/v7, and TanStack Router via adapters. Features built-in parsers (integer, float, boolean, Date), useQueryStates for grouped params, shallow mode, and server-component cache helpers. Free, MIT-licensed. Use for: adding shareable, bookmarkable URL state to any React app without a separate state library.", "homepage": "https://nuqs.dev/registry", "docs": "https://nuqs.dev/docs", "github": "https://github.com/47ng/nuqs", "components_github": null, "github_default_branch": "next", "github_stars": 10661, "last_commit": "2026-07-08T07:52:31Z", "archived": false, "license": "MIT", "open_issues": 55, "registry_template": "https://nuqs.dev/r/{name}.json", "registry_index": "https://nuqs.dev/r/registry.json", "components": [ "adapter-inertia", "adapter-onejs", "adapter-react-router-v5", "adapter-waku", "next-typed-links" ], "component_items": [ { "name": "adapter-inertia", "type": "registry:item", "title": "Inertia.js Adapter", "description": "Using nuqs in Inertia.js apps (eg: with a Laravel backend)" }, { "name": "adapter-onejs", "type": "registry:item", "title": "One.js Adapter", "description": "Using nuqs in One.js applications." }, { "name": "adapter-react-router-v5", "type": "registry:item", "title": "React Router v5 Adapter", "description": "Using nuqs in React Router v5 applications." }, { "name": "adapter-waku", "type": "registry:item", "title": "Waku Adapter", "description": "Using nuqs in ⛩️ Waku applications." }, { "name": "next-typed-links", "type": "registry:item", "title": "Typed Links for Next.js", "description": "Type-safe linking for Next.js (using typedRoutes + nuqs)" } ], "component_count": 5, "components_truncated": false, "component_types": { "registry:item": 5 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 130, "name": "@nusaiba", "category": "Uncategorized", "tags": [], "tagline": "Motion-first shadcn marketing blocks for landing pages — heroes, pricing, FAQs, footers, and more. Built on base-nova with intentional animation and CLI install.", "short_description": "", "description": "Motion-first shadcn marketing blocks for landing pages — heroes, pricing, FAQs, footers, and more. Built on base-nova with intentional animation and CLI install.", "homepage": "https://nusaiba.dev", "docs": "https://nusaiba.dev/docs", "github": null, "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://nusaiba.dev/r/base-nova/{name}.json", "registry_index": "https://nusaiba.dev/r/base-nova/registry.json", "components": [ "foundation", "gallery-visuals", "theme-sera", "full-width-divider", "decor-icon", "bubble-background", "brand-typography", "faqs-1", "faqs-2", "faqs-3", "faqs-4", "faqs-5", "faqs-7", "faqs-8", "features-1", "features-3", "features-4", "features-5", "features-7", "features-8", "features-10", "features-11", "hero-2", "hero-4", "hero-6", "hero-7", "hero-9", "hero-12", "cta-1", "cta-2", "cta-3", "cta-6", "cta-7", "cta-9", "auth-1", "auth-2", "auth-3", "auth-4", "auth-5", "auth-6", "auth-7", "auth-9", "blog-1", "blog-2", "blog-5", "blog-9", "contact-1", "contact-2", "contact-3", "contact-4", "contact-5", "contact-6", "contact-7", "footer-1", "footer-2", "footer-4", "footer-6", "footer-7", "footer-8", "header-1", "header-3", "header-4", "header-5", "header-6", "header-7", "header-9", "integrations-2", "integrations-3", "integrations-4", "integrations-5", "integrations-6", "integrations-7", "logo-cloud-1", "logo-cloud-3", "logo-cloud-4", "logo-cloud-5", "logo-cloud-7", "logo-cloud-14", "logo-cloud-16", "not-found-1", "not-found-2", "not-found-3", "not-found-4", "not-found-5", "not-found-6", "not-found-7", "pricing-1", "pricing-2", "pricing-4", "pricing-5", "pricing-6", "pricing-7", "pricing-8", "testimonials-1", "testimonials-2", "testimonials-5", "testimonials-6", "testimonials-10", "gallery-2", "gallery-3" ], "component_items": [ { "name": "foundation", "type": "registry:item", "title": "Nusaiba Foundation", "description": "Motion tokens, design-system UI primitives, brand logos, infinite slider, and button-scale theme. Installed automatically with every block." }, { "name": "gallery-visuals", "type": "registry:item", "title": "Nusaiba Gallery Visuals", "description": "Shared abstract gallery images copied into public/images/visuals for gallery blocks." }, { "name": "theme-sera", "type": "registry:theme", "title": "Sera Theme", "description": "Sera series design tokens — zero radius, monochrome oklch palette for light and dark mode. Matches `shadcn init --preset b4BnGlQgsa`." }, { "name": "full-width-divider", "type": "registry:component", "title": null, "description": "Full-bleed horizontal divider for premium section separation." }, { "name": "decor-icon", "type": "registry:component", "title": null, "description": "Corner plus-icon decorator for bordered layouts." }, { "name": "bubble-background", "type": "registry:component", "title": null, "description": "Interactive animated gradient bubble background from Animate UI." }, { "name": "brand-typography", "type": "registry:lib", "title": null, "description": "Brand wordmark fonts and Logo.dev typography helpers." }, { "name": "faqs-1", "type": "registry:block", "title": null, "description": "Two-column FAQ with sticky header, scroll-reveal stagger, and registry-native copy." }, { "name": "faqs-2", "type": "registry:block", "title": null, "description": "Split FAQ with framed accordion, grid pattern, and registry-focused copy — matches the Nusaiba landing page." }, { "name": "faqs-3", "type": "registry:block", "title": null, "description": "Narrow centered accordion with scroll-reveal stagger — minimal close for landing pages." }, { "name": "faqs-4", "type": "registry:block", "title": null, "description": "Balanced two-column accordion split — grid-reveal for dense FAQ pages without sticky rail." }, { "name": "faqs-5", "type": "registry:block", "title": null, "description": "Install / Plans / Customize pill tabs with focus-shift filtering — organized FAQ for builders." }, { "name": "faqs-7", "type": "registry:block", "title": null, "description": "Expandable FAQ cards in a 2×3 grid with hover lift — scannable topics above pricing." }, { "name": "faqs-8", "type": "registry:block", "title": null, "description": "Sticky topic rail with registry stats + synced accordion — editorial FAQ for long landings." }, { "name": "features-1", "type": "registry:block", "title": null, "description": "Six-cell bento grid with product features, grid-pattern cards, and scroll entrances." }, { "name": "features-3", "type": "registry:block", "title": null, "description": "Numbered feature list with horizontal rows, icon hover, and whileInView slide-in." }, { "name": "features-4", "type": "registry:block", "title": null, "description": "Sticky scroll-stacking feature cards — slide up from below and pile with offset tops." }, { "name": "features-5", "type": "registry:block", "title": null, "description": "2×3 interactive capability grid with auto-cycle pulse focus — hover overrides cycle, label expands on active cell (logo-cloud-3 DNA)." }, { "name": "features-7", "type": "registry:block", "title": null, "description": "Vertical witness list with accent bar and stat expand — logo-cloud-15 DNA applied to registry capabilities." }, { "name": "features-8", "type": "registry:block", "title": null, "description": "Command-style capability picker with search and arrow keys — blog-12 content-highlight adapted for features." }, { "name": "features-10", "type": "registry:block", "title": null, "description": "Split witness with center-stage capability focus, blur handoff, and icon chips — logo-cloud-10 DNA for registry workflows." }, { "name": "features-11", "type": "registry:block", "title": null, "description": "Asymmetric bento with flagship motion cell — click to expand labels on peer cells, blur-dim on inactive (logo-cloud-7 expand-focus DNA)." }, { "name": "hero-2", "type": "registry:block", "title": null, "description": "Atmospheric centered hero with gradient glow and staggered motion entrance." }, { "name": "hero-4", "type": "registry:block", "title": null, "description": "Typography monument — per-word reveal headline with registry-focused production copy." }, { "name": "hero-6", "type": "registry:block", "title": null, "description": "Stacked cinematic hero with bubble background, image stage, and cursor-driven perspective tilt." }, { "name": "hero-7", "type": "registry:block", "title": null, "description": "Asymmetric editorial split — badge, expressive headline, CTAs, and parallax motion stage." }, { "name": "hero-9", "type": "registry:block", "title": null, "description": "Swiss ruled split — registry copy beside a modular block grid motion stage." }, { "name": "hero-12", "type": "registry:block", "title": null, "description": "Four-tile gallery wall motion showcase with hover-lift and registry-native captions." }, { "name": "cta-1", "type": "registry:block", "title": null, "description": "Horizontal conversion band with blur stagger — registry-native copy and dual install actions." }, { "name": "cta-2", "type": "registry:block", "title": null, "description": "Centered CTA with radial glow pulse and staggered reveal — hero-spotlight DNA for catalog close." }, { "name": "cta-3", "type": "registry:block", "title": null, "description": "Split layout with registry preview panel and light parallax — hero-1 asymmetry for install conversion." }, { "name": "cta-6", "type": "registry:block", "title": null, "description": "Free vs Pro fork with center-stage focus shift — pricing-2 DNA for registry path choice." }, { "name": "cta-7", "type": "registry:block", "title": null, "description": "Copy-prompt variant cycle with blur handoff — features-10 DNA for AI editor workflow." }, { "name": "cta-9", "type": "registry:block", "title": null, "description": "Full-bleed inverse conversion band with radial glow — footer-10 inverse DNA for dramatic close." }, { "name": "auth-1", "type": "registry:block", "title": null, "description": "Split sign-in with brand rail, scroll-reveal stagger, and registry-native copy." }, { "name": "auth-2", "type": "registry:block", "title": null, "description": "Mirrored sign-up split with terms line — motion stagger and Nusaiba study case." }, { "name": "auth-3", "type": "registry:block", "title": null, "description": "Compact centered card with remember-me — minimal auth for marketing landings." }, { "name": "auth-4", "type": "registry:block", "title": null, "description": "Two-column signup form in a centered layout — fast account creation above pricing." }, { "name": "auth-5", "type": "registry:block", "title": null, "description": "Sign-in form beside visual panel with light parallax — cta-3 DNA for install-led auth." }, { "name": "auth-6", "type": "registry:block", "title": null, "description": "Passwordless email-only sign-in — centered icon hero and single-field flow." }, { "name": "auth-7", "type": "registry:block", "title": null, "description": "GitHub + Google buttons with email divider — grid-reveal for multi-path sign-in." }, { "name": "auth-9", "type": "registry:block", "title": null, "description": "Sign-in card beside registry benefits list — justify account creation on landing pages." }, { "name": "blog-1", "type": "registry:block", "title": null, "description": "Three-column blog grid with image placeholders and category metadata." }, { "name": "blog-2", "type": "registry:block", "title": null, "description": "Editorial blog spotlight — thumbnail rail, spring crossfade feature panel, auto-advance on pause-hover." }, { "name": "blog-5", "type": "registry:block", "title": null, "description": "Horizontal scroll snap filmstrip with scale focus on the active cover slide." }, { "name": "blog-9", "type": "registry:block", "title": null, "description": "Infinite article title marquee with crossfading featured story card." }, { "name": "contact-1", "type": "registry:block", "title": null, "description": "Split contact with channel list and full message form — scroll-reveal stagger." }, { "name": "contact-2", "type": "registry:block", "title": null, "description": "Centered compact form (name, email, message) — Wave A minimal contact for pricing pages." }, { "name": "contact-3", "type": "registry:block", "title": null, "description": "Bordered card contact form with two-column name row — polished centered layout." }, { "name": "contact-4", "type": "registry:block", "title": null, "description": "Topic pills (Pro / Team / Blocks) with focus-shift before submit — organized intake." }, { "name": "contact-5", "type": "registry:block", "title": null, "description": "Form beside visual panel with parallax — auth-5 / cta-3 DNA for support pages." }, { "name": "contact-6", "type": "registry:block", "title": null, "description": "Full-width email capture band — quick pre-sale contact above footer." }, { "name": "contact-7", "type": "registry:block", "title": null, "description": "Channel cards (email, docs, registry) plus inline mini-form — hover-lift grid." }, { "name": "footer-1", "type": "registry:block", "title": null, "description": "Four-column marketing footer with link groups and copyright bar." }, { "name": "footer-2", "type": "registry:block", "title": null, "description": "Single-row footer strip with blur stagger on view — logo-cloud-16 footer strip DNA for wordmark, inline links, and copyright." }, { "name": "footer-4", "type": "registry:block", "title": null, "description": "Four nav columns and boxed socials above a giant outline wordmark — hero close with status pill." }, { "name": "footer-6", "type": "registry:block", "title": null, "description": "Vertical dividers between brand and link columns — inline legal trail and system status pill." }, { "name": "footer-7", "type": "registry:block", "title": null, "description": "Blueprint grid with bordered cells — social/copyright, newsletter subscribe, and theme pill row." }, { "name": "footer-8", "type": "registry:block", "title": null, "description": "Four link columns, boxed social row, and paired install CTAs above centered copyright." }, { "name": "header-1", "type": "registry:block", "title": null, "description": "Sticky blurred navigation header with links and primary CTA." } ], "component_count": 119, "components_truncated": true, "component_types": { "registry:item": 2, "registry:theme": 1, "registry:component": 3, "registry:lib": 1, "registry:block": 112 }, "has_logo": true, "enrichment_errors": [ "github_unresolved" ], "featured": false }, { "number": 114, "name": "@odysseyui", "category": "Animated components", "tags": [ "aesthetic" ], "tagline": "A design focused component library for Next.js, built for speed, flexibility and developer experience.", "short_description": "A design focused component library for Next.js, built for speed, flexibility and developer experience.", "description": "A fully animated, open-source React component distribution built on top of Animate UI conventions, using Next.js App Router, React 19, TypeScript, Tailwind CSS v4, and Motion (formerly Framer Motion). Components are distributed via shadcn CLI and live directly in your codebase. Built as a Turborepo pnpm monorepo with Fumadocs for documentation. Free and MIT-licensed. Use for: Next.js projects that need motion-enhanced shadcn-compatible components with modern Tailwind v4 styling and full code ownership.", "homepage": "https://www.odysseyui.com/docs", "docs": "https://www.odysseyui.com/docs", "github": "https://github.com/shr3kx/odysseyui", "components_github": null, "github_default_branch": "main", "github_stars": 29, "last_commit": "2026-05-06T21:40:03Z", "archived": false, "license": null, "open_issues": 1, "registry_template": "https://www.odysseyui.com/r/{name}.json", "registry_index": "https://www.odysseyui.com/r/registry.json", "components": [ "index", "components-ai-chat-container", "components-ai-message-bubble", "components-ai-model-selector", "components-ai-prompt-input", "components-ai-search-modal", "components-ai-steps", "components-ai-thought-chain", "components-ai-token-usage", "components-animate-avatar-group", "components-animate-card-stroke", "components-animate-code", "components-animate-code-block", "components-animate-code-tabs", "components-animate-cursor", "components-animate-footer", "components-animate-github-stars-wheel", "components-animate-tabs", "components-app-shells-app-shell-1", "components-app-shells-app-shell-2", "components-buttons-button", "components-buttons-copy", "components-buttons-github-stars", "components-buttons-icon", "components-buttons-smart-upload", "components-buttons-theme-toggler", "components-community-notification-list", "components-community-playful-todolist", "components-faqs-faq-1", "components-logoclouds-logocloud-1", "components-logoclouds-logocloud-2", "components-logoclouds-logocloud-3", "components-logoclouds-logocloud-4", "components-logoclouds-logocloud-5", "components-music-album-cards", "components-music-spotify-card", "components-music-vertical-spotify-card-1", "components-music-vertical-spotify-card-2", "components-preloaders-greetings", "components-pricings-pricing-1", "components-pricings-pricing-2", "components-pricings-pricing-3", "components-pricings-pricing-4", "components-pricings-pricing-5", "components-pricings-pricing-6", "components-primitives-avatar", "components-primitives-tree-filter", "components-radix-checkbox", "components-radix-dropdown-menu", "components-radix-hover-card", "components-texts-text-highlighter", "components-texts-text-reveal", "components-texts-text-shimmer", "components-texts-text-shimmer-wave", "components-texts-typewriter", "components-ui-badge", "demo-components-ai-chat-container", "demo-components-ai-message-bubble", "demo-components-ai-model-selector", "demo-components-ai-prompt-input", "demo-components-ai-search-modal", "demo-components-ai-steps", "demo-components-ai-thought-chain", "demo-components-ai-token-usage", "demo-components-animate-avatar-group", "demo-components-animate-card-stroke", "demo-components-animate-code", "demo-components-animate-code-block", "demo-components-animate-code-tabs", "demo-components-animate-cursor", "demo-components-animate-footer", "demo-components-animate-github-stars-wheel", "demo-components-animate-tabs", "demo-components-app-shells-app-shell-1", "demo-components-app-shells-app-shell-2", "demo-components-buttons-button", "demo-components-buttons-copy", "demo-components-buttons-github-stars", "demo-components-buttons-smart-upload", "demo-components-buttons-theme-toggler", "demo-components-community-notification-list", "demo-components-community-playful-todolist", "demo-components-faqs-faq-1", "demo-components-logoclouds-logocloud-1", "demo-components-logoclouds-logocloud-2", "demo-components-logoclouds-logocloud-3", "demo-components-logoclouds-logocloud-4", "demo-components-logoclouds-logocloud-5", "demo-components-music-album-cards", "demo-components-music-spotify-card", "demo-components-music-vertical-spotify-card-1", "demo-components-music-vertical-spotify-card-2", "demo-components-preloaders-greetings", "demo-components-pricings-pricing-1", "demo-components-pricings-pricing-2", "demo-components-pricings-pricing-3", "demo-components-pricings-pricing-4", "demo-components-pricings-pricing-5", "demo-components-pricings-pricing-6", "demo-components-primitives-avatar" ], "component_items": [ { "name": "index", "type": "registry:style", "title": null, "description": null }, { "name": "components-ai-chat-container", "type": "registry:ui", "title": "Chat Container", "description": "A composable chat container with auto-scroll, empty state, animated messages, scroll-to-bottom button, and divider support." }, { "name": "components-ai-message-bubble", "type": "registry:ui", "title": "Message Bubble", "description": "A composable chat message bubble with avatar, content, and timestamp sub-components. Role-aware layout for user and assistant messages." }, { "name": "components-ai-model-selector", "type": "registry:ui", "title": "Model Selector", "description": "A modal-based AI model picker with provider filtering, search, starred models, and capability badges." }, { "name": "components-ai-prompt-input", "type": "registry:ui", "title": "Prompt Input", "description": "Simple Prompt Interface input design." }, { "name": "components-ai-search-modal", "type": "registry:ui", "title": "Search Modal", "description": "A full-featured chat search modal with conversation preview, inline rename, delete, keyboard navigation, and time-grouped results." }, { "name": "components-ai-steps", "type": "registry:ui", "title": "Steps", "description": "A collapsible AI tool-run steps component with animated shimmer trigger and a vertical progress bar." }, { "name": "components-ai-thought-chain", "type": "registry:ui", "title": "Thought Chain", "description": "An animated AI reasoning step-by-step thought chain component with collapsible steps and status indicators." }, { "name": "components-ai-token-usage", "type": "registry:ui", "title": "Token Usage", "description": "A token usage card showing input/output counts, costs, proportion bar, and an interactive token breakdown with tooltips." }, { "name": "components-animate-avatar-group", "type": "registry:ui", "title": "Avatar Group", "description": "An animated avatar group that displays overlapping user images and smoothly shifts each avatar forward on hover to highlight it." }, { "name": "components-animate-card-stroke", "type": "registry:ui", "title": "Card Stroke", "description": "A card component with animated SVG stroke and split-text reveal on hover." }, { "name": "components-animate-code", "type": "registry:ui", "title": "Code", "description": "A code component that animates the code as it is written." }, { "name": "components-animate-code-block", "type": "registry:ui", "title": "Code Block", "description": "A styled code block frame component with language badge and optional copy functionality." }, { "name": "components-animate-code-tabs", "type": "registry:ui", "title": "Code Tabs", "description": "A tabs component that displays code for different languages." }, { "name": "components-animate-cursor", "type": "registry:ui", "title": "Cursor", "description": "An animated cursor component that allows you to customize both the cursor and cursor follow elements with smooth animations." }, { "name": "components-animate-footer", "type": "registry:ui", "title": "Footer", "description": "A minimal footer design inspired by Dia browser." }, { "name": "components-animate-github-stars-wheel", "type": "registry:ui", "title": "GitHub Stars Wheel", "description": "A scrolling wheel that displays GitHub stars count." }, { "name": "components-animate-tabs", "type": "registry:ui", "title": "Tabs", "description": "A set of layered sections of content—known as tab panels—that are displayed one at a time." }, { "name": "components-app-shells-app-shell-1", "type": "registry:ui", "title": "App Shell 1", "description": "Collapsible sidebar app shell with search command palette, breadcrumb page header, scrollable nav sections, and avatar-based user dropdown." }, { "name": "components-app-shells-app-shell-2", "type": "registry:component", "title": "App Shell 2", "description": "A floating sidebar app shell with collapsible icon mode, searchable navigation, keyboard shortcuts modal, and user menu." }, { "name": "components-buttons-button", "type": "registry:ui", "title": "Button", "description": "A button component with a variety of styles and animations." }, { "name": "components-buttons-copy", "type": "registry:ui", "title": "Copy Button", "description": "A copy button component with a variety of styles and animations." }, { "name": "components-buttons-github-stars", "type": "registry:ui", "title": "GitHub Stars Button", "description": "A clickable button that links to a GitHub repository and displays the number of stars." }, { "name": "components-buttons-icon", "type": "registry:ui", "title": "Icon Button", "description": "An icon button component with a variety of styles and animations." }, { "name": "components-buttons-smart-upload", "type": "registry:ui", "title": "Smart Upload", "description": "Turn file uploads into engaging moments with smooth animations and intuitive visual feedback" }, { "name": "components-buttons-theme-toggler", "type": "registry:ui", "title": "Theme Toggler Button", "description": "A button that toggles the theme gradually." }, { "name": "components-community-notification-list", "type": "registry:ui", "title": "Notification List", "description": "A fun notification list with animated stacking and cards that expand as you interact." }, { "name": "components-community-playful-todolist", "type": "registry:ui", "title": "Playful Todolist", "description": "A playful todolist component with animated wavy strikethroughs for each completed task." }, { "name": "components-faqs-faq-1", "type": "registry:ui", "title": "FAQ 1", "description": "Accordion-based FAQ section with a serif heading and divider separators." }, { "name": "components-logoclouds-logocloud-1", "type": "registry:ui", "title": "Logo Cloud 1", "description": "Animated logo cloud with staggered fade-in and group cycling." }, { "name": "components-logoclouds-logocloud-2", "type": "registry:ui", "title": "Logo Cloud 2", "description": "Animated logo cloud that cycles groups of 3 logos with spring blur transitions." }, { "name": "components-logoclouds-logocloud-3", "type": "registry:ui", "title": "Logo Cloud 3", "description": "Infinite scrolling logo marquee with progressive blur edges and motion-powered animation." }, { "name": "components-logoclouds-logocloud-4", "type": "registry:ui", "title": "Logo Cloud 4", "description": "CSS-animated logo carousel that cycles groups with blur and slide transitions." }, { "name": "components-logoclouds-logocloud-5", "type": "registry:ui", "title": "Logo Cloud 5", "description": "CSS marquee logo cloud with configurable direction, speed, gap, and fade edges." }, { "name": "components-music-album-cards", "type": "registry:component", "title": "Album Cards", "description": "A stacked album card row where clicking a card ejects a spinning vinyl disc, with hover lift and neighbor dimming effects. Requires a /api/spotify route." }, { "name": "components-music-spotify-card", "type": "registry:component", "title": "Spotify Card", "description": "A horizontal Spotify music card with blurred album art background, vinyl record animation, seek bar, and playback controls. Requires a /api/spotify route." }, { "name": "components-music-vertical-spotify-card-1", "type": "registry:component", "title": "Vertical Spotify Card 1", "description": "A vertical Spotify music card with a progressive blur album art background, seek bar, and transport controls. Requires a /api/spotify route." }, { "name": "components-music-vertical-spotify-card-2", "type": "registry:component", "title": "Vertical Spotify Card 2", "description": "A vertical Spotify music card with a color-extracted blurred gradient background, album art, seek bar, and transport controls. Requires a /api/spotify route." }, { "name": "components-preloaders-greetings", "type": "registry:ui", "title": "Greeting Preloader", "description": "A greeting preloader that displays rapid greetings in different languages." }, { "name": "components-pricings-pricing-1", "type": "registry:ui", "title": "Pricing 1", "description": "Modern pricing grid with animated sliding numbers, billing toggle, and featured plan corner decorations." }, { "name": "components-pricings-pricing-2", "type": "registry:ui", "title": "Pricing 2", "description": "Three-column pricing with gradient featured card and illustrated cursor decoration." }, { "name": "components-pricings-pricing-3", "type": "registry:ui", "title": "Pricing 3", "description": "Asymmetric three-column pricing with elevated featured plan, amber badge, and security footer note." }, { "name": "components-pricings-pricing-4", "type": "registry:ui", "title": "Pricing 4", "description": "Pastel pricing cards with animated billing toggle, tag badges, and info rows." }, { "name": "components-pricings-pricing-5", "type": "registry:ui", "title": "Pricing 5", "description": "Horizontal list-style pricing layout with accent icon blobs, strikethrough original prices, and optional recommended badge." }, { "name": "components-pricings-pricing-6", "type": "registry:ui", "title": "Pricing 6", "description": "Tabbed individuals/teams pricing grid with coloured card backdrops, Avatar orbs, grain texture overlays, and feature checklists." }, { "name": "components-primitives-avatar", "type": "registry:ui", "title": "Avatar", "description": "An animated AI orb avatar with blinking eyes, 12 color presets, 3 sizes, and 3 shapes (circle, square, squircle)." }, { "name": "components-primitives-tree-filter", "type": "registry:ui", "title": "Tree Filter", "description": "Animated tree-structured filter with nested checkboxes, search, and group cycling." }, { "name": "components-radix-checkbox", "type": "registry:ui", "title": "Checkbox", "description": "A control that allows the user to toggle between checked and not checked." }, { "name": "components-radix-dropdown-menu", "type": "registry:ui", "title": "Dropdown Menu", "description": "Displays a menu to the user — such as a set of actions or functions — triggered by a button." }, { "name": "components-radix-hover-card", "type": "registry:ui", "title": "Hover Card", "description": "For sighted users to preview content available behind a link." }, { "name": "components-texts-text-highlighter", "type": "registry:ui", "title": "Text Highlighter", "description": "Rough-notation powered text annotations — highlight, underline, box, circle, and more." }, { "name": "components-texts-text-reveal", "type": "registry:ui", "title": "Text Reveal", "description": "Scramble-reveal animation that decodes characters progressively into the final text." }, { "name": "components-texts-text-shimmer", "type": "registry:ui", "title": "Text Shimmer", "description": "Sleek text shimmer effect." }, { "name": "components-texts-text-shimmer-wave", "type": "registry:ui", "title": "Text Shimmer Wave", "description": "3D wave shimmer effect that ripples through each character sequentially." }, { "name": "components-texts-typewriter", "type": "registry:ui", "title": "Typewriter", "description": "Animated typewriter effect with multi-sequence support, natural variance, delete animation, and auto-loop." }, { "name": "components-ui-badge", "type": "registry:ui", "title": "Badge", "description": "A badge component with semantic and color variants built on Base UI." }, { "name": "demo-components-ai-chat-container", "type": "registry:ui", "title": "Chat Container Demo", "description": "Demo of the Chat Container component." }, { "name": "demo-components-ai-message-bubble", "type": "registry:ui", "title": "Message Bubble Demo", "description": "Demo of the Message Bubble component inside a Chat Container." }, { "name": "demo-components-ai-model-selector", "type": "registry:ui", "title": "Model Selector Demo", "description": "Demo of the AI model selector modal component." }, { "name": "demo-components-ai-prompt-input", "type": "registry:ui", "title": "Prompt Input Demo", "description": "Demo of the AI prompt input interface." } ], "component_count": 288, "components_truncated": true, "component_types": { "registry:style": 1, "registry:ui": 271, "registry:component": 10, "registry:hook": 5, "registry:lib": 1 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 132, "name": "@ogimagecn", "category": "Uncategorized", "tags": [], "tagline": "Beautiful OG images, made simple. Ready to use, customizable Open Graph image components for React.", "short_description": "", "description": "Beautiful OG images, made simple. Ready to use, customizable Open Graph image components for React.", "homepage": "https://ogimagecn.vercel.app", "docs": "https://ogimagecn.vercel.app/docs", "github": "https://github.com/shadcn-labs/ogimagecn", "components_github": "https://github.com/shadcn-labs/ogimagecn/tree/main/registry", "github_default_branch": "main", "github_stars": 94, "last_commit": "2026-07-05T10:29:39Z", "archived": false, "license": "MIT", "open_issues": 1, "registry_template": "https://ogimagecn.vercel.app/r/{name}.json", "registry_index": "https://ogimagecn.vercel.app/r/registry.json", "components": [ "simple", "grid", "blog", "changelog", "quote", "shadcn-registry-1", "shadcn-registry-2", "shadcn-registry-3", "shadcn-registry-4", "shadcn-registry-5", "shadcn-registry-6", "photo", "product", "profile", "event", "stat", "logo", "terminal", "editorial", "showcase", "shiori", "owner" ], "component_items": [ { "name": "simple", "type": "registry:component", "title": "Simple", "description": "A minimal, centered Open Graph image with an eyebrow label, title, description, and brand mark." }, { "name": "grid", "type": "registry:component", "title": "Grid", "description": "A framed, technical Open Graph image with a dashed border grid and a corner brand mark." }, { "name": "blog", "type": "registry:component", "title": "Blog", "description": "An article Open Graph image with a category badge, headline, excerpt, and author row." }, { "name": "changelog", "type": "registry:component", "title": "Changelog", "description": "A release Open Graph image with a version pill, date, title, and a checklist of highlights." }, { "name": "quote", "type": "registry:component", "title": "Quote", "description": "A testimonial / tweet-style Open Graph image with a large quote and an author row." }, { "name": "shadcn-registry-1", "type": "registry:component", "title": "Shadcn Registry 1", "description": "A showcase Open Graph image for shadcn registries with logo, name, URL, description, and tag badges." }, { "name": "shadcn-registry-2", "type": "registry:component", "title": "Shadcn Registry 2", "description": "A clean Open Graph image with a light background, logo, name, category, title, and dot-separated tags." }, { "name": "shadcn-registry-3", "type": "registry:component", "title": "Shadcn Registry 3", "description": "A bold dark Open Graph image with large title, circular badge, ghost watermark, and credit text." }, { "name": "shadcn-registry-4", "type": "registry:component", "title": "Shadcn Registry 4", "description": "A centered dark Open Graph image with logo, name, title, and URL on a subtle dot pattern background." }, { "name": "shadcn-registry-5", "type": "registry:component", "title": "Shadcn Registry 5", "description": "A clean light Open Graph image with centered logo, name, title, and description inside a bordered frame." }, { "name": "shadcn-registry-6", "type": "registry:component", "title": "Shadcn Registry 6", "description": "A minimal Open Graph image with solid border lines, a logo in the top-left, and title/description at the bottom." }, { "name": "photo", "type": "registry:component", "title": "Photo", "description": "A full-bleed photo Open Graph image with a dark gradient scrim and a bottom-aligned title block." }, { "name": "product", "type": "registry:component", "title": "Product", "description": "A two-column product Open Graph image with brand and copy on the left, a product shot on the right, and a price pill." }, { "name": "profile", "type": "registry:component", "title": "Profile", "description": "A personal / portfolio Open Graph image with a circular avatar beside a name, role, bio, and website pill." }, { "name": "event", "type": "registry:component", "title": "Event", "description": "An event / launch Open Graph image with an eyebrow label, large title, and a date · location footer row." }, { "name": "stat", "type": "registry:component", "title": "Stat", "description": "A metric / dashboard Open Graph image with an eyebrow label, an oversized number, a trend pill, and a caption." }, { "name": "logo", "type": "registry:component", "title": "Logo", "description": "A centered brand Open Graph image with a logo tile, a large wordmark, and an optional tagline on a soft gradient field." }, { "name": "terminal", "type": "registry:component", "title": "Terminal", "description": "A minimal, technical Open Graph image with a wordmark and accent side-bar above a large wide-tracked uppercase headline." }, { "name": "editorial", "type": "registry:component", "title": "Editorial", "description": "A poster-style Open Graph image with oversized display type and a large faint ghost word set behind the content." }, { "name": "showcase", "type": "registry:component", "title": "Showcase", "description": "A product-showcase Open Graph image with a centered headline above a faux browser window and a minimal dashboard UI." }, { "name": "shiori", "type": "registry:component", "title": "Shiori", "description": "A clean, minimal Open Graph image with a light cream background, an orange gradient circle logo, and a bold title beside a muted description." }, { "name": "owner", "type": "registry:component", "title": "Owner", "description": "A clean Open Graph image with a light background, eyebrow text, bold headline, and three rounded photos at the bottom." } ], "component_count": 22, "components_truncated": false, "component_types": { "registry:component": 22 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 115, "name": "@openpolicy", "category": "Niche/single-purpose", "tags": [ "ai" ], "tagline": "Open-source components for building terms, privacy policies and cookie banners.", "short_description": "Open-source components for building terms, privacy policies and cookie banners.", "description": "PolicyStack is an open-source, AI-first toolkit for adding privacy policies and consent management to React (and Vue, Svelte, Solid, Angular) apps. The shadcn registry provides copy-paste components for terms pages, privacy policies, and cookie consent banners. A typed policystack.ts config drives policy rendering and consent gating; a Vite plugin compiles policies at build time and fails builds on undeclared cookies. Packages include @policystack/react (policy, consent, provider), a headless consent state machine (~4kb), and an optional cloud control plane for versioning and audit trails. Apache-2.0 licensed. Use for: embedding GDPR/CCPA-compliant privacy policy UI and consent banners directly into your React app without third-party iframes.", "homepage": "https://www.openpolicy.sh", "docs": "https://policystack.dev/docs", "github": "https://github.com/jamiedavenport/policystack", "components_github": null, "github_default_branch": "main", "github_stars": 156, "last_commit": "2026-05-26T13:34:22Z", "archived": false, "license": "Apache-2.0", "open_issues": 1, "registry_template": "https://www.openpolicy.sh/r/{name}.json", "registry_index": null, "components": [], "component_items": [], "component_count": null, "components_truncated": false, "component_types": {}, "has_logo": true, "enrichment_errors": [ "registry_index_unresolved" ], "featured": false }, { "number": 116, "name": "@openstatus", "category": "Niche/single-purpose", "tags": [ "components" ], "tagline": "Hand-crafted, accessible components for building beautiful status pages.", "short_description": "Hand-crafted, accessible components for building beautiful status pages.", "description": "Hand-crafted, accessible shadcn-registry components extracted from the OpenStatus open-source status page and uptime monitoring platform (AGPL-3.0). The registry ships status-page-specific primitives including StatusPage shell, StatusPageHeader, StatusPageFooter, StatusBanner, StatusBar, StatusComponent, StatusComponentGroup, StatusFeed, StatusEvents, StatusTimestamp, StatusLocale Switcher, StatusTheme Switcher, and incident-related components. Built with Tailwind CSS and React. The broader platform supports 28-region uptime monitoring, incident communication, and subscriber notifications. Use for: building branded incident/status page UIs or embedding live service health widgets into existing Next.js or React applications.", "homepage": "https://openstatus.dev/registry", "docs": "https://docs.openstatus.dev", "github": "https://github.com/openstatusHQ/openstatus", "components_github": null, "github_default_branch": "main", "github_stars": 8843, "last_commit": "2026-07-07T19:18:28Z", "archived": false, "license": "AGPL-3.0", "open_issues": 59, "registry_template": "https://openstatus.dev/r/{name}.json", "registry_index": "https://openstatus.dev/r/registry.json", "components": [ "use-media-query", "use-copy-to-clipboard", "status-types", "status-utils", "status-icon", "status-layout", "status-blank", "status-i18n", "status-timestamp", "status-banner", "status-component", "status-component-group", "status-events", "status-bar", "status-calendar", "status-feed", "status-theme-switcher", "status-locale-switcher", "status-updates", "status-page-get-in-touch", "status-page-header", "status-page-footer", "status-page-shell", "status-chrome", "status-complete", "status-essentials" ], "component_items": [ { "name": "use-media-query", "type": "registry:hook", "title": "Use Media Query", "description": "React hook for responsive media query detection" }, { "name": "use-copy-to-clipboard", "type": "registry:hook", "title": "Use Copy to Clipboard", "description": "React hook for copying text to clipboard with toast notifications" }, { "name": "status-types", "type": "registry:lib", "title": "Status Types", "description": "TypeScript type definitions for status components" }, { "name": "status-utils", "type": "registry:lib", "title": "Status Utilities", "description": "Utility functions for status formatting and display" }, { "name": "status-icon", "type": "registry:block", "title": "Status Icon", "description": "Unified status icon component with variants for different contexts" }, { "name": "status-layout", "type": "registry:block", "title": "Status Layout", "description": "Layout primitives for composing status displays (Status, StatusHeader, StatusTitle, etc.)" }, { "name": "status-blank", "type": "registry:block", "title": "Status Blank States", "description": "Empty and skeleton state components for loading and no-data scenarios" }, { "name": "status-i18n", "type": "registry:block", "title": "Status Blocks i18n Provider", "description": "React context for supplying translated labels and locale-aware date formatters to status blocks. Optional — blocks fall back to defaultStatusBlocksLabels (en-U…" }, { "name": "status-timestamp", "type": "registry:block", "title": "Status Timestamp", "description": "Interactive timestamp display with tooltip (simple) or hover-card (rich) variants showing multiple timezone formats" }, { "name": "status-banner", "type": "registry:block", "title": "Status Banner", "description": "Alert-style status banner with tabs support and timestamp display" }, { "name": "status-component", "type": "registry:block", "title": "Status Component", "description": "Monitor component primitives for building status displays" }, { "name": "status-component-group", "type": "registry:block", "title": "Status Component Group", "description": "Collapsible group wrapper for status components" }, { "name": "status-events", "type": "registry:block", "title": "Status Events", "description": "Event timeline components for displaying status reports and maintenance updates" }, { "name": "status-bar", "type": "registry:block", "title": "Status Bar", "description": "Interactive status timeline with hover, keyboard navigation, and event display" }, { "name": "status-calendar", "type": "registry:block", "title": "Status Calendar", "description": "Monthly calendar view of status history with per-day markers and event hover cards" }, { "name": "status-feed", "type": "registry:block", "title": "Status Feed", "description": "Unified feed component combining status reports and maintenance events" }, { "name": "status-theme-switcher", "type": "registry:block", "title": "Status Theme Switcher", "description": "Agnostic light/dark/system theme switcher. Caller owns the value and onValueChange wiring (next-themes, form state, etc.)" }, { "name": "status-locale-switcher", "type": "registry:block", "title": "Status Locale Switcher", "description": "Agnostic locale picker. Caller owns value, onValueChange, and label resolution — no next-intl, router, or locale detection" }, { "name": "status-updates", "type": "registry:block", "title": "Status Updates", "description": "Popover with copy-link primitives for RSS, Atom, JSON, Slack, and SSH subscription channels. Flat exports — caller composes layout (tabs, sections, etc.)" }, { "name": "status-page-get-in-touch", "type": "registry:block", "title": "Status Page Get-in-Touch", "description": "Two flat button primitives (icon + text) with tooltip chrome for the contact link in a status page header" }, { "name": "status-page-header", "type": "registry:block", "title": "Status Page Header", "description": "Presentation-only header chrome (brand, nav, actions). Routing-agnostic — apps inject their own Link component via asChild" }, { "name": "status-page-footer", "type": "registry:block", "title": "Status Page Footer", "description": "Presentation-only footer chrome (powered-by, action cluster). Embed/white-label gating, switchers, and tRPC fetch stay in the wrapping app" }, { "name": "status-page-shell", "type": "registry:block", "title": "Status Page Shell", "description": "Outer chrome wrappers (StatusPageShell + StatusPageMain) around header / main / footer. Routing-agnostic with embed-aware Tailwind classes that activate only w…" }, { "name": "status-chrome", "type": "registry:block", "title": "Status Page Chrome", "description": "Full status page chrome — shell, header, footer, get-in-touch, status-updates, theme + locale switchers. Combine with status-essentials or status-complete for …" }, { "name": "status-complete", "type": "registry:block", "title": "Status Page (Complete)", "description": "Complete status page components including all primitives, displays, interactive elements, and chrome (header / footer / switchers)" }, { "name": "status-essentials", "type": "registry:block", "title": "Status Page (Essentials)", "description": "Essential status page components for basic status displays" } ], "component_count": 26, "components_truncated": false, "component_types": { "registry:hook": 2, "registry:lib": 2, "registry:block": 22 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 117, "name": "@optics", "category": "Design system", "tags": [ "ai", "components" ], "tagline": "A design system that distributes re-styled components, utilities, and hooks ready to use.", "short_description": "A design system that distributes re-styled components, utilities, and hooks ready to use.", "description": "A comprehensive personal design system and component registry for Next.js and React apps, built on Base UI primitives (not Radix) with Tailwind CSS v4 and React 19. Provides 60+ components including Accordion through Tooltip, plus Grid, Guided Tour, Code Snippet, Code Block, Item, Kbd, Multi Select, Show More, Spinner, Star Rating, Theme Switcher, and Timezone. Also includes Web Interface Guidelines, SEO/Metadata utilities, a Biome config collection, Next.js configuration templates, and an MCP server plus llms.txt resource. Free and open source, shadcn CLI compatible. Use for: teams wanting a Base UI-backed alternative to Radix-based shadcn registries with broader tooling (guidelines, configs, MCP integration) bundled in.", "homepage": "https://optics.agusmayol.com.ar", "docs": "https://optics.agusmayol.com.ar", "github": "https://github.com/agusmayol/optics", "components_github": "https://github.com/agusmayol/optics/tree/main/registry", "github_default_branch": "main", "github_stars": 223, "last_commit": "2026-04-11T05:00:00Z", "archived": false, "license": "MIT", "open_issues": 3, "registry_template": "https://optics.agusmayol.com.ar/r/{name}.json", "registry_index": "https://optics.agusmayol.com.ar/r/registry.json", "components": [ "accordion", "alert-dialog", "alert", "aspect-ratio", "avatar", "badge", "breadcrumb", "button-group", "button", "calendar", "card", "carousel", "chart", "checkbox", "code-block", "code-snippet", "collapsible", "command", "context-menu", "data-table", "date-picker", "dialog", "drawer", "dropdown-menu", "empty", "field", "form", "grid", "guided-tour", "hover-card", "input-group", "input-otp", "input", "item", "kbd", "label", "menubar", "multi-select", "navigation-menu", "pagination", "popover", "progress", "radio-group", "resizable", "scroll-area", "select", "separator", "sheet", "show-more", "sidebar", "skeleton", "slider", "sonner", "spinner", "star-rating", "switch", "table", "tabs", "textarea", "theme-switcher", "timezone", "toggle-group", "toggle", "tooltip", "get-strict-context", "use-controlled-state", "utils", "use-auto-height", "use-has-primary-touch", "highlight", "auto-height", "slot", "cursor-rule-back-end", "cursor-rule-bulk-processing", "cursor-rule-commits-convention", "cursor-rule-front-end", "cursor-rule-general", "cursor-rule-react-optimization", "cursor-rule-web-interface-guidelines" ], "component_items": [ { "name": "accordion", "type": "registry:component", "title": "Accordion", "description": "A vertically stacked set of interactive headings that each reveal a section of content." }, { "name": "alert-dialog", "type": "registry:component", "title": "Alert Dialog", "description": "A modal dialog that interrupts the user with important content and expects a response." }, { "name": "alert", "type": "registry:component", "title": "Alert", "description": "Displays a callout for user attention." }, { "name": "aspect-ratio", "type": "registry:component", "title": "Aspect Ratio", "description": "Displays content within a desired ratio." }, { "name": "avatar", "type": "registry:component", "title": "Avatar", "description": "An image element with a fallback for representing the user." }, { "name": "badge", "type": "registry:component", "title": "Badge", "description": "Displays a badge or a component that looks like a badge." }, { "name": "breadcrumb", "type": "registry:component", "title": "Breadcrumb", "description": "Displays the path to the current resource using a hierarchy of links." }, { "name": "button-group", "type": "registry:component", "title": "Button Group", "description": "Groups buttons together with proper spacing and styling." }, { "name": "button", "type": "registry:component", "title": "Button", "description": "Displays a button or a component that looks like a button." }, { "name": "calendar", "type": "registry:component", "title": "Calendar", "description": "A date field component that allows users to enter and edit date." }, { "name": "card", "type": "registry:component", "title": "Card", "description": "Displays a card with header, content, and footer." }, { "name": "carousel", "type": "registry:component", "title": "Carousel", "description": "A carousel with motion and swipe built using Embla." }, { "name": "chart", "type": "registry:component", "title": "Chart", "description": "Beautiful charts built with Recharts." }, { "name": "checkbox", "type": "registry:component", "title": "Checkbox", "description": "A control that allows the user to toggle between checked and unchecked states." }, { "name": "code-block", "type": "registry:component", "title": "Code Block", "description": "A syntax-highlighted code block component with copy functionality." }, { "name": "code-snippet", "type": "registry:component", "title": "Code Snippet", "description": "A code snippet component with tabs and copy functionality." }, { "name": "collapsible", "type": "registry:component", "title": "Collapsible", "description": "An interactive component which expands/collapses a panel." }, { "name": "command", "type": "registry:component", "title": "Command", "description": "Fast, composable, unstyled command menu for React." }, { "name": "context-menu", "type": "registry:component", "title": "Context Menu", "description": "Displays a menu to the user triggered by a right click or a long press." }, { "name": "data-table", "type": "registry:component", "title": "Data Table", "description": "Powerful table and datagrid built with TanStack Table." }, { "name": "date-picker", "type": "registry:component", "title": "Date Picker", "description": "A date field component that allows users to enter and edit date." }, { "name": "dialog", "type": "registry:component", "title": "Dialog", "description": "A window overlaid on either the primary window or another dialog window." }, { "name": "drawer", "type": "registry:component", "title": "Drawer", "description": "A drawer component built with Vaul." }, { "name": "dropdown-menu", "type": "registry:component", "title": "Dropdown Menu", "description": "Displays a menu to the user — such as a set of actions or functions — triggered by a button." }, { "name": "empty", "type": "registry:component", "title": "Empty", "description": "Displays an empty state with optional illustration, title, and description." }, { "name": "field", "type": "registry:component", "title": "Field", "description": "A field component for grouping form elements with labels and descriptions." }, { "name": "form", "type": "registry:component", "title": "Form", "description": "Builds forms with React Hook Form." }, { "name": "grid", "type": "registry:component", "title": "Grid", "description": "A flexible grid system component for layout." }, { "name": "guided-tour", "type": "registry:component", "title": "Guided Tour", "description": "A guided tour component for onboarding users." }, { "name": "hover-card", "type": "registry:component", "title": "Hover Card", "description": "For sighted users to preview content available behind a link." }, { "name": "input-group", "type": "registry:component", "title": "Input Group", "description": "Groups input fields with addons, buttons, and text." }, { "name": "input-otp", "type": "registry:component", "title": "Input OTP", "description": "Accessible one-time password component with copy paste support." }, { "name": "input", "type": "registry:component", "title": "Input", "description": "Displays a form input field or a component that looks like an input." }, { "name": "item", "type": "registry:component", "title": "Item", "description": "A flexible item component for displaying content." }, { "name": "kbd", "type": "registry:component", "title": "KBD", "description": "Keyboard key component for displaying keyboard shortcuts." }, { "name": "label", "type": "registry:component", "title": "Label", "description": "Renders an accessible label associated with controls." }, { "name": "menubar", "type": "registry:component", "title": "Menubar", "description": "A visually persistent menu common in desktop applications." }, { "name": "multi-select", "type": "registry:component", "title": "Multi Select", "description": "A select component for allowing multiple selections." }, { "name": "navigation-menu", "type": "registry:component", "title": "Navigation Menu", "description": "A collection of links for navigating websites." }, { "name": "pagination", "type": "registry:component", "title": "Pagination", "description": "Pagination with page navigation, next and previous links." }, { "name": "popover", "type": "registry:component", "title": "Popover", "description": "Displays rich content in a portal, triggered by a button." }, { "name": "progress", "type": "registry:component", "title": "Progress", "description": "Displays an indicator showing the completion progress of a task." }, { "name": "radio-group", "type": "registry:component", "title": "Radio Group", "description": "A set of checkable buttons—known as radio buttons." }, { "name": "resizable", "type": "registry:component", "title": "Resizable", "description": "Accessible resizable panel groups and layouts." }, { "name": "scroll-area", "type": "registry:component", "title": "Scroll Area", "description": "Augments native scroll functionality for custom, cross-browser styling." }, { "name": "select", "type": "registry:component", "title": "Select", "description": "Displays a list of options for the user to pick from." }, { "name": "separator", "type": "registry:component", "title": "Separator", "description": "Visually or semantically separates content." }, { "name": "sheet", "type": "registry:component", "title": "Sheet", "description": "Extends the Dialog component to display content that complements the main content." }, { "name": "show-more", "type": "registry:component", "title": "Show More", "description": "A component that shows/hides additional content with smooth animations." }, { "name": "sidebar", "type": "registry:component", "title": "Sidebar", "description": "A composable sidebar component with desktop and mobile support." }, { "name": "skeleton", "type": "registry:component", "title": "Skeleton", "description": "Use to show a placeholder while content is loading." }, { "name": "slider", "type": "registry:component", "title": "Slider", "description": "An input where the user selects a value from within a given range." }, { "name": "sonner", "type": "registry:component", "title": "Sonner", "description": "Toast component built with Sonner." }, { "name": "spinner", "type": "registry:component", "title": "Spinner", "description": "An animated spinner component." }, { "name": "star-rating", "type": "registry:component", "title": "Star Rating", "description": "An interactive star rating component." }, { "name": "switch", "type": "registry:component", "title": "Switch", "description": "A control that allows the user to toggle between checked and unchecked states." }, { "name": "table", "type": "registry:component", "title": "Table", "description": "A responsive table component." }, { "name": "tabs", "type": "registry:component", "title": "Tabs", "description": "A set of layered sections of content—known as tab panels." }, { "name": "textarea", "type": "registry:component", "title": "Textarea", "description": "Displays a form textarea field or a component that looks like a textarea." }, { "name": "theme-switcher", "type": "registry:component", "title": "Theme Switcher", "description": "A theme switcher component for toggling between themes." } ], "component_count": 79, "components_truncated": false, "component_types": { "registry:component": 67, "registry:lib": 5, "registry:file": 7 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 118, "name": "@oui", "category": "Component library (general)", "tags": [ "components" ], "tagline": "React Aria Components with shadcn characteristics.Copy-and-paste react aria components that run side-by-side with shadcn components.", "short_description": "React Aria Components with shadcn characteristics.Copy-and-paste react aria components that run side-by-side with shadcn components.", "description": "React Aria Components styled with shadcn UI characteristics, designed to run side-by-side with existing shadcn installs without overwriting any shadcn files. Covers 50+ components: Alert, Autocomplete, Badge, Base, Button, Button Group, Calendar, Card, Checkbox, Checkbox Group, Combo Box, Date Field, Date Picker, Dialog, Disclosure, Field, Form, Input, Input Group, Keyboard, Label, Link, List Box, Menu, Modal, Number Field, Pagination, Popover, Radio Group, React Router bindings, Search Field, Select, Separator, Sheet, Sidebar, Slider, Switch, Table, Tabs, Text Area, Text Field, Toggle Button, Toggle Button Group, and Tooltip. Adds accessibility and ARIA compliance beyond Radix-based alternatives. Free. Use for: projects needing ARIA-first accessible components with shadcn visual styling, especially where WAI-ARIA compliance is a hard requirement.", "homepage": "https://oui.mw10013.workers.dev", "docs": "https://oui.mw10013.workers.dev", "github": "https://github.com/mw10013/oui", "components_github": "https://github.com/mw10013/oui/tree/main/registry", "github_default_branch": "main", "github_stars": 7, "last_commit": "2025-12-14T19:35:12Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://oui.mw10013.workers.dev/r/{name}.json", "registry_index": "https://oui.mw10013.workers.dev/r/registry.json", "components": [ "oui-alert", "oui-alert-demo", "oui-autocomplete-demo", "oui-autocomplete-demo-avatar", "oui-autocomplete-demo-searchable", "oui-badge", "oui-badge-demo", "oui-base", "oui-button", "oui-button-demo", "oui-button-demo-outline", "oui-button-demo-destructive", "oui-button-demo-disabled", "oui-button-demo-disabled-animation", "oui-button-demo-ghost", "oui-button-demo-icon-left", "oui-button-demo-icon-right", "oui-button-demo-lg", "oui-button-demo-link", "oui-button-demo-secondary", "oui-button-demo-sm", "oui-button-group", "oui-button-group-demo", "oui-calendar", "oui-calendar-demo", "oui-card", "oui-checkbox", "oui-checkbox-demo", "oui-checkbox-demo-blue", "oui-checkbox-group", "oui-checkbox-group-demo", "oui-checkbox-group-demo-invalid", "oui-combo-box", "oui-combo-box-demo", "oui-combo-box-demo-avatar", "oui-combo-box-demo-header", "oui-date-field", "oui-date-field-demo", "oui-date-picker", "oui-date-picker-demo", "oui-dialog", "oui-dialog-demo", "oui-dialog-demo-scrollable-content", "oui-dialog-demo-sticky-footer", "oui-dialog-demo-alert", "oui-dialog-demo-alert-confirm", "oui-disclosure", "oui-disclosure-demo", "oui-disclosure-demo-group", "oui-disclosure-demo-text", "oui-field", "oui-field-demo", "oui-field-demo-fieldset", "oui-form-demo", "oui-index", "oui-react-router-index", "oui-input", "oui-input-demo", "oui-input-demo-password", "oui-input-demo-disabled", "oui-input-group", "oui-input-group-demo", "oui-keyboard", "oui-keyboard-demo", "oui-label", "oui-label-demo", "oui-label-demo-disabled", "oui-link", "oui-link-demo", "oui-link-demo-hover", "oui-link-demo-always", "oui-link-demo-current", "oui-link-demo-focus", "oui-link-demo-disabled", "oui-link-demo-button", "oui-link-demo-button-outline", "oui-link-demo-button-destructive", "oui-link-demo-button-disabled", "oui-link-demo-icon", "oui-link-demo-login", "oui-list-box", "oui-list-box-demo", "oui-list-box-demo-multiple", "oui-menu", "oui-menu-demo", "oui-menu-demo-checkboxes", "oui-menu-demo-radio-group", "oui-menu-demo-avatar", "oui-menu-demo-avatar-only", "oui-menu-demo-icon", "oui-modal", "oui-number-field", "oui-number-field-demo", "oui-pagination", "oui-pagination-demo", "oui-popover", "oui-popover-demo", "oui-radio-group", "oui-radio-group-demo", "oui-radio-group-demo-green" ], "component_items": [ { "name": "oui-alert", "type": "registry:ui", "title": "Alert", "description": "A shadcn Alert for a form displaying form action result." }, { "name": "oui-alert-demo", "type": "registry:component", "title": null, "description": null }, { "name": "oui-autocomplete-demo", "type": "registry:component", "title": null, "description": null }, { "name": "oui-autocomplete-demo-avatar", "type": "registry:component", "title": null, "description": null }, { "name": "oui-autocomplete-demo-searchable", "type": "registry:component", "title": null, "description": null }, { "name": "oui-badge", "type": "registry:ui", "title": "Badge", "description": "A className function to style a react aria component as a shadcn Badge" }, { "name": "oui-badge-demo", "type": "registry:component", "title": null, "description": null }, { "name": "oui-base", "type": "registry:ui", "title": "Base", "description": "Base styles and utilities for Oui." }, { "name": "oui-button", "type": "registry:ui", "title": "Button", "description": "React aria components Button with shadcn characteristics." }, { "name": "oui-button-demo", "type": "registry:component", "title": null, "description": null }, { "name": "oui-button-demo-outline", "type": "registry:component", "title": null, "description": null }, { "name": "oui-button-demo-destructive", "type": "registry:component", "title": null, "description": null }, { "name": "oui-button-demo-disabled", "type": "registry:component", "title": null, "description": null }, { "name": "oui-button-demo-disabled-animation", "type": "registry:component", "title": null, "description": null }, { "name": "oui-button-demo-ghost", "type": "registry:component", "title": null, "description": null }, { "name": "oui-button-demo-icon-left", "type": "registry:component", "title": null, "description": null }, { "name": "oui-button-demo-icon-right", "type": "registry:component", "title": null, "description": null }, { "name": "oui-button-demo-lg", "type": "registry:component", "title": null, "description": null }, { "name": "oui-button-demo-link", "type": "registry:component", "title": null, "description": null }, { "name": "oui-button-demo-secondary", "type": "registry:component", "title": null, "description": null }, { "name": "oui-button-demo-sm", "type": "registry:component", "title": null, "description": null }, { "name": "oui-button-group", "type": "registry:ui", "title": "Button Group", "description": "Shadcn Button Group with react aria component characteristics." }, { "name": "oui-button-group-demo", "type": "registry:component", "title": null, "description": null }, { "name": "oui-calendar", "type": "registry:ui", "title": "Calendar", "description": "React aria components Calendar with shadcn characteristics." }, { "name": "oui-calendar-demo", "type": "registry:component", "title": null, "description": null }, { "name": "oui-card", "type": "registry:ui", "title": "Card", "description": "CardGridListItem for shadcn Card." }, { "name": "oui-checkbox", "type": "registry:ui", "title": "Checkbox", "description": "React aria components Checkbox with shadcn characteristics." }, { "name": "oui-checkbox-demo", "type": "registry:component", "title": null, "description": null }, { "name": "oui-checkbox-demo-blue", "type": "registry:component", "title": null, "description": null }, { "name": "oui-checkbox-group", "type": "registry:ui", "title": "Checkbox Group", "description": "React aria components Checkbox Group with shadcn characteristics." }, { "name": "oui-checkbox-group-demo", "type": "registry:component", "title": null, "description": null }, { "name": "oui-checkbox-group-demo-invalid", "type": "registry:component", "title": null, "description": null }, { "name": "oui-combo-box", "type": "registry:ui", "title": "Combo Box", "description": "React aria components Combo Box with shadcn characteristics." }, { "name": "oui-combo-box-demo", "type": "registry:component", "title": null, "description": null }, { "name": "oui-combo-box-demo-avatar", "type": "registry:component", "title": null, "description": null }, { "name": "oui-combo-box-demo-header", "type": "registry:component", "title": null, "description": null }, { "name": "oui-date-field", "type": "registry:ui", "title": "Date Field", "description": "React aria components DateField with shadcn characteristics." }, { "name": "oui-date-field-demo", "type": "registry:component", "title": null, "description": null }, { "name": "oui-date-picker", "type": "registry:ui", "title": "Date Picker", "description": "React aria components DatePicker with shadcn characteristics." }, { "name": "oui-date-picker-demo", "type": "registry:component", "title": null, "description": null }, { "name": "oui-dialog", "type": "registry:ui", "title": "Dialog", "description": "React aria components Dialog with shadcn characteristics." }, { "name": "oui-dialog-demo", "type": "registry:component", "title": null, "description": null }, { "name": "oui-dialog-demo-scrollable-content", "type": "registry:component", "title": null, "description": null }, { "name": "oui-dialog-demo-sticky-footer", "type": "registry:component", "title": null, "description": null }, { "name": "oui-dialog-demo-alert", "type": "registry:component", "title": null, "description": null }, { "name": "oui-dialog-demo-alert-confirm", "type": "registry:component", "title": null, "description": null }, { "name": "oui-disclosure", "type": "registry:ui", "title": "Disclosure", "description": "React aria components Disclosure with shadcn characteristics." }, { "name": "oui-disclosure-demo", "type": "registry:component", "title": null, "description": null }, { "name": "oui-disclosure-demo-group", "type": "registry:component", "title": null, "description": null }, { "name": "oui-disclosure-demo-text", "type": "registry:component", "title": null, "description": null }, { "name": "oui-field", "type": "registry:ui", "title": "Field", "description": "Shadcn Field with react aria components characteristics." }, { "name": "oui-field-demo", "type": "registry:component", "title": null, "description": null }, { "name": "oui-field-demo-fieldset", "type": "registry:component", "title": null, "description": null }, { "name": "oui-form-demo", "type": "registry:component", "title": null, "description": null }, { "name": "oui-index", "type": "registry:ui", "title": "Oui Index", "description": "All oui ui components." }, { "name": "oui-react-router-index", "type": "registry:component", "title": "Oui React Router Index", "description": "All react router related components and extensions." }, { "name": "oui-input", "type": "registry:ui", "title": "Input", "description": "React aria components Input with shadcn characteristics." }, { "name": "oui-input-demo", "type": "registry:component", "title": null, "description": null }, { "name": "oui-input-demo-password", "type": "registry:component", "title": null, "description": null }, { "name": "oui-input-demo-disabled", "type": "registry:component", "title": null, "description": null } ], "component_count": 137, "components_truncated": true, "component_types": { "registry:ui": 42, "registry:component": 94, "registry:lib": 1 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 137, "name": "@paceui", "category": "Uncategorized", "tags": [], "tagline": "Carefully built UI blocks for real apps and dashboards, designed to integrate smoothly from early ideas to production releases.", "short_description": "", "description": "Carefully built UI blocks for real apps and dashboards, designed to integrate smoothly from early ideas to production releases.", "homepage": "https://paceui.com", "docs": null, "github": "https://github.com/pacekit/ui", "components_github": "https://github.com/pacekit/ui/tree/main/src/components", "github_default_branch": "main", "github_stars": 269, "last_commit": "2026-03-24T09:35:16Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://paceui.com/r/{name}.json", "registry_index": "https://paceui.com/r/registry.json", "components": [ "index", "interactive-logs-chart", "traffic-logs-chart", "interactive-sales-chart", "channel-sales-chart", "live-logs-feed", "create-user-form", "usage-logs-meter", "source-sales-meter", "upgrade-sales-promo", "simple-logs-stat", "rich-sales-stat", "simple-logs-table", "product-sales-table", "simple-users-table", "shadcn-day-fan", "form-input", "form-password", "form-select", "form-switch", "form-textarea", "form-checkbox", "form-error" ], "component_items": [ { "name": "index", "type": "registry:style", "title": null, "description": null }, { "name": "interactive-logs-chart", "type": "registry:block", "title": "Interactive Logs Chart", "description": "An interactive chart visualizing system logs over time with data tooltips and active hover states." }, { "name": "traffic-logs-chart", "type": "registry:block", "title": "Traffic Logs Chart", "description": "A visual representation of web traffic volume and request spikes across different time periods." }, { "name": "interactive-sales-chart", "type": "registry:block", "title": "Interactive Sales Chart", "description": "A dynamic chart tracking revenue trends and performance with interactive cursor details and tooltips." }, { "name": "channel-sales-chart", "type": "registry:block", "title": "Channel Sales Chart", "description": "A circular chart illustrating revenue distribution across different marketing acquisition and sales channels." }, { "name": "live-logs-feed", "type": "registry:block", "title": "Live Log Feed", "description": "A real-time activity stream displaying recent system events and errors in a chronological layout." }, { "name": "create-user-form", "type": "registry:block", "title": "Create User Form", "description": "Structured account creation form for onboarding new team members, including profile details, role assignment, department selection, and secure password setup." }, { "name": "usage-logs-meter", "type": "registry:block", "title": "Usage Logs Meter", "description": "A visual gauge displaying current system resource consumption against defined operational quota limits." }, { "name": "source-sales-meter", "type": "registry:block", "title": "Source Sales Meter", "description": "A list of progress bars ranking sales performance by acquisition source with percentage indicators." }, { "name": "upgrade-sales-promo", "type": "registry:block", "title": "Upgrade Sales Promo", "description": "An attention-grabbing card encouraging users to unlock premium analytics features and historical data access." }, { "name": "simple-logs-stat", "type": "registry:block", "title": "Simple Log Stat", "description": "A minimal statistic card displaying total log counts with a clean, numerical layout." }, { "name": "rich-sales-stat", "type": "registry:block", "title": "Rich Sales Stat", "description": "A detailed dashboard card highlighting total revenue with trend indicators and percentage growth." }, { "name": "simple-logs-table", "type": "registry:block", "title": "Simple Log Table", "description": "A clean data table listing system events with timestamp, severity, and message columns." }, { "name": "product-sales-table", "type": "registry:block", "title": "Product Sales Table", "description": "A comprehensive data list showing product performance, quantities sold, and total revenue generated." }, { "name": "simple-users-table", "type": "registry:block", "title": "Users Table", "description": "Structured table layout for managing team members, showing profile details, roles, departments, account status, and recent activity." }, { "name": "shadcn-day-fan", "type": "registry:block", "title": "Shadcn Day", "description": "Use this component when highlighting special events, milestones, or important dates." }, { "name": "form-input", "type": "registry:component", "title": "Form Input", "description": "A form input component with validation and error handling." }, { "name": "form-password", "type": "registry:component", "title": "Form Password", "description": "A password input field with visibility toggle and validation." }, { "name": "form-select", "type": "registry:component", "title": "Form Select", "description": "A select input field with options and validation." }, { "name": "form-switch", "type": "registry:component", "title": "Form Switch", "description": "A switch input field with on/off state and validation." }, { "name": "form-textarea", "type": "registry:component", "title": "Form Textarea", "description": "A textarea input field with validation and error handling." }, { "name": "form-checkbox", "type": "registry:component", "title": "Form Checkbox", "description": "A checkbox input field with validation and error handling." }, { "name": "form-error", "type": "registry:component", "title": "Form Error", "description": "A component for displaying form validation errors." } ], "component_count": 23, "components_truncated": false, "component_types": { "registry:style": 1, "registry:block": 15, "registry:component": 7 }, "has_logo": true, "enrichment_errors": [ "docs_unresolved" ], "featured": false }, { "number": 119, "name": "@pacekit", "category": "Dashboard/admin templates", "tags": [ "dashboard" ], "tagline": "Carefully built UI blocks for real apps and dashboards, designed to integrate smoothly from early ideas to production releases.", "short_description": "Carefully built UI blocks for real apps and dashboards, designed to integrate smoothly from early ideas to production releases.", "description": "A library of 50+ professional React UI components and ready-to-use UI blocks built with Tailwind CSS and TypeScript, specifically designed for dashboards and production apps. Organized into Blocks (dashboard sections) and component-level primitives; the structured JSON schema describes 40 component categories. Focuses on practical, real-app patterns from early prototypes to production, with clean integration via shadcn CLI. Free and open source. Use for: bootstrapping dashboard and admin interfaces with production-quality blocks that need no significant restyling before shipping.", "homepage": "https://ui.pacekit.dev", "docs": "https://ui.pacekit.dev", "github": "https://github.com/pacekit/ui", "components_github": "https://github.com/pacekit/ui/tree/main/src/components", "github_default_branch": "main", "github_stars": 269, "last_commit": "2026-03-24T09:35:16Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://ui.pacekit.dev/r/{name}.json", "registry_index": "https://ui.pacekit.dev/r/registry.json", "components": [ "index", "interactive-logs-chart", "traffic-logs-chart", "interactive-sales-chart", "channel-sales-chart", "live-logs-feed", "create-user-form", "usage-logs-meter", "source-sales-meter", "upgrade-sales-promo", "simple-logs-stat", "rich-sales-stat", "simple-logs-table", "product-sales-table", "simple-users-table", "shadcn-day-fan", "form-input", "form-password", "form-select", "form-switch", "form-textarea", "form-checkbox", "form-error" ], "component_items": [ { "name": "index", "type": "registry:style", "title": null, "description": null }, { "name": "interactive-logs-chart", "type": "registry:block", "title": "Interactive Logs Chart", "description": "An interactive chart visualizing system logs over time with data tooltips and active hover states." }, { "name": "traffic-logs-chart", "type": "registry:block", "title": "Traffic Logs Chart", "description": "A visual representation of web traffic volume and request spikes across different time periods." }, { "name": "interactive-sales-chart", "type": "registry:block", "title": "Interactive Sales Chart", "description": "A dynamic chart tracking revenue trends and performance with interactive cursor details and tooltips." }, { "name": "channel-sales-chart", "type": "registry:block", "title": "Channel Sales Chart", "description": "A circular chart illustrating revenue distribution across different marketing acquisition and sales channels." }, { "name": "live-logs-feed", "type": "registry:block", "title": "Live Log Feed", "description": "A real-time activity stream displaying recent system events and errors in a chronological layout." }, { "name": "create-user-form", "type": "registry:block", "title": "Create User Form", "description": "Structured account creation form for onboarding new team members, including profile details, role assignment, department selection, and secure password setup." }, { "name": "usage-logs-meter", "type": "registry:block", "title": "Usage Logs Meter", "description": "A visual gauge displaying current system resource consumption against defined operational quota limits." }, { "name": "source-sales-meter", "type": "registry:block", "title": "Source Sales Meter", "description": "A list of progress bars ranking sales performance by acquisition source with percentage indicators." }, { "name": "upgrade-sales-promo", "type": "registry:block", "title": "Upgrade Sales Promo", "description": "An attention-grabbing card encouraging users to unlock premium analytics features and historical data access." }, { "name": "simple-logs-stat", "type": "registry:block", "title": "Simple Log Stat", "description": "A minimal statistic card displaying total log counts with a clean, numerical layout." }, { "name": "rich-sales-stat", "type": "registry:block", "title": "Rich Sales Stat", "description": "A detailed dashboard card highlighting total revenue with trend indicators and percentage growth." }, { "name": "simple-logs-table", "type": "registry:block", "title": "Simple Log Table", "description": "A clean data table listing system events with timestamp, severity, and message columns." }, { "name": "product-sales-table", "type": "registry:block", "title": "Product Sales Table", "description": "A comprehensive data list showing product performance, quantities sold, and total revenue generated." }, { "name": "simple-users-table", "type": "registry:block", "title": "Users Table", "description": "Structured table layout for managing team members, showing profile details, roles, departments, account status, and recent activity." }, { "name": "shadcn-day-fan", "type": "registry:block", "title": "Shadcn Day", "description": "Use this component when highlighting special events, milestones, or important dates." }, { "name": "form-input", "type": "registry:component", "title": "Form Input", "description": "A form input component with validation and error handling." }, { "name": "form-password", "type": "registry:component", "title": "Form Password", "description": "A password input field with visibility toggle and validation." }, { "name": "form-select", "type": "registry:component", "title": "Form Select", "description": "A select input field with options and validation." }, { "name": "form-switch", "type": "registry:component", "title": "Form Switch", "description": "A switch input field with on/off state and validation." }, { "name": "form-textarea", "type": "registry:component", "title": "Form Textarea", "description": "A textarea input field with validation and error handling." }, { "name": "form-checkbox", "type": "registry:component", "title": "Form Checkbox", "description": "A checkbox input field with validation and error handling." }, { "name": "form-error", "type": "registry:component", "title": "Form Error", "description": "A component for displaying form validation errors." } ], "component_count": 23, "components_truncated": false, "component_types": { "registry:style": 1, "registry:block": 15, "registry:component": 7 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 120, "name": "@pacekit-gsap", "category": "Animated components", "tags": [ "ai", "aesthetic" ], "tagline": "Animated GSAP components crafted for smooth interaction and rich detail.", "short_description": "Animated GSAP components crafted for smooth interaction and rich detail.", "description": "A companion GSAP-powered animation component library from PaceKit, providing React components with smooth GSAP-driven interactions for production apps. The docs nav lists an AI Toolkit category (Modal Selector, Modal Ability Selector, AI Suggestions, Response Writer, Token Counter) alongside Text Effects (Reveal Text, Scramble Text, Squash Text, Bouncing Text, Draw Line Text, Mouse Wave Text, Dot Animation) and additional animated Blocks. Uses GSAP (GreenSock) rather than CSS transitions or Framer Motion. Tailwind CSS, TypeScript, shadcn CLI compatible. Free, MIT-licensed. Use for: adding high-quality GSAP-driven text animations and interactive UI effects to Next.js or React apps without building animation logic from scratch.", "homepage": "https://gsap.pacekit.dev", "docs": "https://gsap.pacekit.dev/docs", "github": "https://github.com/pacekit/gsap", "components_github": "https://github.com/pacekit/gsap/tree/main/src/components", "github_default_branch": "main", "github_stars": 269, "last_commit": "2026-03-24T09:35:16Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://gsap.pacekit.dev/r/{name}.json", "registry_index": "https://gsap.pacekit.dev/r/registry.json", "components": [ "index", "ai-suggestions", "ai-modal-selector", "ai-modal-ability-selector", "ai-response-writer", "ai-token-counter", "reveal-text", "scramble-text", "squash-text", "bouncing-text", "draw-line-text", "mouse-wave-text", "text-fall-button", "spring-button", "fillable-button", "swap", "animated-stack", "layered-stack", "gradient-shadow", "github-star-counter", "profile-peek", "flip-reveal", "reveal-on-scroll", "stagger-on-scroll", "liquid-cursor", "liquid-glass", "tilt-card", "dot-loader", "dot-flow" ], "component_items": [ { "name": "index", "type": "registry:style", "title": null, "description": null }, { "name": "ai-suggestions", "type": "registry:ui", "title": "AI Suggestions", "description": "Get smart, real-time AI recommendations to refine and improve your work" }, { "name": "ai-modal-selector", "type": "registry:ui", "title": "Modal Selector", "description": "AI-focused model selector with preview, tooltips, and capability indicators built-in" }, { "name": "ai-modal-ability-selector", "type": "registry:ui", "title": "Modal Ability Selector", "description": "Compact selector for toggling abilities with icons and custom styles" }, { "name": "ai-response-writer", "type": "registry:ui", "title": "Response Writer", "description": "An auto-scrolling text display that smoothly keeps the latest response always visible" }, { "name": "ai-token-counter", "type": "registry:ui", "title": "Modal Ability Selector", "description": "Compact selector for toggling abilities with icons and custom styles" }, { "name": "reveal-text", "type": "registry:ui", "title": "Reveal Text", "description": "A smooth text reveals animation where each heading reveals related content on interaction." }, { "name": "scramble-text", "type": "registry:ui", "title": "Scramble Text", "description": "A hover-triggered text effect that scrambles and restores characters with smooth motion" }, { "name": "squash-text", "type": "registry:ui", "title": "Squash Text", "description": "Characters bounce and squash into place with playful, dynamic energy." }, { "name": "bouncing-text", "type": "registry:ui", "title": "Bouncing Text", "description": "A playful animation where characters bounce in sequence across the text." }, { "name": "draw-line-text", "type": "registry:ui", "title": "Draw Line Text", "description": "A smooth text effect that draws characters as strokes and fills them in—perfect for headers and highlights." }, { "name": "mouse-wave-text", "type": "registry:ui", "title": "Mouse Wave Text", "description": "Creates a wave-like bounce effect on text as the mouse moves across" }, { "name": "text-fall-button", "type": "registry:ui", "title": "Text Fall Button", "description": "A button with dynamic text that falls into place with a smooth, elastic motion on hover or click." }, { "name": "spring-button", "type": "registry:ui", "title": "Spring Button", "description": "A button that shrinks on press and springs back with bounce." }, { "name": "fillable-button", "type": "registry:ui", "title": "Fillable Button", "description": "A button that fills with color on hover." }, { "name": "swap", "type": "registry:ui", "title": "Swap", "description": "A flexible swap component that animates content changes with smooth customizable transition effects." }, { "name": "animated-stack", "type": "registry:ui", "title": "Animated Stack", "description": "A smooth stacked card component that expands on hover and collapses with animation." }, { "name": "layered-stack", "type": "registry:ui", "title": "Layered Stack", "description": "An interactive component that dynamically layers elements, creating a visually engaging stacked animation effect." }, { "name": "gradient-shadow", "type": "registry:ui", "title": "Gradient Shadow", "description": "Smooth horizontal gradient flow, creating a subtle glowing hover shadow effect." }, { "name": "github-star-counter", "type": "registry:ui", "title": "GitHub Star Counter", "description": "Display live GitHub star count for any public repository" }, { "name": "profile-peek", "type": "registry:ui", "title": "Profile Peek", "description": "Hover to peek profile with smooth reveal, right from the image." }, { "name": "flip-reveal", "type": "registry:ui", "title": "Flip Reveal", "description": "Animated container that reveals or hides items using GSAP Flip transitions and keys." }, { "name": "reveal-on-scroll", "type": "registry:ui", "title": "Reveal On Scroll", "description": "Animate content into view on scroll with effects like fade, slide, zoom, and blur." }, { "name": "stagger-on-scroll", "type": "registry:ui", "title": "Stagger on Scroll", "description": "Stagger elements into view with scroll-triggered fade, slide, zoom, or blur effects." }, { "name": "liquid-cursor", "type": "registry:ui", "title": "Liquid Cursor", "description": "A smooth, fluid cursor that follows your mouse with gentle stretch and bounce effects." }, { "name": "liquid-glass", "type": "registry:ui", "title": "Liquid Glass", "description": "A smooth glass effect with subtle blur, ideal for UI highlights and overlays." }, { "name": "tilt-card", "type": "registry:ui", "title": "Tilt Card", "description": "Interactive 3D tilt card that responds to cursor, adds depth and motion" }, { "name": "dot-loader", "type": "registry:ui", "title": "Dot Loader", "description": "A compact 7x7 dot grid loader with smooth animation to visualize frame sequences or loading states in your app." }, { "name": "dot-flow", "type": "registry:ui", "title": "Dot Flow", "description": "Visually expressive status updates with animated dots and smooth sliding text transitions." } ], "component_count": 29, "components_truncated": false, "component_types": { "registry:style": 1, "registry:ui": 28 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 121, "name": "@paddle", "category": "E-commerce/payments", "tags": [ "saas" ], "tagline": "Drop-in components for building checkouts, pricing pages, and subscription management screens using Paddle Billing.", "short_description": "Drop-in components for building checkouts, pricing pages, and subscription management screens using Paddle Billing.", "description": "The official Paddle JavaScript SDK and TypeScript wrapper for Paddle Billing (v2). Provides initializePaddle, Paddle.Checkout.open(), and Paddle Retain integrations as TypeScript-typed utilities that load Paddle.js securely from the CDN. The shadcn registry exposes drop-in components and wiring patterns for checkout overlays, pricing pages, and subscription management screens. Supports TypeScript 4.1+. Works with Paddle Billing only (not Paddle Classic v1). Free to integrate; Paddle charges transaction fees. Use for: adding Paddle-powered self-serve checkout, subscription upsell flows, or billing management screens to a React or Next.js app.", "homepage": "https://developer.paddle.com/", "docs": "https://developer.paddle.com", "github": "https://github.com/PaddleHQ", "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://developer.paddle.com/r/{name}.json", "registry_index": "https://developer.paddle.com/r/registry.json", "components": [ "paddle-helpers", "paddle-client", "pricing-select-cards", "express-checkout", "billing-interval-toggle", "pricing-cards", "pricing-display", "checkout-summary", "inline-checkout", "subscription-status-card", "subscription-alert", "subscription-payment-card", "plan-change-preview", "plan-change-breakdown" ], "component_items": [ { "name": "paddle-helpers", "type": "registry:lib", "title": "Paddle helpers", "description": "Shared display types, format utilities, and payment method display for Paddle UI components. No SDK dependency — safe to install without @paddle/paddle-js." }, { "name": "paddle-client", "type": "registry:lib", "title": "Paddle client utilities", "description": "Paddle.js initialization singleton, SDK type re-exports, checkout event mapper, and SDK-layer hooks used by all client-side Paddle blocks." }, { "name": "pricing-select-cards", "type": "registry:component", "title": "Pricing select cards", "description": "Selectable pricing cards with localized prices from Paddle, available in stacked and grid layouts. Uses RadioGroup for single-plan selection — designed for exp…" }, { "name": "express-checkout", "type": "registry:block", "title": "Express checkout", "description": "Mobile-first checkout experience with pricing cards and sheet-style checkout drawer. Automatically resizes based on the height of the checkout." }, { "name": "billing-interval-toggle", "type": "registry:component", "title": "Billing interval toggle", "description": "Segmented control for switching between billing intervals. Renders labels automatically from interval keys (month -> Monthly, year -> Annually). Designed for p…" }, { "name": "pricing-cards", "type": "registry:component", "title": "Pricing cards", "description": "Responsive pricing tier cards with plan name, localized price, feature list, and per-card CTA. Supports current-plan highlighting and selection state for prici…" }, { "name": "pricing-display", "type": "registry:block", "title": "Pricing display", "description": "Pricing section with localized prices, billing interval toggle, and built-in overlay checkout. Supports current-plan highlighting and plan change selection flo…" }, { "name": "checkout-summary", "type": "registry:component", "title": "Checkout summary", "description": "Order summary for inline checkout: line items, totals, recurring/trial info, and refund policy link. Compliance-ready display for Paddle inline checkout." }, { "name": "inline-checkout", "type": "registry:block", "title": "Inline checkout", "description": "Inline checkout block with order summary, Paddle payment frame, and real-time event updates. Supports reactive item changes, plan switching, and quantity updat…" }, { "name": "subscription-status-card", "type": "registry:component", "title": "Subscription status card", "description": "Subscription overview card showing plan details, status, billing cycle, line item breakdown, discount, scheduled changes, and optional action buttons. Supports…" }, { "name": "subscription-alert", "type": "registry:component", "title": "Subscription alert", "description": "Contextual alerts for subscription events: payment failures, scheduled cancellations, pauses, trials. Derives the correct alert from subscription state automat…" }, { "name": "subscription-payment-card", "type": "registry:component", "title": "Subscription payment card", "description": "Payment method and next billing summary card. Auto-resolves payment method display labels from Paddle type/brand/last4 fields. Shows next payment amount, date,…" }, { "name": "plan-change-preview", "type": "registry:component", "title": "Plan change preview", "description": "Compact plan change summary card with side-by-side plan comparison, proration breakdown, upgrade/downgrade badge, discount, scheduled change warning, and optio…" }, { "name": "plan-change-breakdown", "type": "registry:component", "title": "Plan change breakdown", "description": "Detailed financial breakdown of a subscription plan change. Invoice-style view with per-transaction line items, proration periods, tax, credits, and totals for…" } ], "component_count": 14, "components_truncated": false, "component_types": { "registry:lib": 2, "registry:component": 9, "registry:block": 3 }, "has_logo": true, "enrichment_errors": [ "github_lookup_failed" ], "featured": false }, { "number": 122, "name": "@paletteui", "category": "Theming/styling", "tags": [ "aesthetic" ], "tagline": "Curated OKLCH color themes for shadcn/ui + visual theme editor with CSS, Tailwind v4, and Figma export.", "short_description": "Curated OKLCH color themes for shadcn/ui + visual theme editor with CSS, Tailwind v4, and Figma export.", "description": "A visual theme editor and curated collection of OKLCH color themes for shadcn/ui projects. Lets developers browse, generate, and export color palettes with export targets for CSS custom properties, Tailwind CSS v4 config, and Figma. OKLCH color space usage ensures perceptually uniform, accessible color ramps. Free to use; no GitHub repository was publicly linked at research time. Use for: rapidly finding and applying a cohesive, perceptually-balanced color theme to an existing shadcn/ui project without manually authoring CSS variables.", "homepage": "https://paletteui.xyz", "docs": "N/A", "github": "N/A", "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://paletteui.xyz/r/{name}.json", "registry_index": "https://paletteui.xyz/r/registry.json", "components": [ "zinc", "slate", "stone", "mono", "neo", "contrast", "oxide", "electric", "editorial", "terra", "sand", "rose", "midnight", "saas", "ocean", "frost", "candy", "emerald", "sunset", "spring", "summer", "autumn", "winter", "nebula", "mars", "aurora", "eclipse", "synthwave", "terminal", "polaroid", "pixel", "linear", "stripe", "spotify", "notion", "sakura", "lavender", "reef", "redwood", "breaking-bad", "stranger-things", "game-of-thrones", "mandalorian", "squid-game", "wednesday", "japan", "brazil", "nordic", "ukraine", "italy", "india", "usa", "france", "germany", "israel", "south-korea", "mexico", "apple", "starbucks", "mcdonalds", "coca-cola", "taco-bell", "tesla", "ikea", "netflix" ], "component_items": [ { "name": "zinc", "type": "registry:theme", "title": "Zinc", "description": "The sensible default. Neutral zinc grays that stay out of the way." }, { "name": "slate", "type": "registry:theme", "title": "Slate", "description": "Cool blue-gray undertones. Crisp and technical without being cold." }, { "name": "stone", "type": "registry:theme", "title": "Stone", "description": "Warm gray with a sandy undertone. Calm, grounded, approachable." }, { "name": "mono", "type": "registry:theme", "title": "Minimal Mono", "description": "Pure grayscale. No color, no distraction. Just typography and whitespace." }, { "name": "neo", "type": "registry:theme", "title": "Neo Brutal", "description": "Black and yellow. Hard shadows, thick borders, maximum impact." }, { "name": "contrast", "type": "registry:theme", "title": "Contrast", "description": "Pure black and white with a single red accent. Nothing else needed." }, { "name": "oxide", "type": "registry:theme", "title": "Oxide", "description": "Rust and iron. Industrial warmth with raw, mechanical confidence." }, { "name": "electric", "type": "registry:theme", "title": "Electric", "description": "Neon cyan on dark. Terminal aesthetics meets modern UI." }, { "name": "editorial", "type": "registry:theme", "title": "Warm Editorial", "description": "Rich amber tones with typographic elegance. Inspired by luxury print." }, { "name": "terra", "type": "registry:theme", "title": "Terra", "description": "Terracotta and olive. Mediterranean warmth grounded in earth." }, { "name": "sand", "type": "registry:theme", "title": "Sand", "description": "Desert beige and cream. Soft, quiet, endlessly restful." }, { "name": "rose", "type": "registry:theme", "title": "Rose", "description": "Dusty rose and warm mauve. Refined softness with quiet confidence." }, { "name": "midnight", "type": "registry:theme", "title": "Midnight", "description": "Deep indigo with luminous accents. Focused and immersive." }, { "name": "saas", "type": "registry:theme", "title": "SaaS Blue", "description": "Professional blue. The reliable choice for dashboards and products." }, { "name": "ocean", "type": "registry:theme", "title": "Ocean", "description": "Teal and deep sea. Calm depth with bright coral accents." }, { "name": "frost", "type": "registry:theme", "title": "Frost", "description": "Ice blue and silver. Light, airy, crystalline clarity." }, { "name": "candy", "type": "registry:theme", "title": "Candy", "description": "Vibrant pink and pastels. Joyful, friendly, unapologetically fun." }, { "name": "emerald", "type": "registry:theme", "title": "Emerald", "description": "Fresh mint and green. Natural energy that feels alive." }, { "name": "sunset", "type": "registry:theme", "title": "Sunset", "description": "Orange to purple gradient vibes. Warm energy fading into cool dusk." }, { "name": "spring", "type": "registry:theme", "title": "Spring Bloom", "description": "Soft pinks and fresh greens. New growth, cherry blossoms, morning dew." }, { "name": "summer", "type": "registry:theme", "title": "Summer Heat", "description": "Warm oranges and golden yellows. Sunshine, beaches, endless days." }, { "name": "autumn", "type": "registry:theme", "title": "Autumn Ember", "description": "Deep burgundy and burnt orange. Falling leaves, warm cider, cozy evenings." }, { "name": "winter", "type": "registry:theme", "title": "Winter Night", "description": "Icy blues and silver whites. Frozen lakes, starlit skies, quiet snowfall." }, { "name": "nebula", "type": "registry:theme", "title": "Nebula", "description": "Deep purple and magenta. Cosmic dust clouds and stellar nurseries." }, { "name": "mars", "type": "registry:theme", "title": "Mars Colony", "description": "Dusty red and iron oxide. Martian landscapes and frontier ambition." }, { "name": "aurora", "type": "registry:theme", "title": "Aurora", "description": "Northern lights green and violet. Dancing electrons and polar skies." }, { "name": "eclipse", "type": "registry:theme", "title": "Eclipse", "description": "Dark void with golden corona. Total darkness ringed with fire." }, { "name": "synthwave", "type": "registry:theme", "title": "Synthwave", "description": "Neon pink and cyan on dark purple. 80s arcade, VHS tracking, laser grids." }, { "name": "terminal", "type": "registry:theme", "title": "Terminal", "description": "Green phosphor on black. CRT monitors, command lines, the Matrix." }, { "name": "polaroid", "type": "registry:theme", "title": "Polaroid", "description": "Faded cream and warm brown. Vintage film, sun-bleached memories, nostalgia." }, { "name": "pixel", "type": "registry:theme", "title": "Pixel", "description": "Bright primaries on dark. 8-bit games, pixel art, chiptune energy." }, { "name": "linear", "type": "registry:theme", "title": "Linear", "description": "The iconic Linear violet. Clean product design, focused engineering." }, { "name": "stripe", "type": "registry:theme", "title": "Stripe", "description": "Stripe's signature indigo. Clean, trustworthy, payments-grade polish." }, { "name": "spotify", "type": "registry:theme", "title": "Spotify", "description": "That unmistakable green on dark. Music, energy, late-night listening." }, { "name": "notion", "type": "registry:theme", "title": "Notion", "description": "Warm off-white and soft brown. The calm of a clean workspace." }, { "name": "sakura", "type": "registry:theme", "title": "Cherry Blossom", "description": "Soft sakura pink and moss green. Japanese gardens, spring rain, wabi-sabi." }, { "name": "lavender", "type": "registry:theme", "title": "Lavender Field", "description": "Soft purple and green-gray. Provencal fields, herbal calm, gentle breezes." }, { "name": "reef", "type": "registry:theme", "title": "Coral Reef", "description": "Aqua and coral pink. Tropical waters, living color, marine depth." }, { "name": "redwood", "type": "registry:theme", "title": "Redwood", "description": "Deep forest green and bark brown. Ancient trees, morning mist, pine needles." }, { "name": "breaking-bad", "type": "registry:theme", "title": "Breaking Bad", "description": "Desert amber and meth blue. Chemistry, danger, Albuquerque sunsets." }, { "name": "stranger-things", "type": "registry:theme", "title": "Stranger Things", "description": "Neon red on pitch black. The Upside Down, flickering lights, 80s horror." }, { "name": "game-of-thrones", "type": "registry:theme", "title": "Game of Thrones", "description": "Dark steel and blood red. Iron Throne, direwolves, winter is coming." }, { "name": "mandalorian", "type": "registry:theme", "title": "The Mandalorian", "description": "Beskar silver and desert sand. This is the way." }, { "name": "squid-game", "type": "registry:theme", "title": "Squid Game", "description": "Pink guard suit and teal tracksuit. Deadly games, sharp contrast." }, { "name": "wednesday", "type": "registry:theme", "title": "Wednesday", "description": "Gothic black and muted purple. Nevermore Academy, dark elegance." }, { "name": "japan", "type": "registry:theme", "title": "Japan", "description": "Clean white and hinomaru red. Minimal, precise, unmistakable." }, { "name": "brazil", "type": "registry:theme", "title": "Brazil", "description": "Green, gold, and blue. Tropical energy, carnival spirit, samba." }, { "name": "nordic", "type": "registry:theme", "title": "Nordic", "description": "Deep navy blue and clean white. Scandinavian flags, fjords, northern calm." }, { "name": "ukraine", "type": "registry:theme", "title": "Ukraine", "description": "Sky blue and golden wheat. Open fields, clear horizons, resilience." }, { "name": "italy", "type": "registry:theme", "title": "Italy", "description": "Green, white, and red. La dolce vita, espresso, Roman elegance." }, { "name": "india", "type": "registry:theme", "title": "India", "description": "Saffron, white, and deep green. Spice markets, tigers, ancient wisdom." }, { "name": "usa", "type": "registry:theme", "title": "USA", "description": "Red, white, and blue. Stars and stripes, bold confidence, American classic." }, { "name": "france", "type": "registry:theme", "title": "France", "description": "Bleu, blanc, rouge. Parisian chic, haute couture, refined elegance." }, { "name": "germany", "type": "registry:theme", "title": "Germany", "description": "Black, red, and gold. Precision engineering, Bauhaus, structured elegance." }, { "name": "israel", "type": "registry:theme", "title": "Israel", "description": "White and blue. Mediterranean clarity, innovation, desert sky." }, { "name": "south-korea", "type": "registry:theme", "title": "South Korea", "description": "Red and blue taegeuk on white. K-culture, tech, dynamic balance." }, { "name": "mexico", "type": "registry:theme", "title": "Mexico", "description": "Green, white, and red. Aztec spirit, vibrant culture, warm soul." }, { "name": "apple", "type": "registry:theme", "title": "Apple", "description": "Clean silver and space gray. Cupertino minimalism, premium restraint." }, { "name": "starbucks", "type": "registry:theme", "title": "Starbucks", "description": "Siren green and warm cream. Coffee shop warmth, morning rituals." }, { "name": "mcdonalds", "type": "registry:theme", "title": "McDonald's", "description": "Golden arches yellow and classic red. Fast, bold, universally recognized." } ], "component_count": 65, "components_truncated": false, "component_types": { "registry:theme": 65 }, "has_logo": true, "enrichment_errors": [ "github_lookup_failed" ], "featured": false }, { "number": 142, "name": "@payload-components", "category": "Uncategorized", "tags": [], "tagline": "MIT registry of typed Payload CMS blocks for Payload v3 + Next.js. Each block installs as reviewable source; the companion CLI also wires collection config, RenderBlocks, types, and the admin import map.", "short_description": "", "description": "MIT registry of typed Payload CMS blocks for Payload v3 + Next.js. Each block installs as reviewable source; the companion CLI also wires collection config, RenderBlocks, types, and the admin import map.", "homepage": "https://www.payload-components.xyz", "docs": "https://www.payload-components.xyz/docs", "github": "https://github.com/Ducksss/payload-components", "components_github": "https://github.com/Ducksss/payload-components/tree/main/src/components", "github_default_branch": "main", "github_stars": 17, "last_commit": "2026-07-08T04:43:00Z", "archived": false, "license": "MIT", "open_issues": 51, "registry_template": "https://www.payload-components.xyz/r/{name}.json", "registry_index": "https://www.payload-components.xyz/r/registry.json", "components": [ "hero-basic", "feature-grid-basic", "feature-split", "feature-bento", "feature-steps", "embed-basic", "logo-cloud-grid", "logo-cloud-hover", "logo-cloud-marquee", "logo-cloud-inline", "logo-cloud-inline-wrap", "content-columns", "content-image-lead", "content-feature-media", "content-feature-split", "content-showcase", "content-quote", "content-community", "integration-grid", "integration-cluster", "integration-split", "integration-connect", "integration-orbit", "integration-list", "integration-marquee", "integration-testimonial", "content-split-rows", "content-rows", "content-image-frame", "content-stats", "content-list", "content-list-columns", "content-list-icons", "call-to-action-centered", "call-to-action-boxed", "call-to-action-signup", "team-roster", "team-grid", "faq-accordion", "faq-split", "faq-card", "faq-icons", "faq-grouped", "faq-grid", "comparator-table", "comparator-grid", "comparator-stack", "testimonials-quote", "testimonials-spotlight", "testimonials-grid", "testimonials-rating", "testimonials-bento", "testimonials-wall", "pricing-cards", "pricing-cards-muted", "pricing-cards-cta", "pricing-split", "pricing-enterprise" ], "component_items": [ { "name": "hero-basic", "type": "registry:block", "title": "Hero Basic", "description": "Payload Components proof-of-concept hero block." }, { "name": "feature-grid-basic", "type": "registry:block", "title": "Feature Grid Basic", "description": "Text-first Payload feature grid with optional CTA wiring." }, { "name": "feature-split", "type": "registry:block", "title": "Feature Split", "description": "Two-column Payload feature block: heading and CTA beside a feature list." }, { "name": "feature-bento", "type": "registry:block", "title": "Feature Bento", "description": "Asymmetric Payload bento grid with a featured lead cell and supporting cells." }, { "name": "feature-steps", "type": "registry:block", "title": "Feature Steps", "description": "Numbered Payload steps block for sequential, how-it-works feature flows." }, { "name": "embed-basic", "type": "registry:block", "title": "Embed Basic", "description": "Responsive, accessible sandboxed iframe block for approved HTTPS embeds." }, { "name": "logo-cloud-grid", "type": "registry:block", "title": "Logo Cloud Grid", "description": "Centered, wrapping wall of editable logo uploads under a heading." }, { "name": "logo-cloud-hover", "type": "registry:block", "title": "Logo Cloud Hover", "description": "Logo wall that dims and blurs on hover to reveal a CTA link." }, { "name": "logo-cloud-marquee", "type": "registry:block", "title": "Logo Cloud Marquee", "description": "Auto-scrolling marquee of editable logos with progressive-blur edge fades." }, { "name": "logo-cloud-inline", "type": "registry:block", "title": "Logo Cloud Inline", "description": "Compact label-over-logos strip of editable trust logos." }, { "name": "logo-cloud-inline-wrap", "type": "registry:block", "title": "Logo Cloud Inline Wrap", "description": "Single wrapping row keeping the label inline with editable logos." }, { "name": "content-columns", "type": "registry:block", "title": "Content Columns", "description": "Two-column Payload content block: a heading beside body copy and a CTA." }, { "name": "content-image-lead", "type": "registry:block", "title": "Content Image Lead", "description": "Payload content block led by a full-width image above a heading, body, and CTA." }, { "name": "content-feature-media", "type": "registry:block", "title": "Content Feature Media", "description": "Payload content block: body copy and two icon features beside a framed media panel." }, { "name": "content-feature-split", "type": "registry:block", "title": "Content Feature Split", "description": "Payload content block: a side media panel beside body copy and two icon features." }, { "name": "content-showcase", "type": "registry:block", "title": "Content Showcase", "description": "Payload content block: a centered intro, a full-width image, and a four-up feature grid." }, { "name": "content-quote", "type": "registry:block", "title": "Content Quote", "description": "Payload content block: a media panel beside body copy and a cited pull quote." }, { "name": "content-community", "type": "registry:block", "title": "Content Community", "description": "Payload content block: a centered heading and body above a wall of community avatars." }, { "name": "integration-grid", "type": "registry:block", "title": "Integration Grid", "description": "A responsive grid of integration cards with logo, name, description, and a learn-more link." }, { "name": "integration-cluster", "type": "registry:block", "title": "Integration Cluster", "description": "A centered cluster of integration logos around a featured brand mark, with a heading and CTA." }, { "name": "integration-split", "type": "registry:block", "title": "Integration Split", "description": "A two-column section pairing a featured-mark logo cluster with a heading, subtext, and CTA." }, { "name": "integration-connect", "type": "registry:block", "title": "Integration Connect", "description": "Integration logos wired to a central brand mark by connector lines." }, { "name": "integration-orbit", "type": "registry:block", "title": "Integration Orbit", "description": "Concentric rings of integration logos that orbit a featured brand mark on hover." }, { "name": "integration-list", "type": "registry:block", "title": "Integration List", "description": "A vertical list of integration rows with logo, name, description, and an add action." }, { "name": "integration-marquee", "type": "registry:block", "title": "Integration Marquee", "description": "Three auto-scrolling rows of integration logos around a featured brand mark." }, { "name": "integration-testimonial", "type": "registry:block", "title": "Integration Testimonial", "description": "A two-column section pairing a customer quote with a grid of integration logo cards." }, { "name": "content-split-rows", "type": "registry:block", "title": "Content Split Rows", "description": "Payload content block: an intro above alternating media-and-text rows." }, { "name": "content-rows", "type": "registry:block", "title": "Content Rows", "description": "Payload content block: an intro above a uniform stack of media-and-text rows." }, { "name": "content-image-frame", "type": "registry:block", "title": "Content Image Frame", "description": "Payload content block: a centered intro above a layered, framed screenshot." }, { "name": "content-stats", "type": "registry:block", "title": "Content Stats", "description": "Payload content block: an intro, a grid of icon features, and a stats list." }, { "name": "content-list", "type": "registry:block", "title": "Content List", "description": "Payload content block: a serif heading beside a labeled-term list." }, { "name": "content-list-columns", "type": "registry:block", "title": "Content List Columns", "description": "Payload content block: a serif heading above a two-column labeled-term list." }, { "name": "content-list-icons", "type": "registry:block", "title": "Content List Icons", "description": "Payload content block: a serif heading and intro above a multi-column icon list." }, { "name": "call-to-action-centered", "type": "registry:block", "title": "Call To Action Centered", "description": "Centered Payload call-to-action block: heading, copy, and one or two CTA links." }, { "name": "call-to-action-boxed", "type": "registry:block", "title": "Call To Action Boxed", "description": "Boxed Payload call-to-action block: heading, copy, and CTA links inside a nested panel." }, { "name": "call-to-action-signup", "type": "registry:block", "title": "Call To Action Signup", "description": "Email-capture Payload call-to-action block: heading, copy, and a form that posts to a same-origin endpoint." }, { "name": "team-roster", "type": "registry:block", "title": "Team Roster", "description": "Payload team block: department-grouped sections, each a grid of member avatars with name and role." }, { "name": "team-grid", "type": "registry:block", "title": "Team Grid", "description": "Payload team block: a heading and intro above a responsive grid of member photo cards that reveal role on hover." }, { "name": "faq-accordion", "type": "registry:block", "title": "FAQ Accordion", "description": "Payload FAQ block: a centered accordion of question/answer items with an optional CTA." }, { "name": "faq-split", "type": "registry:block", "title": "FAQ Split", "description": "Payload FAQ block: a two-column layout pairing a sticky heading and CTA with an accordion." }, { "name": "faq-card", "type": "registry:block", "title": "FAQ Card", "description": "Payload FAQ block: a centered accordion wrapped in a card with an optional CTA." }, { "name": "faq-icons", "type": "registry:block", "title": "FAQ Icons", "description": "Payload FAQ block: an accordion with a per-question icon from a fixed allowlist." }, { "name": "faq-grouped", "type": "registry:block", "title": "FAQ Grouped", "description": "Payload FAQ block: titled, icon-tagged category groups of accordions." }, { "name": "faq-grid", "type": "registry:block", "title": "FAQ Grid", "description": "Payload FAQ block: a static two-column grid of question/answer cards." }, { "name": "comparator-table", "type": "registry:block", "title": "Comparator Table", "description": "Tiered feature-comparison table Payload block: plan columns with CTAs over grouped feature rows." }, { "name": "comparator-grid", "type": "registry:block", "title": "Comparator Grid", "description": "Plan-column comparison Payload block: pricing columns in a bordered card over a feature matrix." }, { "name": "comparator-stack", "type": "registry:block", "title": "Comparator Stack", "description": "Stacked plan-card comparison Payload block: one card per plan with its own price, CTA, and feature checklist." }, { "name": "testimonials-quote", "type": "registry:block", "title": "Testimonials Quote", "description": "Payload testimonials block: a single featured quote with a left accent bar, author, optional role, and avatar." }, { "name": "testimonials-spotlight", "type": "registry:block", "title": "Testimonials Spotlight", "description": "Payload testimonials block: a single centered testimonial with a quote-mark, large avatar, author, and role." }, { "name": "testimonials-grid", "type": "registry:block", "title": "Testimonials Grid", "description": "Payload testimonials block: a heading above a responsive grid of quote cards, each with author, optional role, and avatar." }, { "name": "testimonials-rating", "type": "registry:block", "title": "Testimonials Rating", "description": "Payload testimonials block: a responsive grid of review cards, each with a star rating, quote, author, optional role, and avatar." }, { "name": "testimonials-bento", "type": "registry:block", "title": "Testimonials Bento", "description": "Payload testimonials block: an asymmetric bento with one featured quote in a large cell and supporting quotes around it." }, { "name": "testimonials-wall", "type": "registry:block", "title": "Testimonials Wall", "description": "Payload testimonials block: a heading above a multi-column masonry wall of compact testimonial cards." }, { "name": "pricing-cards", "type": "registry:block", "title": "Pricing Cards", "description": "Three-up pricing table of editable plan cards with a highlighted plan." }, { "name": "pricing-cards-muted", "type": "registry:block", "title": "Pricing Cards Muted", "description": "Three-up pricing table on muted card surfaces with a highlighted plan." }, { "name": "pricing-cards-cta", "type": "registry:block", "title": "Pricing Cards CTA", "description": "Three-up pricing table with the CTA inside each plan header." }, { "name": "pricing-split", "type": "registry:block", "title": "Pricing Split", "description": "Two-plan split pricing: a compact entry plan beside an expanded featured plan." }, { "name": "pricing-enterprise", "type": "registry:block", "title": "Pricing Enterprise", "description": "Single wide enterprise pricing panel with an editable trust-logo wall." } ], "component_count": 58, "components_truncated": false, "component_types": { "registry:block": 58 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 123, "name": "@pastecn", "category": "Hooks/utilities", "tags": [ "ai", "components" ], "tagline": "pastebin + shadcn = pastecn. Paste your code and get a shadcn-compatible registry URL instantly.", "short_description": "pastebin + shadcn = pastecn. Paste your code and get a shadcn-compatible registry URL instantly.", "description": "A pastebin service purpose-built for the shadcn/ui registry format. Paste any component, hook, lib, or multi-file block and instantly receive a registry-compatible URL usable directly with npx shadcn@latest add. Features include link expiration (1h-30d or never), optional password protection with bcrypt hashing, multi-file block support via registry:block, a REST API for programmatic creation, VS Code/Cursor extension for keyboard-shortcut sharing, and AI SDK tools for agent-driven snippet creation. Zero config, no signup required; MIT-licensed. Use for: quickly sharing custom shadcn components across projects or teams without setting up a personal registry server.", "homepage": "https://pastecn.com", "docs": "https://pastecn.com/docs/api", "github": "https://github.com/rbadillap/pastecn", "components_github": null, "github_default_branch": "main", "github_stars": 128, "last_commit": "2026-03-31T02:02:50Z", "archived": false, "license": "MIT", "open_issues": 2, "registry_template": "https://pastecn.com/r/{name}", "registry_index": "https://pastecn.com/r/registry", "components": [ "ai-sdk" ], "component_items": [ { "name": "ai-sdk", "type": "registry:file", "title": "Pastecn AI SDK Tools", "description": "AI SDK tools for creating and reading pastecn snippets" } ], "component_count": 1, "components_truncated": false, "component_types": { "registry:file": 1 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 124, "name": "@paykit-sdk", "category": "E-commerce/payments", "tags": [ "components" ], "tagline": "Unified payments SDK for builders — handle checkout, billing, and webhooks across Stripe, PayPal, Adyen, and regional gateways with a single integration.", "short_description": "Unified payments SDK for builders — handle checkout, billing, and webhooks across Stripe, PayPal, Adyen, and regional gateways with a single integration.", "description": "A unified TypeScript payments SDK and shadcn registry providing complete wiring patterns for multiple payment providers. Registry entries cover Stripe + Next.js, Stripe + Hono, and PayPal + Next.js integrations; packages include @paykit-sdk/core, @paykit-sdk/stripe, @paykit-sdk/polar, @paykit-sdk/paypal, @paykit-sdk/react (React hooks and components), and a UI components package. Aims to eliminate provider lock-in with a consistent API across Stripe, PayPal, and Polar. Free and open source (MIT), maintained by a single developer. Use for: bootstrapping checkout and billing flows across multiple payment providers from a single shadcn add command without copy-pasting provider-specific boilerplate.", "homepage": "https://www.usepaykit.dev", "docs": "https://docs.usepaykit.dev", "github": "https://github.com/usepaykit/paykit-sdk", "components_github": null, "github_default_branch": "main", "github_stars": 57, "last_commit": "2026-07-07T20:20:27Z", "archived": false, "license": null, "open_issues": 5, "registry_template": "https://www.usepaykit.dev/r/{name}.json", "registry_index": "https://www.usepaykit.dev/r/registry.json", "components": [ "stripe-nextjs", "stripe-hono", "stripe-express", "stripe-nextjs-hooks", "stripe-nextjs-prisma", "stripe-nextjs-drizzle", "stripe-nextjs-typeorm", "stripe-nextjs-mongoose", "stripe-nextjs-sequelize", "stripe-hono-prisma", "stripe-hono-drizzle", "stripe-hono-sequelize", "stripe-hono-mongoose", "stripe-hono-typeorm", "stripe-express-prisma", "stripe-express-drizzle", "stripe-express-sequelize", "stripe-express-mongoose", "stripe-express-typeorm", "paystack-nextjs", "paystack-hono" ], "component_items": [ { "name": "stripe-nextjs", "type": "registry:block", "title": null, "description": "Stripe payment integration for Next.js App Router with type-safe API routes and webhook handling" }, { "name": "stripe-hono", "type": "registry:block", "title": null, "description": "Stripe payment integration for Hono backend with unified routes and webhook handling" }, { "name": "stripe-express", "type": "registry:block", "title": null, "description": "Stripe payment integration for Express backend with unified routes and webhook handling" }, { "name": "stripe-nextjs-hooks", "type": "registry:block", "title": null, "description": "Stripe payment integration for Next.js App Router with React hooks" }, { "name": "stripe-nextjs-prisma", "type": "registry:block", "title": null, "description": "Stripe payment integration for Next.js App Router with Prisma ORM" }, { "name": "stripe-nextjs-drizzle", "type": "registry:block", "title": null, "description": "Stripe integration for Next.js with Drizzle ORM schemas for payments and subscriptions" }, { "name": "stripe-nextjs-typeorm", "type": "registry:block", "title": null, "description": "Stripe integration for Next.js with TypeORM schemas for payments and subscriptions" }, { "name": "stripe-nextjs-mongoose", "type": "registry:block", "title": null, "description": "Stripe integration for Next.js with Mongoose schemas for payments and subscriptions" }, { "name": "stripe-nextjs-sequelize", "type": "registry:block", "title": null, "description": "Stripe integration for Next.js with Sequelize schemas for payments and subscriptions" }, { "name": "stripe-hono-prisma", "type": "registry:block", "title": null, "description": "Stripe integration for Hono with Prisma ORM schemas for payments and subscriptions" }, { "name": "stripe-hono-drizzle", "type": "registry:block", "title": null, "description": "Stripe integration for Hono with Drizzle ORM schemas for payments and subscriptions" }, { "name": "stripe-hono-sequelize", "type": "registry:block", "title": null, "description": "Stripe integration for Hono with Sequelize schemas for payments and subscriptions" }, { "name": "stripe-hono-mongoose", "type": "registry:block", "title": null, "description": "Stripe integration for Hono with Mongoose schemas for payments and subscriptions" }, { "name": "stripe-hono-typeorm", "type": "registry:block", "title": null, "description": "Stripe integration for Hono with TypeORM schemas for payments and subscriptions" }, { "name": "stripe-express-prisma", "type": "registry:block", "title": null, "description": "Stripe integration for Express with Prisma ORM schemas for payments and subscriptions" }, { "name": "stripe-express-drizzle", "type": "registry:block", "title": null, "description": "Stripe integration for Express with Drizzle ORM schemas for payments and subscriptions" }, { "name": "stripe-express-sequelize", "type": "registry:block", "title": null, "description": "Stripe integration for Express with Sequelize schemas for payments and subscriptions" }, { "name": "stripe-express-mongoose", "type": "registry:block", "title": null, "description": "Stripe integration for Express with Mongoose schemas for payments and subscriptions" }, { "name": "stripe-express-typeorm", "type": "registry:block", "title": null, "description": "Stripe integration for Express with TypeORM schemas for payments and subscriptions" }, { "name": "paystack-nextjs", "type": "registry:block", "title": null, "description": "Paystack payment integration for Next.js App Router with type-safe API routes and webhook handling" }, { "name": "paystack-hono", "type": "registry:block", "title": null, "description": "Paystack payment integration for Hono backend with unified routes and webhook handling" } ], "component_count": 21, "components_truncated": false, "component_types": { "registry:block": 21 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 125, "name": "@phucbm", "category": "Personal/portfolio registry", "tags": [ "aesthetic" ], "tagline": "A collection of modern React UI components with GSAP animations.", "short_description": "A collection of modern React UI components with GSAP animations.", "description": "Personal component registry from developer Phuc Bui, serving custom React UI components with GSAP animations alongside the components used on phucbm.com. Built with Next.js 16, React 19, Nextra 4 for docs, Tailwind CSS v4 (CSS-first, no tailwind.config.js), and shadcn/ui. Registry source lives in registry/phucbm/ with build output to public/r/. The repository is archived with active development in a fork. Free and open source. Use for: pulling specific GSAP-animated components from a well-structured personal registry when you want working examples built against Tailwind v4 and React 19.", "homepage": "https://phucbm.com/components", "docs": "https://phucbm.com/components", "github": "https://github.com/phucbm/phucbm.com", "components_github": "https://github.com/phucbm/phucbm.com/tree/main/registry", "github_default_branch": "main", "github_stars": 0, "last_commit": "2026-05-07T06:20:39Z", "archived": false, "license": null, "open_issues": 2, "registry_template": "https://phucbm.com/r/{name}.json", "registry_index": null, "components": [], "component_items": [], "component_count": null, "components_truncated": false, "component_types": {}, "has_logo": true, "enrichment_errors": [ "registry_index_unresolved" ], "featured": false }, { "number": 126, "name": "@pixelact-ui", "category": "Niche/single-purpose", "tags": [ "aesthetic" ], "tagline": "Playful pixel art style components library built on top of shadcn. Perfect for retro style projects and games.", "short_description": "Playful pixel art style components library built on top of shadcn. Perfect for retro style projects and games.", "description": "A pixel-art-styled React component library built on top of shadcn/ui, applying a retro 8-bit aesthetic via Tailwind CSS to standard shadcn primitives. Components install individually via the shadcn CLI to components/ui/pixelact-ui/ and include Button (with retro variant), Input, Dialog, and other standard shadcn-equivalent components reimagined with pixel borders and blocky aesthetics. TypeScript and fully customizable. Free and open source. Use for: games, retro-themed web apps, or developer portfolios that need a consistent pixel-art UI layer on top of the familiar shadcn/ui primitive set.", "homepage": "https://pixelactui.com", "docs": "https://www.pixelactui.com/docs", "github": "https://github.com/pixelact-ui/pixelact-ui", "components_github": "https://github.com/pixelact-ui/pixelact-ui/tree/main/components", "github_default_branch": "main", "github_stars": 101, "last_commit": "2026-06-17T10:07:19Z", "archived": false, "license": "MIT", "open_issues": 2, "registry_template": "https://pixelactui.com/r/{name}.json", "registry_index": "https://pixelactui.com/r/registry.json", "components": [ "accordion", "alert", "alert-dialog", "avatar", "badge", "breadcrumb", "button", "calendar", "card", "carousel", "checkbox", "collapsible", "dialog", "input", "textarea", "label", "popover", "select", "command", "context-menu", "hover-card", "tooltip", "menubar", "spinner", "toast", "drawer", "empty", "kbd" ], "component_items": [ { "name": "accordion", "type": "registry:component", "title": "Pixelact Accordion", "description": "A simple accordion component." }, { "name": "alert", "type": "registry:component", "title": "Pixelact Alert", "description": "A simple alert component." }, { "name": "alert-dialog", "type": "registry:component", "title": "Pixelact Alert Dialog", "description": "A simple alert dialog component." }, { "name": "avatar", "type": "registry:component", "title": "Pixelact Avatar", "description": "A simple avatar component." }, { "name": "badge", "type": "registry:component", "title": "Pixelact Badge", "description": "A simple badge component." }, { "name": "breadcrumb", "type": "registry:component", "title": "Pixelact Breadcrumb", "description": "A simple breadcrumb component." }, { "name": "button", "type": "registry:component", "title": "Pixelact Button", "description": "A simple button component." }, { "name": "calendar", "type": "registry:component", "title": "Pixelact Calendar", "description": "A simple calendar component." }, { "name": "card", "type": "registry:component", "title": "Pixelact Card", "description": "A simple card component." }, { "name": "carousel", "type": "registry:component", "title": "Pixelact Carousel", "description": "A simple carousel component." }, { "name": "checkbox", "type": "registry:component", "title": "Pixelact Checkbox", "description": "A simple checkbox component." }, { "name": "collapsible", "type": "registry:component", "title": "Pixelact Collapsible", "description": "A simple collapsible component." }, { "name": "dialog", "type": "registry:component", "title": "Pixelact Dialog", "description": "A simple dialog component." }, { "name": "input", "type": "registry:component", "title": "Pixelact Input", "description": "A simple input component." }, { "name": "textarea", "type": "registry:component", "title": "Pixelact Textarea", "description": "A simple textarea component." }, { "name": "label", "type": "registry:component", "title": "Pixelact Label", "description": "A simple label component." }, { "name": "popover", "type": "registry:component", "title": "Pixelact Popover", "description": "A simple popover component." }, { "name": "select", "type": "registry:component", "title": "Pixelact Select", "description": "A simple select component." }, { "name": "command", "type": "registry:component", "title": "Pixelact Command", "description": "A simple command component." }, { "name": "context-menu", "type": "registry:component", "title": "Pixelact Context Menu", "description": "A simple context menu component." }, { "name": "hover-card", "type": "registry:component", "title": "Pixelact Hover Card", "description": "A simple hover card component." }, { "name": "tooltip", "type": "registry:component", "title": "Pixelact Tooltip", "description": "A simple tooltip component." }, { "name": "menubar", "type": "registry:component", "title": "Pixelact Menubar", "description": "A simple menubar component." }, { "name": "spinner", "type": "registry:component", "title": "Pixelact Spinner", "description": "A simple spinner component." }, { "name": "toast", "type": "registry:component", "title": "Pixelact Toast", "description": "A simple toast component." }, { "name": "drawer", "type": "registry:component", "title": "Pixelact Drawer", "description": "A pixel art styled drawer component built on top of vaul Drawer." }, { "name": "empty", "type": "registry:component", "title": "Pixelact Empty", "description": "A pixel art styled empty state component." }, { "name": "kbd", "type": "registry:component", "title": "Pixelact Kbd", "description": "A pixel art styled keyboard key component." } ], "component_count": 28, "components_truncated": false, "component_types": { "registry:component": 28 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 127, "name": "@plate", "category": "Editor (rich text/code)", "tags": [ "ai" ], "tagline": "AI-powered rich text editor for React.", "short_description": "AI-powered rich text editor for React.", "description": "Plate is a React framework for building AI-powered rich-text editors built on Slate and Slate-React. The shadcn registry (325 items) delivers Plate UI: copyable toolbar components (fixed, floating, AI menu), block draggable, cursor overlay, inline combobox, caption, comment/suggestion toolbars, media upload, ghost text, and full editor kits. Headless @platejs/* plugins cover formatting, serialization, collaboration (Yjs/Loro), AI completions, and more. Tailwind v3/v4 compatible, Radix UI-based. Free and open-source (MIT, 16k+ GitHub stars); a paid Notion-like Potion template is offered separately via pro.platejs.org. Use for: embedding a fully featured, extensible rich-text editor (with AI, comments, or collaborative editing) into a React or Next.js app.", "homepage": "https://platejs.org", "docs": "https://platejs.org/docs", "github": "https://github.com/udecode/plate", "components_github": null, "github_default_branch": "main", "github_stars": 16400, "last_commit": "2026-07-08T06:56:05Z", "archived": false, "license": null, "open_issues": 13, "registry_template": "https://platejs.org/r/{name}.json", "registry_index": "https://platejs.org/r/registry.json", "components": [ "plate", "plate-ui", "ai-menu", "ai-toolbar-button", "align-toolbar-button", "block-context-menu", "block-selection", "import-toolbar-button", "export-toolbar-button", "caption", "font-color-toolbar-button", "comment-toolbar-button", "block-suggestion", "block-discussion", "cursor-overlay", "block-draggable", "editor", "select-editor", "emoji-toolbar-button", "fixed-toolbar-buttons", "fixed-toolbar-classic-buttons", "fixed-toolbar", "floating-toolbar-buttons", "floating-toolbar-classic-buttons", "floating-toolbar", "ghost-text", "history-toolbar-button", "list-toolbar-button", "indent-toolbar-button", "inline-combobox", "insert-toolbar-button", "insert-toolbar-classic-button", "line-height-toolbar-button", "link-toolbar", "link-toolbar-button", "list-classic-toolbar-button", "mark-toolbar-button", "media-toolbar", "media-toolbar-button", "media-upload-toast", "mode-toolbar-button", "more-toolbar-button", "resize-handle", "table-toolbar-button", "toggle-toolbar-button", "turn-into-toolbar-button", "turn-into-toolbar-classic-button", "remote-cursor-overlay", "toolbar", "suggestion-toolbar-button", "ai-node", "block-list", "blockquote-node", "callout-node", "code-block-node", "code-drawing-node", "code-node", "column-node", "comment-node", "suggestion-node", "date-node", "equation-node", "equation-toolbar-button", "emoji-node", "excalidraw-node", "font-size-toolbar-button", "footnote-node", "heading-node", "highlight-node", "hr-node", "media-image-node", "media-preview-dialog", "kbd-node", "link-node", "list-classic-node", "media-audio-node", "media-embed-node", "media-file-node", "media-placeholder-node", "media-video-node", "mention-node", "paragraph-node", "search-highlight-node", "slash-node", "table-node", "tag-node", "toc-node", "toggle-node", "align-base-kit", "basic-blocks-base-kit", "basic-marks-base-kit", "callout-base-kit", "code-block-base-kit", "code-drawing-base-kit", "column-base-kit", "comment-base-kit", "date-base-kit", "footnote-base-kit", "excalidraw-kit", "font-base-kit" ], "component_items": [ { "name": "plate", "type": "registry:lib", "title": null, "description": "Install Plate package" }, { "name": "plate-ui", "type": "registry:style", "title": null, "description": "Install Plate package and styles" }, { "name": "ai-menu", "type": "registry:ui", "title": "AI Menu", "description": "A menu for AI-powered content generation and insertion." }, { "name": "ai-toolbar-button", "type": "registry:ui", "title": "AI Toolbar Button", "description": "A toolbar button for accessing AI features." }, { "name": "align-toolbar-button", "type": "registry:ui", "title": "Align Toolbar Button", "description": "A dropdown menu for text alignment controls." }, { "name": "block-context-menu", "type": "registry:ui", "title": "Block Context Menu", "description": "A context menu for block-level operations." }, { "name": "block-selection", "type": "registry:ui", "title": "Block Selection", "description": "A visual overlay for selected blocks." }, { "name": "import-toolbar-button", "type": "registry:ui", "title": "Import Toolbar Button", "description": "A toolbar button to import editor content from a file." }, { "name": "export-toolbar-button", "type": "registry:ui", "title": "Export Toolbar Button", "description": "A toolbar button for exporting editor content in various formats (HTML, PDF, Image, Markdown)." }, { "name": "caption", "type": "registry:ui", "title": "Caption", "description": "A text field for adding captions to media elements." }, { "name": "font-color-toolbar-button", "type": "registry:ui", "title": "Font Color Toolbar Button", "description": "A color picker toolbar button with text and background color controls." }, { "name": "comment-toolbar-button", "type": "registry:ui", "title": "Comment Toolbar Button", "description": "A toolbar button for adding inline comments." }, { "name": "block-suggestion", "type": "registry:ui", "title": "Block Suggestion", "description": null }, { "name": "block-discussion", "type": "registry:ui", "title": "Block Discussion", "description": "A popover interface for managing discussions: comments, replies, suggestions." }, { "name": "cursor-overlay", "type": "registry:ui", "title": "Cursor Overlay", "description": "A visual overlay for cursors and selections." }, { "name": "block-draggable", "type": "registry:ui", "title": "Block Draggable", "description": "A block wrapper with a drag handle for moving editor blocks." }, { "name": "editor", "type": "registry:ui", "title": "Editor", "description": "A container for the editor content and styling." }, { "name": "select-editor", "type": "registry:ui", "title": "Select Editor", "description": "An editor to select tags." }, { "name": "emoji-toolbar-button", "type": "registry:ui", "title": "Emoji Toolbar Button", "description": "An emoji picker toolbar button." }, { "name": "fixed-toolbar-buttons", "type": "registry:ui", "title": "Fixed Toolbar Buttons", "description": "A set of commonly used formatting buttons." }, { "name": "fixed-toolbar-classic-buttons", "type": "registry:ui", "title": "Fixed Toolbar List Buttons", "description": null }, { "name": "fixed-toolbar", "type": "registry:ui", "title": "Fixed Toolbar", "description": "A fixed toolbar that stays at the top of the editor." }, { "name": "floating-toolbar-buttons", "type": "registry:ui", "title": "Floating Toolbar Buttons", "description": "A set of formatting buttons for the floating toolbar." }, { "name": "floating-toolbar-classic-buttons", "type": "registry:ui", "title": "Floating Toolbar Classic Buttons", "description": "A set of commonly used formatting buttons for the floating toolbar with classic list support." }, { "name": "floating-toolbar", "type": "registry:ui", "title": "Floating Toolbar", "description": "A contextual toolbar that appears over selected text." }, { "name": "ghost-text", "type": "registry:ui", "title": "Ghost Text", "description": "A text suggestion system that displays AI-generated content after the cursor." }, { "name": "history-toolbar-button", "type": "registry:ui", "title": "History Toolbar Button", "description": "Toolbar buttons for undo and redo operations." }, { "name": "list-toolbar-button", "type": "registry:ui", "title": "List Toolbar Button", "description": "A toolbar control for adjusting list indentation." }, { "name": "indent-toolbar-button", "type": "registry:ui", "title": "Indent Toolbar Buttons", "description": "Toolbar controls for block indentation." }, { "name": "inline-combobox", "type": "registry:ui", "title": "Inline Combobox", "description": "A combobox for inline suggestions." }, { "name": "insert-toolbar-button", "type": "registry:ui", "title": "Insert Toolbar Button", "description": "A menu for inserting different types of blocks." }, { "name": "insert-toolbar-classic-button", "type": "registry:ui", "title": "Insert Toolbar Classic Button", "description": "A menu for inserting different types of blocks with classic list support." }, { "name": "line-height-toolbar-button", "type": "registry:ui", "title": "Line Height Toolbar Button", "description": "A menu for controlling text line spacing." }, { "name": "link-toolbar", "type": "registry:ui", "title": "Link Floating Toolbar", "description": "A floating interface for link editing." }, { "name": "link-toolbar-button", "type": "registry:ui", "title": "Link Toolbar Button", "description": "A toolbar control for link management." }, { "name": "list-classic-toolbar-button", "type": "registry:ui", "title": "List Toolbar Buttons", "description": "Toolbar controls for list creation and management." }, { "name": "mark-toolbar-button", "type": "registry:ui", "title": "Mark Toolbar Button", "description": "A toolbar control for basic text formatting." }, { "name": "media-toolbar", "type": "registry:ui", "title": "Media Toolbar", "description": "A toolbar interface for media settings." }, { "name": "media-toolbar-button", "type": "registry:ui", "title": "Media Toolbar Button", "description": "Toolbar button for inserting and managing media." }, { "name": "media-upload-toast", "type": "registry:ui", "title": "Media Upload Toast", "description": "Show toast notifications for media uploads." }, { "name": "mode-toolbar-button", "type": "registry:ui", "title": "Mode Toolbar Button", "description": "A menu for switching between editor modes." }, { "name": "more-toolbar-button", "type": "registry:ui", "title": "More Toolbar Button", "description": "A menu for additional text formatting options." }, { "name": "resize-handle", "type": "registry:ui", "title": "Resize Handle", "description": "A resizable wrapper with resize handles." }, { "name": "table-toolbar-button", "type": "registry:ui", "title": "Table Toolbar Button", "description": "A menu for table manipulation and formatting." }, { "name": "toggle-toolbar-button", "type": "registry:ui", "title": "Toggle Toolbar Button", "description": "A toolbar button for expanding and collapsing blocks." }, { "name": "turn-into-toolbar-button", "type": "registry:ui", "title": "Turn Into Toolbar Button", "description": "A menu for converting between different block types." }, { "name": "turn-into-toolbar-classic-button", "type": "registry:ui", "title": "Turn Into Toolbar Classic Button", "description": "A dropdown to convert block types with classic list support." }, { "name": "remote-cursor-overlay", "type": "registry:ui", "title": "Remote Cursor Overlay", "description": "A cursor overlay to display multiplayer cursors in the yjs plugin." }, { "name": "toolbar", "type": "registry:ui", "title": "Toolbar", "description": "A customizable toolbar component with various button styles and group" }, { "name": "suggestion-toolbar-button", "type": "registry:ui", "title": "Suggestion Toolbar Button", "description": "A toolbar button for toggling suggestion mode in the editor." }, { "name": "ai-node", "type": "registry:ui", "title": "AI Leaf", "description": "A text highlighter for AI-generated content." }, { "name": "block-list", "type": "registry:ui", "title": "List", "description": "List components." }, { "name": "blockquote-node", "type": "registry:ui", "title": "Blockquote Element", "description": "A quote component for block quotes." }, { "name": "callout-node", "type": "registry:ui", "title": null, "description": "A callout component for highlighting important information with customizable icons and styles." }, { "name": "code-block-node", "type": "registry:ui", "title": "Code Block Nodes", "description": "A code block with syntax highlighting and language selection." }, { "name": "code-drawing-node", "type": "registry:ui", "title": "Code Drawing Node", "description": "Create diagrams from code using PlantUML, Graphviz, Flowchart, or Mermaid." }, { "name": "code-node", "type": "registry:ui", "title": "Code Leaf", "description": "An inline component for code snippets." }, { "name": "column-node", "type": "registry:ui", "title": "Column Nodes", "description": "Resizable column components for layout." }, { "name": "comment-node", "type": "registry:ui", "title": "Comment Leaf", "description": "A text component for displaying comments with visual indicators." }, { "name": "suggestion-node", "type": "registry:ui", "title": "Suggestion Leaf", "description": "A text component for suggestion." } ], "component_count": 324, "components_truncated": true, "component_types": { "registry:lib": 2, "registry:style": 3, "registry:ui": 86, "registry:component": 76, "registry:file": 134, "registry:block": 4, "registry:hook": 6, "registry:example": 13 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 128, "name": "@prompt-kit", "category": "AI/chat UI", "tags": [ "ai", "dashboard" ], "tagline": "Core building blocks for AI apps. High-quality, accessible, and customizable components for AI interfaces.", "short_description": "Core building blocks for AI apps. High-quality, accessible, and customizable components for AI interfaces.", "description": "prompt-kit is an open-source shadcn-compatible registry of ~20 components purpose-built for AI interfaces: PromptInput, PromptSuggestion, ChatContainer, Message, SystemMessage, Reasoning, ThinkingBar, CodeBlock, Markdown, FileUpload, ImageLoader, ChainOfThought, ToolBlocks, Steps, ScrollButton, FeedbackBar, TextShimmer, SourceCard. Built on top of shadcn/ui with Tailwind CSS, integrates with Vercel AI SDK and OpenAI SDK. Fully free and open-source. Use for: rapidly assembling chat UIs, AI agent dashboards, or assistant frontends without wiring low-level input and message components from scratch.", "homepage": "https://www.prompt-kit.com", "docs": "https://www.prompt-kit.com/docs/introduction", "github": "https://github.com/ibelick/prompt-kit", "components_github": "https://github.com/ibelick/prompt-kit/tree/main/components", "github_default_branch": "main", "github_stars": 2906, "last_commit": "2026-03-12T17:00:34Z", "archived": false, "license": "MIT", "open_issues": 12, "registry_template": "https://www.prompt-kit.com/c/{name}.json", "registry_index": "https://www.prompt-kit.com/c/registry.json", "components": [ "prompt-input", "code-block", "markdown", "message", "chat-container", "scroll-button", "loader", "prompt-suggestion", "response-stream", "reasoning", "file-upload", "jsx-preview", "tool", "source", "image", "steps", "system-message", "chain-of-thought", "text-shimmer", "thinking-bar", "feedback-bar", "chatbot", "tool-calling" ], "component_items": [ { "name": "prompt-input", "type": "registry:ui", "title": "Prompt Input", "description": "An input field designed for chat interfaces, allowing users to enter and submit text prompts to an AI model" }, { "name": "code-block", "type": "registry:ui", "title": "Code Block", "description": "A component for displaying code snippets with syntax highlighting and customizable styling" }, { "name": "markdown", "type": "registry:ui", "title": "Markdown", "description": "A component for rendering Markdown content with support for code blocks, GFM, and custom styling" }, { "name": "message", "type": "registry:ui", "title": "Message", "description": "A component for displaying chat messages with support for avatars, markdown content, and interactive actions" }, { "name": "chat-container", "type": "registry:ui", "title": "Chat Container", "description": "A component for creating chat interfaces with intelligent auto-scrolling behavior, designed to provide a smooth and responsive user experience" }, { "name": "scroll-button", "type": "registry:ui", "title": "Scroll Button", "description": "A floating button component that appears when users scroll up in a container, allowing them to quickly return to the bottom of the content" }, { "name": "loader", "type": "registry:ui", "title": "Loader", "description": "A component for displaying a loading indicator with multiple variants and customizable styling" }, { "name": "prompt-suggestion", "type": "registry:ui", "title": "Prompt Suggestion", "description": "A component for implementing interactive prompt suggestions in AI interfaces. The PromptSuggestion component offers two distinct modes: Normal Mode and Highlig…" }, { "name": "response-stream", "type": "registry:ui", "title": "Response Stream", "description": "A component to simulate streaming text on the client side, perfect for fake responses, or any controlled progressive text display." }, { "name": "reasoning", "type": "registry:ui", "title": "Reasoning", "description": "A collapsible component for showing AI reasoning, explanations, or logic. You can control it manually or let it auto-close when the stream ends. Markdown is su…" }, { "name": "file-upload", "type": "registry:ui", "title": "File Upload", "description": "A component for creating drag-and-drop file upload interfaces with support for single or multiple files, custom triggers, and visual feedback during file dragg…" }, { "name": "jsx-preview", "type": "registry:ui", "title": "Jsx Preview", "description": "A component for rendering JSX strings as React components, with support for streaming content and automatic tag completion." }, { "name": "tool", "type": "registry:ui", "title": "Tool", "description": "Displays tool call details including input, output, status, and errors. Ideal for visualizing AI tool usage in chat UIs." }, { "name": "source", "type": "registry:ui", "title": "Source", "description": "Displays website sources used by AI-generated content, showing URL details, titles, and descriptions on hover." }, { "name": "image", "type": "registry:ui", "title": "Image", "description": "A component for displaying images from base64 or Uint8Array data, with full accessibility and responsive styling. Perfect for AI-generated or user-uploaded ima…" }, { "name": "steps", "type": "registry:ui", "title": "Steps", "description": "A component for displaying a sequence of operations in a collapsible layout. Each step can include details and an optional vertical bar. Useful for showing AI …" }, { "name": "system-message", "type": "registry:ui", "title": "System Message", "description": "A banner-style component for surfacing contextual information, warnings, or instructions within AI interfaces." }, { "name": "chain-of-thought", "type": "registry:ui", "title": "Chain Of Thought", "description": "A component for displaying a chain of thought process with collapsible steps and triggers." }, { "name": "text-shimmer", "type": "registry:ui", "title": "Text Shimmer", "description": "A component for displaying a shimmer effect on text, perfect for loading states or highlighting text." }, { "name": "thinking-bar", "type": "registry:ui", "title": "Thinking Bar", "description": "A component to display the thinking state of an AI model with optional actions." }, { "name": "feedback-bar", "type": "registry:ui", "title": "Feedback Bar", "description": "A component to collect user feedback on AI responses." }, { "name": "chatbot", "type": "registry:item", "title": "Chatbot", "description": "A chatbot component that allows users to chat with an AI model. It uses prompt-kit, shadcn/ui, and AI SDK V5." }, { "name": "tool-calling", "type": "registry:item", "title": "Tool calling", "description": "A chatbot with tool calling feature. It uses prompt-kit, shadcn/ui, and AI SDK V5." } ], "component_count": 23, "components_truncated": false, "component_types": { "registry:ui": 21, "registry:item": 2 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 129, "name": "@prosekit", "category": "Editor (rich text/code)", "tags": [ "components" ], "tagline": "Powerful and flexible rich text editor for React, Vue, Preact, Svelte, and SolidJS.", "short_description": "Powerful and flexible rich text editor for React, Vue, Preact, Svelte, and SolidJS.", "description": "ProseKit is a framework-agnostic rich-text editor toolkit built on ProseMirror, supporting React, Vue, Preact, Svelte, and SolidJS. The extensions package covers bold, italic, underline, strike, code, code-block, heading, blockquote, horizontal-rule, lists, links, images, file, math, table, mention, autocomplete, search, placeholder, highlight, text-align, text-color, background-color, yjs (collaboration), and more (~40 extensions). The shadcn registry distributes a full-featured example editor and framework variants. Free and open-source (MIT). Use for: adding a framework-flexible ProseMirror-based editor when you need multi-framework support or a lower-level alternative to Plate.", "homepage": "https://prosekit.dev", "docs": "https://prosekit.dev", "github": "https://github.com/prosekit/prosekit", "components_github": "https://github.com/prosekit/prosekit/tree/master/registry", "github_default_branch": "master", "github_stars": 1134, "last_commit": "2026-07-06T13:24:45Z", "archived": false, "license": "MIT", "open_issues": 31, "registry_template": "https://prosekit.dev/r/{name}.json", "registry_index": "https://prosekit.dev/r/registry.json", "components": [ "react-example-block-handle", "react-example-blockquote", "react-example-bold", "react-example-change-tracking", "react-example-code", "react-example-code-block", "react-example-code-block-themes", "react-example-drop-cursor", "react-example-emoji-rules", "react-example-font-family", "react-example-full", "react-example-gap-cursor", "react-example-hard-break", "react-example-heading", "react-example-highlight", "react-example-horizontal-rule", "react-example-image-view", "react-example-inline-menu", "react-example-italic", "react-example-katex", "react-example-keymap", "react-example-link", "react-example-link-mark-view", "react-example-list", "react-example-list-custom-checkbox", "react-example-loro", "react-example-mark-rule", "react-example-minimal", "react-example-notion", "react-example-page", "react-example-placeholder", "react-example-readonly", "react-example-rtl", "react-example-save-html", "react-example-save-json", "react-example-save-markdown", "react-example-search", "react-example-slash-menu", "react-example-strike", "react-example-sub-sup", "react-example-table", "react-example-text-align", "react-example-text-color", "react-example-toolbar", "react-example-tweet", "react-example-typography", "react-example-underline", "react-example-unmount", "react-example-user-menu", "react-example-user-menu-dynamic", "react-example-view-adapter", "react-example-word-counter", "react-example-yjs", "react-sample-define-atom-block", "react-sample-katex", "react-sample-sample-doc-block-handle", "react-sample-sample-doc-bold", "react-sample-sample-doc-code", "react-sample-sample-doc-code-block", "react-sample-sample-doc-drop-cursor", "react-sample-sample-doc-font-family", "react-sample-sample-doc-full", "react-sample-sample-doc-gap-cursor", "react-sample-sample-doc-hard-break", "react-sample-sample-doc-heading", "react-sample-sample-doc-highlight", "react-sample-sample-doc-image", "react-sample-sample-doc-inline-menu", "react-sample-sample-doc-italic", "react-sample-sample-doc-link", "react-sample-sample-doc-link-mark-view", "react-sample-sample-doc-list", "react-sample-sample-doc-list-custom-checkbox", "react-sample-sample-doc-notion", "react-sample-sample-doc-page", "react-sample-sample-doc-readonly", "react-sample-sample-doc-rtl", "react-sample-sample-doc-search", "react-sample-sample-doc-strike", "react-sample-sample-doc-sub-sup", "react-sample-sample-doc-table", "react-sample-sample-doc-tex", "react-sample-sample-doc-text-align", "react-sample-sample-doc-text-color", "react-sample-sample-doc-tweet", "react-sample-sample-doc-typography", "react-sample-sample-doc-underline", "react-sample-sample-doc-view-adapter", "react-sample-sample-doc-word-counter", "react-sample-sample-query-users", "react-sample-sample-tag-data", "react-sample-sample-uploader", "react-sample-sample-user-data", "react-ui-block-handle", "react-ui-button", "react-ui-code-block-view", "react-ui-drop-indicator", "react-ui-image-upload-popover", "react-ui-image-view", "react-ui-inline-menu" ], "component_items": [ { "name": "react-example-block-handle", "type": "registry:block", "title": "react-example-block-handle", "description": "A handle that appears on hover, allowing you to drag and re-order blocks." }, { "name": "react-example-blockquote", "type": "registry:block", "title": "react-example-blockquote", "description": "Example for blockquote node." }, { "name": "react-example-bold", "type": "registry:block", "title": "react-example-bold", "description": "Example for bold mark." }, { "name": "react-example-change-tracking", "type": "registry:block", "title": "react-example-change-tracking", "description": "Track and commit document changes with version history." }, { "name": "react-example-code", "type": "registry:block", "title": "react-example-code", "description": "Example for inline code mark." }, { "name": "react-example-code-block", "type": "registry:block", "title": "react-example-code-block", "description": "Code block with syntax highlighting and a Mermaid diagram preview." }, { "name": "react-example-code-block-themes", "type": "registry:block", "title": "react-example-code-block-themes", "description": "Code block with multiple syntax highlighting themes." }, { "name": "react-example-drop-cursor", "type": "registry:block", "title": "react-example-drop-cursor", "description": "Visual cursor indicator during drag-and-drop operations." }, { "name": "react-example-emoji-rules", "type": "registry:block", "title": "react-example-emoji-rules", "description": "Auto-convert text shortcuts to emojis using input rules." }, { "name": "react-example-font-family", "type": "registry:block", "title": "react-example-font-family", "description": "Change the font family of text." }, { "name": "react-example-full", "type": "registry:block", "title": "react-example-full", "description": "Full-featured editor with most available features enabled." }, { "name": "react-example-gap-cursor", "type": "registry:block", "title": "react-example-gap-cursor", "description": "Cursor navigation between non-text block elements." }, { "name": "react-example-hard-break", "type": "registry:block", "title": "react-example-hard-break", "description": "Example for hard line break node." }, { "name": "react-example-heading", "type": "registry:block", "title": "react-example-heading", "description": "Example for heading node with multiple levels." }, { "name": "react-example-highlight", "type": "registry:block", "title": "react-example-highlight", "description": "Example for highlighting text (like a highlighter pen)." }, { "name": "react-example-horizontal-rule", "type": "registry:block", "title": "react-example-horizontal-rule", "description": "Example for horizontal rule node." }, { "name": "react-example-image-view", "type": "registry:block", "title": "react-example-image-view", "description": "Custom image node views with resize support." }, { "name": "react-example-inline-menu", "type": "registry:block", "title": "react-example-inline-menu", "description": "Inline formatting menu that appears on text selection." }, { "name": "react-example-italic", "type": "registry:block", "title": "react-example-italic", "description": "Example for italic mark." }, { "name": "react-example-katex", "type": "registry:block", "title": "react-example-katex", "description": "Math equation rendering using the KaTeX library." }, { "name": "react-example-keymap", "type": "registry:block", "title": "react-example-keymap", "description": "Custom keyboard shortcuts and key bindings." }, { "name": "react-example-link", "type": "registry:block", "title": "react-example-link", "description": "Example for link mark with URL input." }, { "name": "react-example-link-mark-view", "type": "registry:block", "title": "react-example-link-mark-view", "description": "An example showing how to render a mark as a custom component." }, { "name": "react-example-list", "type": "registry:block", "title": "react-example-list", "description": "Example for list node." }, { "name": "react-example-list-custom-checkbox", "type": "registry:block", "title": "react-example-list-custom-checkbox", "description": "Custom checkbox styling for task lists." }, { "name": "react-example-loro", "type": "registry:block", "title": "react-example-loro", "description": "Real-time collaboration using Loro CRDT library." }, { "name": "react-example-mark-rule", "type": "registry:block", "title": "react-example-mark-rule", "description": "Input rules for automatic mark formatting." }, { "name": "react-example-minimal", "type": "registry:block", "title": "react-example-minimal", "description": "Minimal editor setup with basic functionality." }, { "name": "react-example-notion", "type": "registry:block", "title": "react-example-notion", "description": "Notion-style editor with block-based editing." }, { "name": "react-example-page", "type": "registry:block", "title": "react-example-page", "description": "Page layout with configurable paper settings." }, { "name": "react-example-placeholder", "type": "registry:block", "title": "react-example-placeholder", "description": "Placeholder text displayed." }, { "name": "react-example-readonly", "type": "registry:block", "title": "react-example-readonly", "description": "Toggle between read-only and editable mode." }, { "name": "react-example-rtl", "type": "registry:block", "title": "react-example-rtl", "description": "Right-to-left text direction support." }, { "name": "react-example-save-html", "type": "registry:block", "title": "react-example-save-html", "description": "Save and load documents as HTML format." }, { "name": "react-example-save-json", "type": "registry:block", "title": "react-example-save-json", "description": "Save and load documents as JSON format." }, { "name": "react-example-save-markdown", "type": "registry:block", "title": "react-example-save-markdown", "description": "Save and load documents as Markdown format." }, { "name": "react-example-search", "type": "registry:block", "title": "react-example-search", "description": "Search and highlight text with navigation." }, { "name": "react-example-slash-menu", "type": "registry:block", "title": "react-example-slash-menu", "description": "Command menu triggered by typing slash (/)." }, { "name": "react-example-strike", "type": "registry:block", "title": "react-example-strike", "description": "Example for strikethrough mark." }, { "name": "react-example-sub-sup", "type": "registry:block", "title": "react-example-sub-sup", "description": "Example for subscript and superscript marks." }, { "name": "react-example-table", "type": "registry:block", "title": "react-example-table", "description": "Table node with row and column operations." }, { "name": "react-example-text-align", "type": "registry:block", "title": "react-example-text-align", "description": "Text alignment options (left, center, right, justify)." }, { "name": "react-example-text-color", "type": "registry:block", "title": "react-example-text-color", "description": "Change text and background color." }, { "name": "react-example-toolbar", "type": "registry:block", "title": "react-example-toolbar", "description": "Formatting toolbar with common editing actions." }, { "name": "react-example-tweet", "type": "registry:block", "title": "react-example-tweet", "description": "Embed and display Twitter tweets." }, { "name": "react-example-typography", "type": "registry:block", "title": "react-example-typography", "description": "Typography enhancements like smart quotes and dashes." }, { "name": "react-example-underline", "type": "registry:block", "title": "react-example-underline", "description": "Example for underline mark." }, { "name": "react-example-unmount", "type": "registry:block", "title": "react-example-unmount", "description": "Properly unmount and remount editor instances." }, { "name": "react-example-user-menu", "type": "registry:block", "title": "react-example-user-menu", "description": "Autocomplete menu for @mentions and #hashtag" }, { "name": "react-example-user-menu-dynamic", "type": "registry:block", "title": "react-example-user-menu-dynamic", "description": "Dynamic autocomplete menu with async data loading." }, { "name": "react-example-view-adapter", "type": "registry:block", "title": "react-example-view-adapter", "description": "Custom node and mark views using view adapters." }, { "name": "react-example-word-counter", "type": "registry:block", "title": "react-example-word-counter", "description": "Display word and character count statistics." }, { "name": "react-example-yjs", "type": "registry:block", "title": "react-example-yjs", "description": "Real-time collaboration using Yjs CRDT library." }, { "name": "react-sample-define-atom-block", "type": "registry:component", "title": "react-sample-define-atom-block", "description": null }, { "name": "react-sample-katex", "type": "registry:component", "title": "react-sample-katex", "description": null }, { "name": "react-sample-sample-doc-block-handle", "type": "registry:component", "title": "react-sample-sample-doc-block-handle", "description": null }, { "name": "react-sample-sample-doc-bold", "type": "registry:component", "title": "react-sample-sample-doc-bold", "description": null }, { "name": "react-sample-sample-doc-code", "type": "registry:component", "title": "react-sample-sample-doc-code", "description": null }, { "name": "react-sample-sample-doc-code-block", "type": "registry:component", "title": "react-sample-sample-doc-code-block", "description": null }, { "name": "react-sample-sample-doc-drop-cursor", "type": "registry:component", "title": "react-sample-sample-doc-drop-cursor", "description": null } ], "component_count": 548, "components_truncated": true, "component_types": { "registry:block": 265, "registry:component": 283 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 130, "name": "@pulkitxm", "category": "Animated components", "tags": [ "saas", "aesthetic" ], "tagline": "Animated shadcn components powered by GSAP and Framer Motion. Built for expressive UIs.", "short_description": "Animated shadcn components powered by GSAP and Framer Motion. Built for expressive UIs.", "description": "A personal shadcn registry by developer Pulkit offering 31 GSAP- and Framer Motion-powered components for expressive UIs: slide-in-text, text-scramble, typewriter, stagger-reveal-grid, tilt-card-glare, aurora-background, fluid-cursor-trail, magnetic-cursor-dock, svg-morph-button, svg-particle, swap-button, parallax-image, gravity-scroll-cards, horizontal-scroll-gallery, scroll-linked-video-scrubber, infinite-circular-scroll, cursor-spotlight, scroll-progress, resizable-panels, number-counter, handwriting-svg, network-image, animated-underline, animated-underline-navbar, and more. Tailwind CSS, React. Free. Use for: drop-in scroll-linked animations, cursor effects, and motion-driven text components in marketing pages or portfolios.", "homepage": "https://pulkit.page", "docs": "https://pulkitxm.com", "github": "https://github.com/Pulkitxm", "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://pulkit.page/components/{name}.json", "registry_index": "https://pulkit.page/components/registry.json", "components": [ "slide-in-text", "network-image", "animated-underline", "animated-underline-navbar", "party-popper", "parallax-image", "not-found-page", "theme-toggle", "text-scramble", "tilt-card-glare", "line-draw-svg", "fluid-cursor-trail", "typewriter", "magnetic-cursor-dock", "aurora-background", "svg-morph-button", "svg-particle", "swap-button", "stagger-reveal-grid", "handwriting-svg", "gravity-scroll-cards", "scroll-linked-video-scrubber", "horizontal-scroll-gallery", "infinite-circular-scroll", "cursor-spotlight", "scroll-progress", "resizable-panels", "number-counter", "tabs", "lonely-tab-title", "lqip-image" ], "component_items": [ { "name": "slide-in-text", "type": "registry:component", "title": "Slide In Text", "description": "Animates text sliding in from the left with a fade on scroll into view." }, { "name": "network-image", "type": "registry:component", "title": "Network Image", "description": "Image component that adapts quality and loading strategy based on real-time network speed." }, { "name": "animated-underline", "type": "registry:component", "title": "Animated Underline", "description": "Animated underline that tracks hover/active state and slides beneath nav items. Use with data-link-index on list items." }, { "name": "animated-underline-navbar", "type": "registry:block", "title": "Animated Underline Navbar", "description": "Sample navbar demonstrating AnimatedUnderline with hover and active states." }, { "name": "party-popper", "type": "registry:component", "title": "Party Popper", "description": "Confetti celebration effect on click. Wraps any trigger element and fires particles on interaction." }, { "name": "parallax-image", "type": "registry:component", "title": "Parallax Image", "description": "Scroll-linked parallax effect for images or content. Moves children on scroll for depth." }, { "name": "not-found-page", "type": "registry:component", "title": "Not Found Page", "description": "Animated 404 page with subtle icon motion and reduced-motion support." }, { "name": "theme-toggle", "type": "registry:block", "title": "Theme Toggle", "description": "Accessible dark mode toggle with View Transitions API support and icon, icon-label, or dual-tab variants." }, { "name": "text-scramble", "type": "registry:component", "title": "Text Scramble", "description": "Text that decrypts character by character with a scramble effect. Trigger on scroll, hover, or mount." }, { "name": "tilt-card-glare", "type": "registry:component", "title": "Tilt Card Glare", "description": "3D card with tilt and holographic glare effect that follows the cursor." }, { "name": "line-draw-svg", "type": "registry:component", "title": "Line Draw SVG", "description": "SVG path that draws itself on scroll, hover, or mount. Presets: diamond, circle, star, heart, arrow." }, { "name": "fluid-cursor-trail", "type": "registry:component", "title": "Fluid Cursor Trail", "description": "Canvas particle trail that follows the cursor. Fixed overlay, customizable color and particle count." }, { "name": "typewriter", "type": "registry:component", "title": "Typewriter", "description": "Typewriter effect that cycles through phrases with variable typing speed and blinking cursor." }, { "name": "magnetic-cursor-dock", "type": "registry:component", "title": "Magnetic Cursor Dock", "description": "macOS-style dock with magnetic cursor effect. Items scale and lift as cursor approaches." }, { "name": "aurora-background", "type": "registry:component", "title": "Aurora Background", "description": "Living aurora background with multiple variants. Sunset, ocean, forest, lavender, ember, ice." }, { "name": "svg-morph-button", "type": "registry:component", "title": "SVG Morph Button", "description": "Button with SVG path morph animation. Supports custom paths for idle, hover, loading, success." }, { "name": "svg-particle", "type": "registry:component", "title": "SVG Particle", "description": "400x400 Three.js particle field from SVG. lucide-react, react-icons, Heroicons, Tabler, Phosphor, and similar libs work out of the box. Cursor repel + spring h…" }, { "name": "swap-button", "type": "registry:component", "title": "Swap Button", "description": "Shadcn button that swaps between two labels (and optional icons) with a crossfade. Width stays put. No layout jump when copy changes." }, { "name": "stagger-reveal-grid", "type": "registry:component", "title": "Stagger Reveal Grid", "description": "Grid that reveals items with wave-like stagger on scroll. Configurable columns and timing." }, { "name": "handwriting-svg", "type": "registry:component", "title": "Handwriting SVG", "description": "SVG path that draws itself on mount. Pass path for custom shapes or text to render handwriting." }, { "name": "gravity-scroll-cards", "type": "registry:component", "title": "Gravity Scroll Cards", "description": "Cards that stack and unstack with scroll. Gravity-style depth effect." }, { "name": "scroll-linked-video-scrubber", "type": "registry:component", "title": "Scroll-Linked Video Scrubber", "description": "Scroll-jacks the page when the video reaches the viewport top. Scrubs video forward/backward with wheel input." }, { "name": "horizontal-scroll-gallery", "type": "registry:component", "title": "Horizontal Scroll Gallery", "description": "Pinned section where vertical scroll drives horizontal gallery position. Same pattern as Scroll-Linked Video Scrubber." }, { "name": "infinite-circular-scroll", "type": "registry:component", "title": "Infinite Circular Scroll", "description": "Circular layout with numbered cards. Scroll wheel rotates the circle. No scrollbar, finite cards." }, { "name": "cursor-spotlight", "type": "registry:component", "title": "Cursor Spotlight", "description": "Cursor spotlight effect. Dimmed background with bright radial gradient following cursor." }, { "name": "scroll-progress", "type": "registry:component", "title": "Scroll Progress", "description": "Fixed bar at the top that scales horizontally with scroll progress. Uses Framer Motion for smooth updates." }, { "name": "resizable-panels", "type": "registry:component", "title": "Resizable Panels", "description": "Drag-resizable panels for dashboards, IDEs, and editors. Supports horizontal/vertical layout and dynamic panel count." }, { "name": "number-counter", "type": "registry:component", "title": "Number Counter", "description": "Animated number counter that counts from 0 to target. Tabular nums prevent layout shift, respects reduced motion." }, { "name": "tabs", "type": "registry:component", "title": "Tabs", "description": "Accessible tabs with icon support, sliding indicator, and optional content panels. Keyboard navigable." }, { "name": "lonely-tab-title", "type": "registry:component", "title": "Lonely Tab Title", "description": "Changes the page title to a custom message when the user switches away from the tab. Uses the Page Visibility API." }, { "name": "lqip-image", "type": "registry:component", "title": "LQIP Image", "description": "Image component with Low Quality Image Placeholder (LQIP). Shows a blurred placeholder that fades into the full image on load." } ], "component_count": 31, "components_truncated": false, "component_types": { "registry:component": 29, "registry:block": 2 }, "has_logo": true, "enrichment_errors": [ "github_lookup_failed" ], "featured": false }, { "number": 151, "name": "@pulld", "category": "Uncategorized", "tags": [], "tagline": "Typed, accessible, theme-aware React/Tailwind components installable by the shadcn CLI or your AI coding agent. Free atoms plus composed Pro blocks.", "short_description": "", "description": "Typed, accessible, theme-aware React/Tailwind components installable by the shadcn CLI or your AI coding agent. Free atoms plus composed Pro blocks.", "homepage": "https://pulld.pages.dev", "docs": null, "github": null, "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://pulld.pages.dev/r/{name}.json", "registry_index": "https://pulld.pages.dev/r/registry.json", "components": [ "copy-button", "kbd", "empty-state", "stat-card", "theme-toggle", "avatar-stack", "password-input", "spinner", "code-block", "loading-button", "confirm-button", "command-palette", "toast", "search-input", "number-input", "otp-input", "tag-input", "copy-field", "segmented-control", "step-indicator", "rating", "timeline" ], "component_items": [ { "name": "copy-button", "type": "registry:ui", "title": "Copy Button", "description": "Accessible icon button that copies a string to the clipboard and shows a transient copied state. Has aria-label, an aria-live announcement, keyboard focus ring…" }, { "name": "kbd", "type": "registry:ui", "title": "Kbd", "description": "Inline keyboard key hint that renders a styled element for showing shortcuts, hotkeys, and keybindings like Cmd+K, Ctrl+S, or ⇧⌘P. Use it in command pale…" }, { "name": "empty-state", "type": "registry:ui", "title": "Empty State", "description": "Centered empty/zero-data placeholder with an optional icon, title, description, and call-to-action slot. Use it when a list, table, search result, inbox, or da…" }, { "name": "stat-card", "type": "registry:ui", "title": "Stat Card", "description": "Compact metric card showing a label, a big value, and an optional percentage delta with an up/down arrow (green for positive, red for negative). Use it in dash…" }, { "name": "theme-toggle", "type": "registry:ui", "title": "Theme Toggle", "description": "Self-contained light/dark mode toggle button. Persists the choice to localStorage, respects the OS prefers-color-scheme on first load, and toggles the 'dark' c…" }, { "name": "avatar-stack", "type": "registry:ui", "title": "Avatar Stack", "description": "Row of overlapping circular avatars (a facepile) that collapses the overflow into a '+N' badge past a max count, with a letter-initial fallback when an avatar …" }, { "name": "password-input", "type": "registry:ui", "title": "Password Input", "description": "Password text input with a built-in show/hide toggle button. Toggles between password and text, has an accessible aria-label and aria-pressed, and the toggle s…" }, { "name": "spinner", "type": "registry:ui", "title": "Spinner", "description": "Accessible loading spinner (animated lucide Loader2) with role=status, aria-live, and a configurable screen-reader-only label so assistive tech announces the b…" }, { "name": "code-block", "type": "registry:ui", "title": "Code Block", "description": "Code snippet container with an optional language label and a hover/focus-revealed copy button (composes pulld's copy-button). Use it in docs, changelogs, and d…" }, { "name": "loading-button", "type": "registry:ui", "title": "Loading Button", "description": "Button that shows a spinner and disables itself while an async action is pending. Set loading=true during submit, save, or checkout to prevent double-clicks; a…" }, { "name": "confirm-button", "type": "registry:ui", "title": "Confirm Button", "description": "Two-step confirm button for destructive actions: the first click arms it and swaps the label to a confirmation prompt, the second click runs onConfirm. Auto-re…" }, { "name": "command-palette", "type": "registry:ui", "title": "Command Palette", "description": "A production-ready ⌘K command palette: accessible (combobox/listbox roles, aria-activedescendant, focus trapped and restored), full keyboard navigation with wr…" }, { "name": "toast", "type": "registry:ui", "title": "Toast", "description": "A production-ready toast/notification system: call toast(), toast.success/error/info/warning/loading or toast.promise() from anywhere — no provider or context …" }, { "name": "search-input", "type": "registry:ui", "title": "Search Input", "description": "Search field with a leading search icon and a trailing clear (✕) button that appears once there's text and empties the field, refocusing it. Works controlled o…" }, { "name": "number-input", "type": "registry:ui", "title": "Number Input", "description": "Number field with − and + stepper buttons that respect min, max, and step (including decimal steps), so users adjust a value without selecting and retyping. Wo…" }, { "name": "otp-input", "type": "registry:ui", "title": "OTP Input", "description": "One-time passcode / verification code input split into individual single-character slots (default 6). Use it for two-factor authentication (2FA), email confirm…" }, { "name": "tag-input", "type": "registry:ui", "title": "Tag Input", "description": "Multi-value text input that turns typed entries into removable chips — press Enter or comma to add a tag, click the × or press Backspace on an empty field to r…" }, { "name": "copy-field", "type": "registry:ui", "title": "Copy Field", "description": "Read-only input that shows a value with a copy button docked at its right edge — one click copies, and focusing or clicking the field selects the whole value f…" }, { "name": "segmented-control", "type": "registry:ui", "title": "Segmented Control", "description": "Horizontal group of 2–4 mutually exclusive options rendered as one pill/track — a lighter switch than Tabs for toggling a view, time range, unit, sort order, o…" }, { "name": "step-indicator", "type": "registry:ui", "title": "Step Indicator", "description": "Horizontal stepper that shows progress through a fixed sequence — numbered circle markers joined by a line, with each step rendered as complete (filled with a …" }, { "name": "rating", "type": "registry:ui", "title": "Rating", "description": "Star rating for both input and display, with half-star support. Use it to collect a score — rate this product, leave a review, a satisfaction or feedback ratin…" }, { "name": "timeline", "type": "registry:ui", "title": "Timeline", "description": "Vertical timeline that renders a list of events as dots on a connecting line, each with an optional time, title, and description. Use it for an activity feed, …" } ], "component_count": 22, "components_truncated": false, "component_types": { "registry:ui": 22 }, "has_logo": true, "enrichment_errors": [ "docs_unresolved", "github_unresolved" ], "featured": false }, { "number": 131, "name": "@pureui", "category": "Component library (general)", "tags": [ "aesthetic", "components" ], "tagline": "Pure UI is a curated collection of refined, animated, and accessible components built with Base UI, Tailwind CSS, Motion, and other high-quality open source libraries.", "short_description": "Pure UI is a curated collection of refined, animated, and accessible components built with Base UI, Tailwind CSS, Motion, and other high-quality open source libraries.", "description": "Pure UI is a curated open-source shadcn-compatible registry (~291 registry items) of accessible, animated components built on Base UI primitives with Tailwind CSS and Motion (Framer Motion). Core components include Accordion (with multiple animation variants: fade, scale, slide, perspective), Avatar, Badge, Button, Button Group, Calendar, Card, Checkbox, Collapsible, Combobox, Dialog, Input, Input Group, Input OTP, Kbd, Label, Menu, Number Field, Popover, Radio Group, Scroll Area, Select, Separator, Sheet, Spinner, Switch, Tabs, Textarea, Toast, and Tooltip. Each component ships multiple style and behavior demos. Uses Next.js and shadcn registry format. Fully free. Use for: building accessible, motion-enhanced component libraries that prefer Base UI primitives over Radix UI.", "homepage": "https://pure.kam-ui.com/", "docs": "https://pure.kam-ui.com/docs", "github": "https://github.com/MusKRI/pure-ui", "components_github": "https://github.com/MusKRI/pure-ui/tree/main/src/registry", "github_default_branch": "main", "github_stars": 148, "last_commit": "2026-03-29T12:46:16Z", "archived": false, "license": null, "open_issues": 1, "registry_template": "https://pure.kam-ui.com/r/{name}.json", "registry_index": null, "components": [], "component_items": [], "component_count": null, "components_truncated": false, "component_types": {}, "has_logo": true, "enrichment_errors": [ "registry_index_unresolved" ], "featured": true }, { "number": 132, "name": "@ramonclaudio-coderabbit", "category": "Hooks/utilities", "tags": [ "dashboard", "components" ], "tagline": "A framework-agnostic API client, pluggable storage adapters (LocalStorage, Convex, Supabase, PostgreSQL, MySQL), and React components for generating developer activity reports.", "short_description": "A framework-agnostic API client, pluggable storage adapters (LocalStorage, Convex, Supabase, PostgreSQL, MySQL), and React components for generating developer activity reports.", "description": "A niche developer-activity reporting toolkit by product engineer Ramon Claudio. Provides a framework-agnostic API client for the CodeRabbit service, pluggable storage adapters for LocalStorage, Convex, Supabase, PostgreSQL, and MySQL, plus React components for generating developer activity reports. The registry page returned a 404 at time of research, so detail is limited to the official description. Built with TypeScript, React. Free and open-source. Use for: integrating CodeRabbit activity data and developer metrics reporting into internal tools or dashboards with a choice of storage backend.", "homepage": "https://ramonclaudio.com/registries/coderabbit", "docs": "https://ramonclaudio.com/registries/coderabbit", "github": "https://github.com/ramonclaudio", "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://coderabbit-shadcn-registry.vercel.app/r/{name}.json", "registry_index": "https://coderabbit-shadcn-registry.vercel.app/r/registry.json", "components": [ "core", "types", "client", "storage-adapter", "storage-localstorage", "storage-convex", "storage-supabase", "storage-postgres", "storage-mysql", "actions", "react", "report-form", "branding", "report-card", "localstorage", "convex", "supabase", "postgres", "mysql" ], "component_items": [ { "name": "core", "type": "registry:block", "title": "CodeRabbit Core", "description": "Core CodeRabbit integration with types, API client, server actions, and React hook. Add a storage adapter separately for persistence." }, { "name": "types", "type": "registry:lib", "title": "CodeRabbit Types", "description": "Pure TypeScript types for CodeRabbit API integration. Framework-agnostic type definitions with zero dependencies." }, { "name": "client", "type": "registry:lib", "title": "CodeRabbit API Client", "description": "Framework-agnostic CodeRabbit API client. Works in Node.js, Deno, Bun, Edge runtimes, and browsers. Single endpoint for generating developer activity reports w…" }, { "name": "storage-adapter", "type": "registry:lib", "title": "CodeRabbit Storage Adapter Interface", "description": "TypeScript interface for implementing custom storage backends. Implement this to add support for any database." }, { "name": "storage-localstorage", "type": "registry:lib", "title": "CodeRabbit LocalStorage Adapter", "description": "Browser localStorage adapter for CodeRabbit reports. Perfect for client-side apps and prototyping. No database required." }, { "name": "storage-convex", "type": "registry:lib", "title": "CodeRabbit Convex Adapter", "description": "Convex database adapter with real-time sync and auth support. Includes schema definitions for the reports table." }, { "name": "storage-supabase", "type": "registry:lib", "title": "CodeRabbit Supabase Adapter", "description": "Supabase (PostgreSQL) adapter with Row Level Security support. Includes SQL schema and RLS policies." }, { "name": "storage-postgres", "type": "registry:lib", "title": "CodeRabbit PostgreSQL Adapter", "description": "PostgreSQL adapter with connection pooling. Works with Neon, Vercel Postgres, Railway, AWS RDS, Google Cloud SQL, etc." }, { "name": "storage-mysql", "type": "registry:lib", "title": "CodeRabbit MySQL Adapter", "description": "MySQL/MariaDB adapter with connection pooling. Works with PlanetScale, AWS RDS, Google Cloud SQL, Azure, etc." }, { "name": "actions", "type": "registry:lib", "title": "CodeRabbit Server Actions", "description": "Next.js server actions for CodeRabbit API. Handles API calls server-side where CODERABBIT_API_KEY is securely available." }, { "name": "react", "type": "registry:hook", "title": "CodeRabbit React Hook", "description": "React hook for generating CodeRabbit reports with built-in loading and error states. Uses server actions by default for secure API key handling in Next.js." }, { "name": "report-form", "type": "registry:component", "title": "CodeRabbit Report Form", "description": "Full-featured form component for collecting report parameters. Includes template selection, custom prompts, filters, and grouping options." }, { "name": "branding", "type": "registry:component", "title": "CodeRabbit Branding", "description": "CodeRabbit logo and icon components with dark/light theme support. Includes SVG assets." }, { "name": "report-card", "type": "registry:component", "title": "CodeRabbit Report Card", "description": "Display component for CodeRabbit reports with expandable cards, status badges, and markdown rendering. Supports Daily Standup, Sprint Report, and Release Notes…" }, { "name": "localstorage", "type": "registry:block", "title": "CodeRabbit with LocalStorage", "description": "Complete CodeRabbit integration with browser localStorage. Perfect for prototyping and client-side apps. No database required." }, { "name": "convex", "type": "registry:block", "title": "CodeRabbit with Convex", "description": "Complete CodeRabbit integration with Convex database. Includes real-time sync, auth support, and schema definitions. Perfect for production apps." }, { "name": "supabase", "type": "registry:block", "title": "CodeRabbit with Supabase", "description": "Complete CodeRabbit integration with Supabase (PostgreSQL). Includes Row Level Security policies. Perfect for apps with authentication." }, { "name": "postgres", "type": "registry:block", "title": "CodeRabbit with PostgreSQL", "description": "Complete CodeRabbit integration with PostgreSQL. Works with Neon, Vercel Postgres, Railway, AWS RDS, etc." }, { "name": "mysql", "type": "registry:block", "title": "CodeRabbit with MySQL", "description": "Complete CodeRabbit integration with MySQL/MariaDB. Works with PlanetScale, AWS RDS, Google Cloud SQL, Azure, etc." } ], "component_count": 19, "components_truncated": false, "component_types": { "registry:block": 6, "registry:lib": 9, "registry:hook": 1, "registry:component": 3 }, "has_logo": true, "enrichment_errors": [ "github_lookup_failed" ], "featured": true }, { "number": 133, "name": "@react-aria", "category": "Component library (general)", "tags": [ "components" ], "tagline": "Customizable Tailwind and Vanilla CSS components with adaptive interactions, top-tier accessibility, and internationalization.", "short_description": "Customizable Tailwind and Vanilla CSS components with adaptive interactions, top-tier accessibility, and internationalization.", "description": "Adobe's React Aria is a comprehensive, style-free accessibility-first component library (50+ components) distributed via a shadcn-compatible registry with Tailwind CSS and Vanilla CSS examples. Components include DatePicker, Calendar, Table, SearchField, Modal, Combobox, Select, Checkbox, ToggleButton, Menu, Popover, Tooltip, and more, all with built-in WAI-ARIA behavior, adaptive interactions, and i18n/internationalization support. Backed by Adobe with strong long-term maintenance. Fully free and open-source. Use for: projects requiring top-tier accessibility, date/time pickers, or internationalization where you bring your own styling system and need battle-tested behavioral primitives.", "homepage": "https://react-aria.adobe.com", "docs": "https://react-spectrum.adobe.com/react-aria/", "github": "https://github.com/adobe/react-spectrum", "components_github": null, "github_default_branch": "main", "github_stars": 15639, "last_commit": "2026-07-08T02:33:50Z", "archived": false, "license": "Apache-2.0", "open_issues": 575, "registry_template": "https://react-aria.adobe.com/registry/{name}.json", "registry_index": "https://react-aria.adobe.com/registry/registry.json", "components": [ "tailwind", "tailwind-alertdialog", "tailwind-breadcrumbs", "tailwind-button", "tailwind-calendar", "tailwind-checkbox", "tailwind-checkboxgroup", "tailwind-colorarea", "tailwind-colorfield", "tailwind-colorpicker", "tailwind-colorslider", "tailwind-colorswatch", "tailwind-colorswatchpicker", "tailwind-colorthumb", "tailwind-colorwheel", "tailwind-combobox", "tailwind-commandpalette", "tailwind-datefield", "tailwind-datepicker", "tailwind-daterangepicker", "tailwind-dialog", "tailwind-disclosure", "tailwind-disclosuregroup", "tailwind-dropzone", "tailwind-field", "tailwind-fieldbutton", "tailwind-form", "tailwind-gridlist", "tailwind-link", "tailwind-listbox", "tailwind-menu", "tailwind-meter", "tailwind-modal", "tailwind-numberfield", "tailwind-popover", "tailwind-progressbar", "tailwind-radiogroup", "tailwind-rangecalendar", "tailwind-searchfield", "tailwind-select", "tailwind-separator", "tailwind-slider", "tailwind-switch", "tailwind-table", "tailwind-tabs", "tailwind-taggroup", "tailwind-textfield", "tailwind-timefield", "tailwind-toast", "tailwind-togglebutton", "tailwind-togglebuttongroup", "tailwind-toolbar", "tailwind-tooltip", "tailwind-tree", "tailwind-utils", "css", "css-breadcrumbs", "css-button", "css-calendar", "css-checkbox", "css-checkboxgroup", "css-colorarea", "css-colorfield", "css-colorpicker", "css-colorslider", "css-colorswatch", "css-colorswatchpicker", "css-colorthumb", "css-colorwheel", "css-combobox", "css-commandpalette", "css-content", "css-datefield", "css-datepicker", "css-daterangepicker", "css-dialog", "css-disclosure", "css-disclosuregroup", "css-dropzone", "css-form", "css-gridlist", "css-inputgroup", "css-link", "css-listbox", "css-menu", "css-meter", "css-modal", "css-numberfield", "css-popover", "css-progressbar", "css-progresscircle", "css-radiogroup", "css-rangecalendar", "css-searchfield", "css-segmentedcontrol", "css-select", "css-separator", "css-sheet", "css-slider", "css-switch" ], "component_items": [ { "name": "tailwind", "type": "registry:style", "title": null, "description": null }, { "name": "tailwind-alertdialog", "type": "registry:ui", "title": "AlertDialog", "description": null }, { "name": "tailwind-breadcrumbs", "type": "registry:ui", "title": "Breadcrumbs", "description": null }, { "name": "tailwind-button", "type": "registry:ui", "title": "Button", "description": null }, { "name": "tailwind-calendar", "type": "registry:ui", "title": "Calendar", "description": null }, { "name": "tailwind-checkbox", "type": "registry:ui", "title": "Checkbox", "description": null }, { "name": "tailwind-checkboxgroup", "type": "registry:ui", "title": "CheckboxGroup", "description": null }, { "name": "tailwind-colorarea", "type": "registry:ui", "title": "ColorArea", "description": null }, { "name": "tailwind-colorfield", "type": "registry:ui", "title": "ColorField", "description": null }, { "name": "tailwind-colorpicker", "type": "registry:ui", "title": "ColorPicker", "description": null }, { "name": "tailwind-colorslider", "type": "registry:ui", "title": "ColorSlider", "description": null }, { "name": "tailwind-colorswatch", "type": "registry:ui", "title": "ColorSwatch", "description": null }, { "name": "tailwind-colorswatchpicker", "type": "registry:ui", "title": "ColorSwatchPicker", "description": null }, { "name": "tailwind-colorthumb", "type": "registry:ui", "title": "ColorThumb", "description": null }, { "name": "tailwind-colorwheel", "type": "registry:ui", "title": "ColorWheel", "description": null }, { "name": "tailwind-combobox", "type": "registry:ui", "title": "ComboBox", "description": null }, { "name": "tailwind-commandpalette", "type": "registry:ui", "title": "CommandPalette", "description": null }, { "name": "tailwind-datefield", "type": "registry:ui", "title": "DateField", "description": null }, { "name": "tailwind-datepicker", "type": "registry:ui", "title": "DatePicker", "description": null }, { "name": "tailwind-daterangepicker", "type": "registry:ui", "title": "DateRangePicker", "description": null }, { "name": "tailwind-dialog", "type": "registry:ui", "title": "Dialog", "description": null }, { "name": "tailwind-disclosure", "type": "registry:ui", "title": "Disclosure", "description": null }, { "name": "tailwind-disclosuregroup", "type": "registry:ui", "title": "DisclosureGroup", "description": null }, { "name": "tailwind-dropzone", "type": "registry:ui", "title": "DropZone", "description": null }, { "name": "tailwind-field", "type": "registry:ui", "title": "Field", "description": null }, { "name": "tailwind-fieldbutton", "type": "registry:ui", "title": "FieldButton", "description": null }, { "name": "tailwind-form", "type": "registry:ui", "title": "Form", "description": null }, { "name": "tailwind-gridlist", "type": "registry:ui", "title": "GridList", "description": null }, { "name": "tailwind-link", "type": "registry:ui", "title": "Link", "description": null }, { "name": "tailwind-listbox", "type": "registry:ui", "title": "ListBox", "description": null }, { "name": "tailwind-menu", "type": "registry:ui", "title": "Menu", "description": null }, { "name": "tailwind-meter", "type": "registry:ui", "title": "Meter", "description": null }, { "name": "tailwind-modal", "type": "registry:ui", "title": "Modal", "description": null }, { "name": "tailwind-numberfield", "type": "registry:ui", "title": "NumberField", "description": null }, { "name": "tailwind-popover", "type": "registry:ui", "title": "Popover", "description": null }, { "name": "tailwind-progressbar", "type": "registry:ui", "title": "ProgressBar", "description": null }, { "name": "tailwind-radiogroup", "type": "registry:ui", "title": "RadioGroup", "description": null }, { "name": "tailwind-rangecalendar", "type": "registry:ui", "title": "RangeCalendar", "description": null }, { "name": "tailwind-searchfield", "type": "registry:ui", "title": "SearchField", "description": null }, { "name": "tailwind-select", "type": "registry:ui", "title": "Select", "description": null }, { "name": "tailwind-separator", "type": "registry:ui", "title": "Separator", "description": null }, { "name": "tailwind-slider", "type": "registry:ui", "title": "Slider", "description": null }, { "name": "tailwind-switch", "type": "registry:ui", "title": "Switch", "description": null }, { "name": "tailwind-table", "type": "registry:ui", "title": "Table", "description": null }, { "name": "tailwind-tabs", "type": "registry:ui", "title": "Tabs", "description": null }, { "name": "tailwind-taggroup", "type": "registry:ui", "title": "TagGroup", "description": null }, { "name": "tailwind-textfield", "type": "registry:ui", "title": "TextField", "description": null }, { "name": "tailwind-timefield", "type": "registry:ui", "title": "TimeField", "description": null }, { "name": "tailwind-toast", "type": "registry:ui", "title": "Toast", "description": null }, { "name": "tailwind-togglebutton", "type": "registry:ui", "title": "ToggleButton", "description": null }, { "name": "tailwind-togglebuttongroup", "type": "registry:ui", "title": "ToggleButtonGroup", "description": null }, { "name": "tailwind-toolbar", "type": "registry:ui", "title": "Toolbar", "description": null }, { "name": "tailwind-tooltip", "type": "registry:ui", "title": "Tooltip", "description": null }, { "name": "tailwind-tree", "type": "registry:ui", "title": "Tree", "description": null }, { "name": "tailwind-utils", "type": "registry:lib", "title": "utils", "description": null }, { "name": "css", "type": "registry:style", "title": null, "description": null }, { "name": "css-breadcrumbs", "type": "registry:ui", "title": "Breadcrumbs", "description": null }, { "name": "css-button", "type": "registry:ui", "title": "Button", "description": null }, { "name": "css-calendar", "type": "registry:ui", "title": "Calendar", "description": null }, { "name": "css-checkbox", "type": "registry:ui", "title": "Checkbox", "description": null } ], "component_count": 111, "components_truncated": true, "component_types": { "registry:style": 2, "registry:ui": 108, "registry:lib": 1 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 134, "name": "@react-bits", "category": "Animated components", "tags": [ "saas", "aesthetic" ], "tagline": "A large collection of animated, interactive & fully customizable React components for building memorable websites. From smooth text animations all the way to eye-catching backgrounds, you can find it here.", "short_description": "A large collection of animated, interactive & fully customizable React components for building memorable websites. From smooth text animations all the way to eye-catching backgrounds, you can find it here.", "description": "React Bits is an open-source collection of 130+ highly customizable animated React components organized into four groups: Text Animations (blur text, typewriter, rotating text, etc.), Animations (star border, magnet, elastic, etc.), Components (glass, card, dock, etc.), and Backgrounds (aurora, particles, beams, noise, etc.). Each component ships in four code variants (JS+CSS, JS+Tailwind, TS+CSS, TS+Tailwind). Also includes creative tools: Background Studio, Shape Magic, and Texture Lab. Available via shadcn CLI or jsrepo. MIT + Commons Clause license (free for most use). Use for: adding attention-grabbing animated backgrounds, text effects, and interactive hero components to marketing sites or landing pages.", "homepage": "https://reactbits.dev", "docs": "https://reactbits.dev", "github": "https://github.com/DavidHDev/react-bits", "components_github": "https://github.com/DavidHDev/react-bits/tree/main/src/components", "github_default_branch": "main", "github_stars": 42980, "last_commit": "2026-07-08T08:26:36Z", "archived": false, "license": null, "open_issues": 1, "registry_template": "https://reactbits.dev/r/{name}.json", "registry_index": "https://reactbits.dev/r/registry.json", "components": [ "AnimatedContent-JS-CSS", "AnimatedContent-JS-TW", "AnimatedContent-TS-CSS", "AnimatedContent-TS-TW", "BlobCursor-JS-CSS", "BlobCursor-JS-TW", "BlobCursor-TS-CSS", "BlobCursor-TS-TW", "ClickSpark-JS-CSS", "ClickSpark-JS-TW", "ClickSpark-TS-CSS", "ClickSpark-TS-TW", "Crosshair-JS-CSS", "Crosshair-JS-TW", "Crosshair-TS-CSS", "Crosshair-TS-TW", "Cubes-JS-CSS", "Cubes-JS-TW", "Cubes-TS-CSS", "Cubes-TS-TW", "ElectricBorder-JS-CSS", "ElectricBorder-JS-TW", "ElectricBorder-TS-CSS", "ElectricBorder-TS-TW", "FadeContent-JS-CSS", "FadeContent-JS-TW", "FadeContent-TS-CSS", "FadeContent-TS-TW", "GlareHover-JS-CSS", "GlareHover-JS-TW", "GlareHover-TS-CSS", "GlareHover-TS-TW", "GradualBlur-JS-CSS", "GradualBlur-JS-TW", "GradualBlur-TS-CSS", "GradualBlur-TS-TW", "GhostCursor-JS-CSS", "GhostCursor-JS-TW", "GhostCursor-TS-CSS", "GhostCursor-TS-TW", "ImageTrail-JS-CSS", "ImageTrail-JS-TW", "ImageTrail-TS-CSS", "ImageTrail-TS-TW", "LogoLoop-JS-CSS", "LogoLoop-JS-TW", "LogoLoop-TS-CSS", "LogoLoop-TS-TW", "Magnet-JS-CSS", "Magnet-JS-TW", "Magnet-TS-CSS", "Magnet-TS-TW", "MagnetLines-JS-CSS", "MagnetLines-JS-TW", "MagnetLines-TS-CSS", "MagnetLines-TS-TW", "MetaBalls-JS-CSS", "MetaBalls-JS-TW", "MetaBalls-TS-CSS", "MetaBalls-TS-TW", "Strands-JS-CSS", "Strands-JS-TW", "Strands-TS-CSS", "Strands-TS-TW", "MetallicPaint-JS-CSS", "MetallicPaint-JS-TW", "MetallicPaint-TS-CSS", "MetallicPaint-TS-TW", "Noise-JS-CSS", "Noise-JS-TW", "Noise-TS-CSS", "Noise-TS-TW", "PixelTrail-JS-CSS", "PixelTrail-JS-TW", "PixelTrail-TS-CSS", "PixelTrail-TS-TW", "PixelTransition-JS-CSS", "PixelTransition-JS-TW", "PixelTransition-TS-CSS", "PixelTransition-TS-TW", "Ribbons-JS-CSS", "Ribbons-JS-TW", "Ribbons-TS-CSS", "Ribbons-TS-TW", "ShapeBlur-JS-CSS", "ShapeBlur-JS-TW", "ShapeBlur-TS-CSS", "ShapeBlur-TS-TW", "SplashCursor-JS-CSS", "SplashCursor-JS-TW", "SplashCursor-TS-CSS", "SplashCursor-TS-TW", "StarBorder-JS-CSS", "StarBorder-JS-TW", "StarBorder-TS-CSS", "StarBorder-TS-TW", "StickerPeel-JS-CSS", "StickerPeel-JS-TW", "StickerPeel-TS-CSS", "StickerPeel-TS-TW" ], "component_items": [ { "name": "AnimatedContent-JS-CSS", "type": "registry:component", "title": "AnimatedContent", "description": "Wrapper that animates any children on scroll or mount with configurable direction, distance, duration, easing and disappear options." }, { "name": "AnimatedContent-JS-TW", "type": "registry:component", "title": "AnimatedContent", "description": "Wrapper that animates any children on scroll or mount with configurable direction, distance, duration, easing and disappear options." }, { "name": "AnimatedContent-TS-CSS", "type": "registry:component", "title": "AnimatedContent", "description": "Wrapper that animates any children on scroll or mount with configurable direction, distance, duration, easing and disappear options." }, { "name": "AnimatedContent-TS-TW", "type": "registry:component", "title": "AnimatedContent", "description": "Wrapper that animates any children on scroll or mount with configurable direction, distance, duration, easing and disappear options." }, { "name": "BlobCursor-JS-CSS", "type": "registry:component", "title": "BlobCursor", "description": "Organic blob cursor that smoothly follows the pointer with inertia and elastic morphing." }, { "name": "BlobCursor-JS-TW", "type": "registry:component", "title": "BlobCursor", "description": "Organic blob cursor that smoothly follows the pointer with inertia and elastic morphing." }, { "name": "BlobCursor-TS-CSS", "type": "registry:component", "title": "BlobCursor", "description": "Organic blob cursor that smoothly follows the pointer with inertia and elastic morphing." }, { "name": "BlobCursor-TS-TW", "type": "registry:component", "title": "BlobCursor", "description": "Organic blob cursor that smoothly follows the pointer with inertia and elastic morphing." }, { "name": "ClickSpark-JS-CSS", "type": "registry:component", "title": "ClickSpark", "description": "Creates particle spark bursts at click position." }, { "name": "ClickSpark-JS-TW", "type": "registry:component", "title": "ClickSpark", "description": "Creates particle spark bursts at click position." }, { "name": "ClickSpark-TS-CSS", "type": "registry:component", "title": "ClickSpark", "description": "Creates particle spark bursts at click position." }, { "name": "ClickSpark-TS-TW", "type": "registry:component", "title": "ClickSpark", "description": "Creates particle spark bursts at click position." }, { "name": "Crosshair-JS-CSS", "type": "registry:component", "title": "Crosshair", "description": "Custom crosshair cursor with tracking, and link hover effects." }, { "name": "Crosshair-JS-TW", "type": "registry:component", "title": "Crosshair", "description": "Custom crosshair cursor with tracking, and link hover effects." }, { "name": "Crosshair-TS-CSS", "type": "registry:component", "title": "Crosshair", "description": "Custom crosshair cursor with tracking, and link hover effects." }, { "name": "Crosshair-TS-TW", "type": "registry:component", "title": "Crosshair", "description": "Custom crosshair cursor with tracking, and link hover effects." }, { "name": "Cubes-JS-CSS", "type": "registry:component", "title": "Cubes", "description": "3D rotating cube cluster. Supports auto-rotation or hover interaction." }, { "name": "Cubes-JS-TW", "type": "registry:component", "title": "Cubes", "description": "3D rotating cube cluster. Supports auto-rotation or hover interaction." }, { "name": "Cubes-TS-CSS", "type": "registry:component", "title": "Cubes", "description": "3D rotating cube cluster. Supports auto-rotation or hover interaction." }, { "name": "Cubes-TS-TW", "type": "registry:component", "title": "Cubes", "description": "3D rotating cube cluster. Supports auto-rotation or hover interaction." }, { "name": "ElectricBorder-JS-CSS", "type": "registry:component", "title": "ElectricBorder", "description": "Jittery electric energy border with animated arcs, glow and adjustable intensity." }, { "name": "ElectricBorder-JS-TW", "type": "registry:component", "title": "ElectricBorder", "description": "Jittery electric energy border with animated arcs, glow and adjustable intensity." }, { "name": "ElectricBorder-TS-CSS", "type": "registry:component", "title": "ElectricBorder", "description": "Jittery electric energy border with animated arcs, glow and adjustable intensity." }, { "name": "ElectricBorder-TS-TW", "type": "registry:component", "title": "ElectricBorder", "description": "Jittery electric energy border with animated arcs, glow and adjustable intensity." }, { "name": "FadeContent-JS-CSS", "type": "registry:component", "title": "FadeContent", "description": "Simple directional fade / slide entrance / exit wrapper with threshold-based activation." }, { "name": "FadeContent-JS-TW", "type": "registry:component", "title": "FadeContent", "description": "Simple directional fade / slide entrance / exit wrapper with threshold-based activation." }, { "name": "FadeContent-TS-CSS", "type": "registry:component", "title": "FadeContent", "description": "Simple directional fade / slide entrance / exit wrapper with threshold-based activation." }, { "name": "FadeContent-TS-TW", "type": "registry:component", "title": "FadeContent", "description": "Simple directional fade / slide entrance / exit wrapper with threshold-based activation." }, { "name": "GlareHover-JS-CSS", "type": "registry:component", "title": "GlareHover", "description": "Adds a realistic moving glare highlight on hover over any element." }, { "name": "GlareHover-JS-TW", "type": "registry:component", "title": "GlareHover", "description": "Adds a realistic moving glare highlight on hover over any element." }, { "name": "GlareHover-TS-CSS", "type": "registry:component", "title": "GlareHover", "description": "Adds a realistic moving glare highlight on hover over any element." }, { "name": "GlareHover-TS-TW", "type": "registry:component", "title": "GlareHover", "description": "Adds a realistic moving glare highlight on hover over any element." }, { "name": "GradualBlur-JS-CSS", "type": "registry:component", "title": "GradualBlur", "description": "Progressively un-blurs content based on scroll or trigger creating a cinematic reveal." }, { "name": "GradualBlur-JS-TW", "type": "registry:component", "title": "GradualBlur", "description": "Progressively un-blurs content based on scroll or trigger creating a cinematic reveal." }, { "name": "GradualBlur-TS-CSS", "type": "registry:component", "title": "GradualBlur", "description": "Progressively un-blurs content based on scroll or trigger creating a cinematic reveal." }, { "name": "GradualBlur-TS-TW", "type": "registry:component", "title": "GradualBlur", "description": "Progressively un-blurs content based on scroll or trigger creating a cinematic reveal." }, { "name": "GhostCursor-JS-CSS", "type": "registry:component", "title": "GhostCursor", "description": "Semi-transparent ghost cursor that smoothly follows the real cursor with a trailing effect." }, { "name": "GhostCursor-JS-TW", "type": "registry:component", "title": "GhostCursor", "description": "Semi-transparent ghost cursor that smoothly follows the real cursor with a trailing effect." }, { "name": "GhostCursor-TS-CSS", "type": "registry:component", "title": "GhostCursor", "description": "Semi-transparent ghost cursor that smoothly follows the real cursor with a trailing effect." }, { "name": "GhostCursor-TS-TW", "type": "registry:component", "title": "GhostCursor", "description": "Semi-transparent ghost cursor that smoothly follows the real cursor with a trailing effect." }, { "name": "ImageTrail-JS-CSS", "type": "registry:component", "title": "ImageTrail", "description": "Cursor-based image trail with several built-in variants." }, { "name": "ImageTrail-JS-TW", "type": "registry:component", "title": "ImageTrail", "description": "Cursor-based image trail with several built-in variants." }, { "name": "ImageTrail-TS-CSS", "type": "registry:component", "title": "ImageTrail", "description": "Cursor-based image trail with several built-in variants." }, { "name": "ImageTrail-TS-TW", "type": "registry:component", "title": "ImageTrail", "description": "Cursor-based image trail with several built-in variants." }, { "name": "LogoLoop-JS-CSS", "type": "registry:component", "title": "LogoLoop", "description": "Continuously looping marquee of brand or tech logos with seamless repeat and hover pause." }, { "name": "LogoLoop-JS-TW", "type": "registry:component", "title": "LogoLoop", "description": "Continuously looping marquee of brand or tech logos with seamless repeat and hover pause." }, { "name": "LogoLoop-TS-CSS", "type": "registry:component", "title": "LogoLoop", "description": "Continuously looping marquee of brand or tech logos with seamless repeat and hover pause." }, { "name": "LogoLoop-TS-TW", "type": "registry:component", "title": "LogoLoop", "description": "Continuously looping marquee of brand or tech logos with seamless repeat and hover pause." }, { "name": "Magnet-JS-CSS", "type": "registry:component", "title": "Magnet", "description": "Elements magnetically ease toward the cursor then settle back with spring physics." }, { "name": "Magnet-JS-TW", "type": "registry:component", "title": "Magnet", "description": "Elements magnetically ease toward the cursor then settle back with spring physics." }, { "name": "Magnet-TS-CSS", "type": "registry:component", "title": "Magnet", "description": "Elements magnetically ease toward the cursor then settle back with spring physics." }, { "name": "Magnet-TS-TW", "type": "registry:component", "title": "Magnet", "description": "Elements magnetically ease toward the cursor then settle back with spring physics." }, { "name": "MagnetLines-JS-CSS", "type": "registry:component", "title": "MagnetLines", "description": "Animated field lines bend toward the cursor." }, { "name": "MagnetLines-JS-TW", "type": "registry:component", "title": "MagnetLines", "description": "Animated field lines bend toward the cursor." }, { "name": "MagnetLines-TS-CSS", "type": "registry:component", "title": "MagnetLines", "description": "Animated field lines bend toward the cursor." }, { "name": "MagnetLines-TS-TW", "type": "registry:component", "title": "MagnetLines", "description": "Animated field lines bend toward the cursor." }, { "name": "MetaBalls-JS-CSS", "type": "registry:component", "title": "MetaBalls", "description": "Liquid metaball blobs that merge and separate with smooth implicit surface animation." }, { "name": "MetaBalls-JS-TW", "type": "registry:component", "title": "MetaBalls", "description": "Liquid metaball blobs that merge and separate with smooth implicit surface animation." }, { "name": "MetaBalls-TS-CSS", "type": "registry:component", "title": "MetaBalls", "description": "Liquid metaball blobs that merge and separate with smooth implicit surface animation." }, { "name": "MetaBalls-TS-TW", "type": "registry:component", "title": "MetaBalls", "description": "Liquid metaball blobs that merge and separate with smooth implicit surface animation." } ], "component_count": 540, "components_truncated": true, "component_types": { "registry:component": 540 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 135, "name": "@react-easy-modals", "category": "Niche/single-purpose", "tags": [ "aesthetic" ], "tagline": "Modal component for react-easy-modals. Integrates with shadcn Dialog for a simple, powerful modal system with TypeScript support and promise-based API.", "short_description": "Modal component for react-easy-modals. Integrates with shadcn Dialog for a simple, powerful modal system with TypeScript support and promise-based API.", "description": "react-easy-modals is a lightweight, zero-dependency, headless modal stack manager for React with a promise-based async/await API. The shadcn registry item integrates it with shadcn Dialog for drop-in use. Key features: ModalProvider context wrapper, useModal / useModalAt / useBeforeClose hooks, nested modal support, lazy loading, transition support, TypeScript-first. No animation library dependency. Free and open-source. Use for: replacing ad-hoc useState modal patterns with a clean imperative API when building multi-step flows or confirmation dialogs inside shadcn/ui projects.", "homepage": "https://react-easy-modals-docs.vercel.app", "docs": "https://react-easy-modals-docs.vercel.app/docs", "github": "https://github.com/AlexDemzz/react-easy-modals", "components_github": null, "github_default_branch": "master", "github_stars": 8, "last_commit": "2026-05-03T02:13:04Z", "archived": false, "license": null, "open_issues": 0, "registry_template": "https://react-easy-modals-docs.vercel.app/r/styles/{style}/{name}.json", "registry_index": "https://react-easy-modals-docs.vercel.app/r/registry.json", "components": [ "modal", "modal-baseui" ], "component_items": [ { "name": "modal", "type": "registry:ui", "title": "Modal (Radix)", "description": "Modal component for react-easy-modals with Radix Dialog." }, { "name": "modal-baseui", "type": "registry:ui", "title": "Modal (Base UI)", "description": "Modal component for react-easy-modals with Base UI Dialog. Supports nested modals." } ], "component_count": 2, "components_truncated": false, "component_types": { "registry:ui": 2 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 136, "name": "@react-slot", "category": "Hooks/utilities", "tags": [ "components" ], "tagline": "Vue-style slot composition for React - Fine-grained control over component composition", "short_description": "Vue-style slot composition for React - Fine-grained control over component composition", "description": "react-slot brings Vue-style named slots to React for fine-grained component composition. The registry provides a single Slot.tsx component with Slottable, SlotPlaceholder, Template, and useSlots primitives, enabling parent components to inject content into named slots defined in child templates. No styling dependencies — pure React utility. Very small footprint. Free and open-source (MIT). Use for: building compound components or layout primitives that need Vue-like named slot composition when Radix UI's asChild pattern is insufficient for your composition needs.", "homepage": "https://react-slot.vercel.app/", "docs": "https://react-slot.vercel.app", "github": "https://github.com/sina-byn/react-slot", "components_github": "https://github.com/sina-byn/react-slot/tree/main/components", "github_default_branch": "main", "github_stars": 2, "last_commit": "2026-04-22T11:09:01Z", "archived": false, "license": null, "open_issues": 0, "registry_template": "https://react-slot.vercel.app/r/{name}.json", "registry_index": "https://react-slot.vercel.app/r/registry.json", "components": [ "slot" ], "component_items": [ { "name": "slot", "type": "registry:component", "title": "React Slot", "description": "Vue-style slot composition for React" } ], "component_count": 1, "components_truncated": false, "component_types": { "registry:component": 1 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 137, "name": "@remocn", "category": "Niche/single-purpose", "tags": [ "dashboard", "aesthetic" ], "tagline": "Production-ready components for Remotion - text animations, backgrounds, transitions, UI blocks, and full scene compositions", "short_description": "Production-ready components for Remotion - text animations, backgrounds, transitions, UI blocks, and full scene compositions", "description": "remocn is a shadcn registry of 64+ production-ready Remotion video components for building product demos, changelogs, and launch videos in React. Categories: Text Animations (blur reveal, typewriter, shimmer sweep, slot machine, matrix decode, RGB glitch, kinetic type mask, infinite marquee), Backgrounds (mesh gradient, dynamic grid, spring pop-in), Transitions (chromatic aberration wipe, frosted glass wipe, directional wipe, grid pixelate, spatial push, zoom-through), UI Blocks (terminal simulator, browser flow, toast notification, animated charts, device mockup zoom, morphing modal), and full Compositions (product launch trailer, changelog bite, pricing tier focus). Built on Remotion 4.0, React 19, Tailwind v4, Next.js. Fully free, MIT license. Use for: creating animated product demo videos, changelogs, or documentation clips programmatically in React without a video editor.", "homepage": "https://www.remocn.dev/", "docs": "https://www.remocn.dev/docs/getting-started/introduction", "github": "https://github.com/kapishdima/remocn", "components_github": "https://github.com/kapishdima/remocn/tree/main/registry", "github_default_branch": "main", "github_stars": 904, "last_commit": "2026-07-08T08:03:13Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://www.remocn.dev/r/{name}.json", "registry_index": "https://www.remocn.dev/r/registry.json", "components": [ "soft-blur-in", "per-character-rise", "bottom-up-letters", "top-down-letters", "spring-scale-in", "micro-scale-fade", "scale-down-fade", "blur-out-up", "focus-blur-resolve", "line-by-line-slide", "per-word-crossfade", "fade-through", "shared-axis-y", "shared-axis-z", "short-slide-right", "kinetic-center-build", "short-slide-down", "typewriter", "inline-highlight", "strikethrough-replace", "staggered-fade-up", "mask-reveal-up", "tracking-in", "shimmer-sweep", "marker-highlight", "slot-machine-roll", "matrix-decode", "rgb-glitch-text", "infinite-marquee", "mesh-gradient-bg", "shader-mesh-gradient", "shader-grain-gradient", "shader-warp", "shader-swirl", "shader-water", "shader-spiral", "shader-liquid-metal", "shader-color-panels", "shader-neuro-noise", "shader-perlin-noise", "shader-simplex-noise", "shader-voronoi", "shader-dot-orbit", "shader-dithering", "shader-god-rays", "shader-smoke-ring", "shader-metaballs", "shader-pulsing-border", "dynamic-grid", "simulated-cursor", "swirl-dissolve", "dither-dissolve", "perlin-dissolve", "smoke-dissolve", "wave-wipe", "ripple-zoom", "grain-dissolve", "warp-dissolve", "whip-pan", "push-through", "focus-pull", "chat-to-preview-layout", "animated-line-chart", "animated-bar-chart", "terminal-simulator", "terminal-cursor-zoom", "progress-steps", "data-flow-pipes", "glass-code-block", "glass-code-walk", "spotlight-card", "perspective-marquee", "ecosystem-constellation", "live-code-compilation", "infinite-bento-pan", "github-sponsors", "github-stars", "number-wheel", "rolling-number", "x-follow-card", "x-followers-overview", "claude-chat", "chat-gpt", "v0", "claude-code", "opencode", "confetti", "backdrop", "logo-enter", "remocn-ui", "spinner", "caret", "button", "accordion", "alert-dialog", "dialog", "sheet", "drawer", "checkbox", "radio" ], "component_items": [ { "name": "soft-blur-in", "type": "registry:component", "title": "Soft Blur In", "description": "Per-character fade-in with a gentle blur and upward motion. Apple's signature hero-title reveal." }, { "name": "per-character-rise", "type": "registry:component", "title": "Per Character Rise", "description": "Letters slide up from below with no blur — crisp, deliberate, kinetic." }, { "name": "bottom-up-letters", "type": "registry:component", "title": "Bottom-Up Letters", "description": "Letters rise from below in a pronounced staircase, one symbol at a time, with zero blur." }, { "name": "top-down-letters", "type": "registry:component", "title": "Top-Down Letters", "description": "Letters descend from above in a pronounced staircase, one symbol at a time, with zero blur." }, { "name": "spring-scale-in", "type": "registry:component", "title": "Spring Scale In", "description": "Words pop in with a soft overshoot scale, like a physical spring settling into place." }, { "name": "micro-scale-fade", "type": "registry:component", "title": "Micro Scale Fade", "description": "A calm, tiny scale pop used as subtle premium polish for labels and headings." }, { "name": "scale-down-fade", "type": "registry:component", "title": "Scale Down Fade", "description": "Subtle premium settle-in with a restrained scale-down fade on exit." }, { "name": "blur-out-up", "type": "registry:component", "title": "Blur Out Up", "description": "Words arrive clean and depart upward with increasing blur for airy exits." }, { "name": "focus-blur-resolve", "type": "registry:component", "title": "Focus Blur Resolve", "description": "A premium focus pull from heavy blur to crisp text, then a soft blur-out exit." }, { "name": "line-by-line-slide", "type": "registry:component", "title": "Line-by-Line Slide", "description": "Each line enters from the left with a staggered slide and exits to the right for a flowing paragraph reveal." }, { "name": "per-word-crossfade", "type": "registry:component", "title": "Per-Word Crossfade", "description": "Words gently fade into place one after another, with a short vertical drift for a calm keynote rhythm." }, { "name": "fade-through", "type": "registry:component", "title": "Fade Through", "description": "A Material-style content transition: old fades out, new fades in with a soft delay." }, { "name": "shared-axis-y", "type": "registry:component", "title": "Shared Axis Y", "description": "Per-word hard-cut transition with staircase timing for sharp editorial swaps." }, { "name": "shared-axis-z", "type": "registry:component", "title": "Shared Axis Z", "description": "Scale-based shared-axis transition for focus shifts and context depth." }, { "name": "short-slide-right", "type": "registry:component", "title": "Short Slide Right", "description": "The whole phrase glides in from the left as one compact move while words reveal in sequence through opacity." }, { "name": "kinetic-center-build", "type": "registry:component", "title": "Kinetic Center Build", "description": "A word appears in the center; each new word enters from the right and pushes the line until the full phrase locks centered." }, { "name": "short-slide-down", "type": "registry:component", "title": "Short Slide Down", "description": "Each new word drops in from above into its own line and pushes the stack downward until a centered three-line composition locks in place." }, { "name": "typewriter", "type": "registry:component", "title": "Typewriter", "description": "Character-by-character text reveal with a deterministic blinking cursor." }, { "name": "inline-highlight", "type": "registry:component", "title": "Inline Highlight", "description": "Animates one word inside a sentence from a base color to a brand color." }, { "name": "strikethrough-replace", "type": "registry:component", "title": "Strikethrough Replace", "description": "Draws a strike line across old text then reveals new text in its place." }, { "name": "staggered-fade-up", "type": "registry:component", "title": "Staggered Fade Up", "description": "Words fade in and slide up one after another with a configurable delay." }, { "name": "mask-reveal-up", "type": "registry:component", "title": "Mask Reveal Up", "description": "Lines reveal upward with a soft masked feel and compact stagger." }, { "name": "tracking-in", "type": "registry:component", "title": "Tracking In", "description": "Letter-spacing collapses and blur clears with a springy motion." }, { "name": "shimmer-sweep", "type": "registry:component", "title": "Shimmer Sweep", "description": "Light shine sweeps across muted text via background-clip:text." }, { "name": "marker-highlight", "type": "registry:component", "title": "Marker Highlight", "description": "Colored marker block draws behind a phrase as the text color shifts." }, { "name": "slot-machine-roll", "type": "registry:component", "title": "Slot Machine Roll", "description": "Vertical reel scrolls characters from one value to another." }, { "name": "matrix-decode", "type": "registry:component", "title": "Matrix Decode", "description": "Random scramble resolves left-to-right into the target text." }, { "name": "rgb-glitch-text", "type": "registry:component", "title": "RGB Glitch Text", "description": "Three RGB-offset text copies jitter for a brief glitch window." }, { "name": "infinite-marquee", "type": "registry:component", "title": "Infinite Marquee", "description": "Seamlessly looping horizontal text strip with optional stroke style." }, { "name": "mesh-gradient-bg", "type": "registry:component", "title": "Mesh Gradient Background", "description": "Living gradient with amorphous color blobs slowly drifting across the frame." }, { "name": "shader-mesh-gradient", "type": "registry:component", "title": "Shader Mesh Gradient", "description": "WebGL mesh gradient backdrop driven per-frame for deterministic Remotion renders." }, { "name": "shader-grain-gradient", "type": "registry:component", "title": "Shader Grain Gradient", "description": "Grainy multi-stop gradient that drifts slowly with film-grain texture over the blend." }, { "name": "shader-warp", "type": "registry:component", "title": "Shader Warp", "description": "Domain-warped color field that folds and stretches like liquid." }, { "name": "shader-swirl", "type": "registry:component", "title": "Shader Swirl", "description": "Concentric bands swirling around a center point." }, { "name": "shader-water", "type": "registry:component", "title": "Shader Water", "description": "Caustic water-surface ripples with subtle refraction." }, { "name": "shader-spiral", "type": "registry:component", "title": "Shader Spiral", "description": "Rotating spiral arms radiating from the center." }, { "name": "shader-liquid-metal", "type": "registry:component", "title": "Shader Liquid Metal", "description": "Molten metallic surface with flowing specular highlights." }, { "name": "shader-color-panels", "type": "registry:component", "title": "Shader Color Panels", "description": "Overlapping translucent color panels sliding past each other." }, { "name": "shader-neuro-noise", "type": "registry:component", "title": "Shader Neuro Noise", "description": "Organic neural-web noise field that slowly morphs." }, { "name": "shader-perlin-noise", "type": "registry:component", "title": "Shader Perlin Noise", "description": "Classic Perlin noise clouds drifting across the frame." }, { "name": "shader-simplex-noise", "type": "registry:component", "title": "Shader Simplex Noise", "description": "Simplex noise flow field, smoother than Perlin." }, { "name": "shader-voronoi", "type": "registry:component", "title": "Shader Voronoi", "description": "Animated Voronoi cells shifting and re-tessellating." }, { "name": "shader-dot-orbit", "type": "registry:component", "title": "Shader Dot Orbit", "description": "Dots orbiting on concentric paths across the frame." }, { "name": "shader-dithering", "type": "registry:component", "title": "Shader Dithering", "description": "Ordered-dither shading over an animated gradient field." }, { "name": "shader-god-rays", "type": "registry:component", "title": "Shader God Rays", "description": "Volumetric light rays radiating from an off-screen source." }, { "name": "shader-smoke-ring", "type": "registry:component", "title": "Shader Smoke Ring", "description": "Soft smoke ring curling and dissipating in place." }, { "name": "shader-metaballs", "type": "registry:component", "title": "Shader Metaballs", "description": "Organic blobs merging and splitting like lava." }, { "name": "shader-pulsing-border", "type": "registry:component", "title": "Shader Pulsing Border", "description": "Glowing border frame that pulses around the edges." }, { "name": "dynamic-grid", "type": "registry:component", "title": "Dynamic Grid", "description": "Subtle moving grid background with configurable cell size and direction." }, { "name": "simulated-cursor", "type": "registry:component", "title": "Simulated Cursor", "description": "Animated mouse cursor moving between waypoints with click ripple feedback." }, { "name": "swirl-dissolve", "type": "registry:component", "title": "Swirl Dissolve", "description": "A swirl shader transition that unwinds open and winds shut to reveal the next scene." }, { "name": "dither-dissolve", "type": "registry:component", "title": "Dither Dissolve", "description": "A dithering shader transition that dissolves one scene into the next." }, { "name": "perlin-dissolve", "type": "registry:component", "title": "Perlin Dissolve", "description": "A perlin-noise shader transition that sweeps its noise threshold to dissolve one scene into the next." }, { "name": "smoke-dissolve", "type": "registry:component", "title": "Smoke Dissolve", "description": "A smoke-ring shader transition that expands the ring outward to reveal the next scene." }, { "name": "wave-wipe", "type": "registry:component", "title": "Wave Wipe", "description": "A grain-gradient wave that sweeps up across the frame, covering the outgoing scene and revealing the next one from below." }, { "name": "ripple-zoom", "type": "registry:component", "title": "Ripple Zoom", "description": "A grain-gradient ripple transition that flies the camera through the center of the rings while the next scene approaches from the depth." }, { "name": "grain-dissolve", "type": "registry:component", "title": "Grain Dissolve", "description": "A grain-gradient shader transition that disintegrates the outgoing scene into soft grainy shapes and condenses the next scene out of the noise." }, { "name": "warp-dissolve", "type": "registry:component", "title": "Warp Dissolve", "description": "A domain-warp shader transition that melts the outgoing scene into a folding color field and straightens back out into the next." }, { "name": "whip-pan", "type": "registry:component", "title": "Whip Pan", "description": "A whip-pan transition that flies both scenes through the frame in one move with velocity-based motion blur." }, { "name": "push-through", "type": "registry:component", "title": "Push Through", "description": "A dolly transition that blows the outgoing scene past the camera while the next one approaches from the depth." } ], "component_count": 134, "components_truncated": true, "component_types": { "registry:component": 133, "registry:lib": 1 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 138, "name": "@rescript-shadcn", "category": "Niche/single-purpose", "tags": [ "dashboard" ], "tagline": "Shadcn components rewritten in Rescript, compatible with shadcn CLI.", "short_description": "Shadcn components rewritten in Rescript, compatible with shadcn CLI.", "description": "rescript-shadcn rewrites the standard shadcn/ui component set in ReScript (a statically typed language that compiles to JavaScript), distributed via the shadcn CLI. Components observed include Accordion, Alert, AlertDialog, AspectRatio, Avatar, Badge, Breadcrumb, Button, ButtonGroup, Calendar, Card, Carousel, Chart, Checkbox, Collapsible, Combobox, Command, ContextMenu, DataTable, DatePicker, Dialog, Drawer, DropdownMenu, HoverCard, Input, InputOtp, Kbd, Label, Menubar, NativeSelect, NavigationMenu, Pagination, Popover, Progress, RadioGroup, Resizable, ScrollArea, Select, Separator, Sheet, Sidebar, Skeleton, Slider, Sonner, Spinner, Switch, Table, Tabs, Textarea, Toast, Toggle, ToggleGroup, Tooltip, and Typography. Built on Base UI. Free. Use for: ReScript/rescript-react projects that want shadcn-compatible UI components without writing JavaScript bindings manually.", "homepage": "https://rescript-shadcn.miriad.studio", "docs": "https://rescript-shadcn.miriad.studio", "github": "https://github.com/miriadhq/rescript-shadcn", "components_github": "https://github.com/miriadhq/rescript-shadcn/tree/main/registry", "github_default_branch": "main", "github_stars": 12, "last_commit": "2026-07-06T14:16:43Z", "archived": false, "license": null, "open_issues": 0, "registry_template": "https://rescript-shadcn.miriad.studio/r/{name}.json", "registry_index": "https://rescript-shadcn.miriad.studio/r/registry.json", "components": [ "StyleLuma", "StyleLyra", "StyleMaia", "StyleMira", "StyleNova", "StyleRhea", "StyleSera", "StyleVega", "Accordion", "Alert", "AlertDialog", "AspectRatio", "Attachment", "Avatar", "Badge", "Breadcrumb", "Bubble", "Button", "ButtonGroup", "Calendar", "Card", "Carousel", "Chart", "Checkbox", "Collapsible", "Combobox", "Command", "ContextMenu", "Dialog", "Direction", "Drawer", "DropdownMenu", "Empty", "Field", "HoverCard", "Icons", "Input", "InputGroup", "InputOtp", "Item", "Kbd", "Label", "Marker", "Menubar", "Message", "MessageScroller", "NativeSelect", "NavigationMenu", "Pagination", "Popover", "Progress", "RadioGroup", "Resizable", "ScrollArea", "Select", "Separator", "Sheet", "Sidebar", "Skeleton", "Slider", "Sonner", "Spinner", "Switch", "Table", "Tabs", "Textarea", "Toggle", "ToggleGroup", "Tooltip", "AccordionBasic", "AccordionBorders", "AccordionCard", "AccordionDemo", "AccordionDisabled", "AccordionMultiple", "AlertAction", "AlertBasic", "AlertColors", "AlertDemo", "AlertDestructive", "AlertDialogBasic", "AlertDialogDemo", "AlertDialogDestructive", "AlertDialogMedia", "AlertDialogSmall", "AlertDialogSmallMedia", "AspectRatioDemo", "AspectRatioPortrait", "AspectRatioSquare", "AttachmentDemo", "AttachmentGroup", "AttachmentImage", "AttachmentStates", "AttachmentTrigger", "AvatarBadge", "AvatarBadgeIcon", "AvatarBasic", "AvatarDemo", "AvatarDropdown", "AvatarGroup" ], "component_items": [ { "name": "StyleLuma", "type": "registry:style", "title": null, "description": null }, { "name": "StyleLyra", "type": "registry:style", "title": null, "description": null }, { "name": "StyleMaia", "type": "registry:style", "title": null, "description": null }, { "name": "StyleMira", "type": "registry:style", "title": null, "description": null }, { "name": "StyleNova", "type": "registry:style", "title": null, "description": null }, { "name": "StyleRhea", "type": "registry:style", "title": null, "description": null }, { "name": "StyleSera", "type": "registry:style", "title": null, "description": null }, { "name": "StyleVega", "type": "registry:style", "title": null, "description": null }, { "name": "Accordion", "type": "registry:ui", "title": null, "description": null }, { "name": "Alert", "type": "registry:ui", "title": null, "description": null }, { "name": "AlertDialog", "type": "registry:ui", "title": null, "description": null }, { "name": "AspectRatio", "type": "registry:ui", "title": null, "description": null }, { "name": "Attachment", "type": "registry:ui", "title": null, "description": null }, { "name": "Avatar", "type": "registry:ui", "title": null, "description": null }, { "name": "Badge", "type": "registry:ui", "title": null, "description": null }, { "name": "Breadcrumb", "type": "registry:ui", "title": null, "description": null }, { "name": "Bubble", "type": "registry:ui", "title": null, "description": null }, { "name": "Button", "type": "registry:ui", "title": null, "description": null }, { "name": "ButtonGroup", "type": "registry:ui", "title": null, "description": null }, { "name": "Calendar", "type": "registry:ui", "title": null, "description": null }, { "name": "Card", "type": "registry:ui", "title": null, "description": null }, { "name": "Carousel", "type": "registry:ui", "title": null, "description": null }, { "name": "Chart", "type": "registry:ui", "title": null, "description": null }, { "name": "Checkbox", "type": "registry:ui", "title": null, "description": null }, { "name": "Collapsible", "type": "registry:ui", "title": null, "description": null }, { "name": "Combobox", "type": "registry:ui", "title": null, "description": null }, { "name": "Command", "type": "registry:ui", "title": null, "description": null }, { "name": "ContextMenu", "type": "registry:ui", "title": null, "description": null }, { "name": "Dialog", "type": "registry:ui", "title": null, "description": null }, { "name": "Direction", "type": "registry:ui", "title": null, "description": null }, { "name": "Drawer", "type": "registry:ui", "title": null, "description": null }, { "name": "DropdownMenu", "type": "registry:ui", "title": null, "description": null }, { "name": "Empty", "type": "registry:ui", "title": null, "description": null }, { "name": "Field", "type": "registry:ui", "title": null, "description": null }, { "name": "HoverCard", "type": "registry:ui", "title": null, "description": null }, { "name": "Icons", "type": "registry:ui", "title": null, "description": null }, { "name": "Input", "type": "registry:ui", "title": null, "description": null }, { "name": "InputGroup", "type": "registry:ui", "title": null, "description": null }, { "name": "InputOtp", "type": "registry:ui", "title": null, "description": null }, { "name": "Item", "type": "registry:ui", "title": null, "description": null }, { "name": "Kbd", "type": "registry:ui", "title": null, "description": null }, { "name": "Label", "type": "registry:ui", "title": null, "description": null }, { "name": "Marker", "type": "registry:ui", "title": null, "description": null }, { "name": "Menubar", "type": "registry:ui", "title": null, "description": null }, { "name": "Message", "type": "registry:ui", "title": null, "description": null }, { "name": "MessageScroller", "type": "registry:ui", "title": null, "description": null }, { "name": "NativeSelect", "type": "registry:ui", "title": null, "description": null }, { "name": "NavigationMenu", "type": "registry:ui", "title": null, "description": null }, { "name": "Pagination", "type": "registry:ui", "title": null, "description": null }, { "name": "Popover", "type": "registry:ui", "title": null, "description": null }, { "name": "Progress", "type": "registry:ui", "title": null, "description": null }, { "name": "RadioGroup", "type": "registry:ui", "title": null, "description": null }, { "name": "Resizable", "type": "registry:ui", "title": null, "description": null }, { "name": "ScrollArea", "type": "registry:ui", "title": null, "description": null }, { "name": "Select", "type": "registry:ui", "title": null, "description": null }, { "name": "Separator", "type": "registry:ui", "title": null, "description": null }, { "name": "Sheet", "type": "registry:ui", "title": null, "description": null }, { "name": "Sidebar", "type": "registry:ui", "title": null, "description": null }, { "name": "Skeleton", "type": "registry:ui", "title": null, "description": null }, { "name": "Slider", "type": "registry:ui", "title": null, "description": null } ], "component_count": 468, "components_truncated": true, "component_types": { "registry:style": 8, "registry:ui": 61, "registry:example": 399 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 139, "name": "@retroui", "category": "Theming/styling", "tags": [ "dashboard", "aesthetic" ], "tagline": "A Neobrutalism styled React + TailwindCSS UI library for building bold, modern web apps. Perfect for any project using Shadcn/ui.", "short_description": "A Neobrutalism styled React + TailwindCSS UI library for building bold, modern web apps. Perfect for any project using Shadcn/ui.", "description": "RetroUI is a neobrutalism-styled React + Tailwind CSS component library (~100 registry items) offering a bold, high-contrast aesthetic as an alternative to minimal shadcn defaults. Core components include Accordion, Alert, Avatar, Badge, Breadcrumb, Button, Calendar, Card, Carousel, Checkbox, Command, ContextMenu, Dialog, Drawer, Empty, Input, Label, Loader, Menu, Popover, Progress, Radio, Select, Slider, Sonner, Switch, Tab, Table, Text/Typography, Textarea, TOC, Toggle, ToggleGroup, Tooltip, plus four chart types (Area, Bar, Line, Pie). MIT license, free and open-source. Use for: projects targeting a bold neobrutalist or retro visual identity that want pre-styled Tailwind components out of the box without extensive custom theming.", "homepage": "https://retroui.dev", "docs": "https://retroui.dev/docs", "github": "https://github.com/Logging-Studio/RetroUI", "components_github": "https://github.com/Logging-Studio/RetroUI/tree/main/components", "github_default_branch": "main", "github_stars": 1513, "last_commit": "2026-06-24T00:45:32Z", "archived": false, "license": "MIT", "open_issues": 1, "registry_template": "https://retroui.dev/r/{name}.json", "registry_index": "https://retroui.dev/r/registry.json", "components": [ "accordion", "alert", "alert-dialog", "aspect-ratio", "avatar", "badge", "breadcrumb", "button", "button-group", "calendar", "card", "carousel", "checkbox", "collapsible", "combobox", "command", "context-menu", "dialog", "direction", "drawer", "dropdown-menu", "empty", "field", "hover-card", "input", "input-group", "input-otp", "item", "kbd", "label", "menubar", "native-select", "navigation-menu", "pagination", "popover", "progress", "radio-group", "resizable", "scroll-area", "select", "separator", "sheet", "sidebar", "skeleton", "slider", "sonner", "spinner", "switch", "table", "tabs", "textarea", "toggle", "toggle-group", "tooltip" ], "component_items": [ { "name": "accordion", "type": "registry:ui", "title": null, "description": null }, { "name": "alert", "type": "registry:ui", "title": null, "description": null }, { "name": "alert-dialog", "type": "registry:ui", "title": null, "description": null }, { "name": "aspect-ratio", "type": "registry:ui", "title": null, "description": null }, { "name": "avatar", "type": "registry:ui", "title": null, "description": null }, { "name": "badge", "type": "registry:ui", "title": null, "description": null }, { "name": "breadcrumb", "type": "registry:ui", "title": null, "description": null }, { "name": "button", "type": "registry:ui", "title": null, "description": null }, { "name": "button-group", "type": "registry:ui", "title": null, "description": null }, { "name": "calendar", "type": "registry:ui", "title": null, "description": null }, { "name": "card", "type": "registry:ui", "title": null, "description": null }, { "name": "carousel", "type": "registry:ui", "title": null, "description": null }, { "name": "checkbox", "type": "registry:ui", "title": null, "description": null }, { "name": "collapsible", "type": "registry:ui", "title": null, "description": null }, { "name": "combobox", "type": "registry:ui", "title": null, "description": null }, { "name": "command", "type": "registry:ui", "title": null, "description": null }, { "name": "context-menu", "type": "registry:ui", "title": null, "description": null }, { "name": "dialog", "type": "registry:ui", "title": null, "description": null }, { "name": "direction", "type": "registry:ui", "title": null, "description": null }, { "name": "drawer", "type": "registry:ui", "title": null, "description": null }, { "name": "dropdown-menu", "type": "registry:ui", "title": null, "description": null }, { "name": "empty", "type": "registry:ui", "title": null, "description": null }, { "name": "field", "type": "registry:ui", "title": null, "description": null }, { "name": "hover-card", "type": "registry:ui", "title": null, "description": null }, { "name": "input", "type": "registry:ui", "title": null, "description": null }, { "name": "input-group", "type": "registry:ui", "title": null, "description": null }, { "name": "input-otp", "type": "registry:ui", "title": null, "description": null }, { "name": "item", "type": "registry:ui", "title": null, "description": null }, { "name": "kbd", "type": "registry:ui", "title": null, "description": null }, { "name": "label", "type": "registry:ui", "title": null, "description": null }, { "name": "menubar", "type": "registry:ui", "title": null, "description": null }, { "name": "native-select", "type": "registry:ui", "title": null, "description": null }, { "name": "navigation-menu", "type": "registry:ui", "title": null, "description": null }, { "name": "pagination", "type": "registry:ui", "title": null, "description": null }, { "name": "popover", "type": "registry:ui", "title": null, "description": null }, { "name": "progress", "type": "registry:ui", "title": null, "description": null }, { "name": "radio-group", "type": "registry:ui", "title": null, "description": null }, { "name": "resizable", "type": "registry:ui", "title": null, "description": null }, { "name": "scroll-area", "type": "registry:ui", "title": null, "description": null }, { "name": "select", "type": "registry:ui", "title": null, "description": null }, { "name": "separator", "type": "registry:ui", "title": null, "description": null }, { "name": "sheet", "type": "registry:ui", "title": null, "description": null }, { "name": "sidebar", "type": "registry:ui", "title": null, "description": null }, { "name": "skeleton", "type": "registry:ui", "title": null, "description": null }, { "name": "slider", "type": "registry:ui", "title": null, "description": null }, { "name": "sonner", "type": "registry:ui", "title": null, "description": null }, { "name": "spinner", "type": "registry:ui", "title": null, "description": null }, { "name": "switch", "type": "registry:ui", "title": null, "description": null }, { "name": "table", "type": "registry:ui", "title": null, "description": null }, { "name": "tabs", "type": "registry:ui", "title": null, "description": null }, { "name": "textarea", "type": "registry:ui", "title": null, "description": null }, { "name": "toggle", "type": "registry:ui", "title": null, "description": null }, { "name": "toggle-group", "type": "registry:ui", "title": null, "description": null }, { "name": "tooltip", "type": "registry:ui", "title": null, "description": null } ], "component_count": 54, "components_truncated": false, "component_types": { "registry:ui": 54 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 140, "name": "@reui", "category": "Dashboard/admin templates", "tags": [ "saas", "dashboard" ], "tagline": "Free & open-source library of 1,000+ components and patterns to 10x your productivity in shadcn projects.", "short_description": "Free & open-source library of 1,000+ components and patterns to 10x your productivity in shadcn projects.", "description": "ReUI is the largest free open-source shadcn/ui extension library, offering 1,000+ components across 68+ categories including 17 custom in-house primitives: Data Grid (TanStack Table + Virtual, DnD, pinning, resizing, infinite scroll), Kanban, Filters (URL-state, Zod, TanStack), Sortable, Timeline, Stepper, Tree, File Upload, Date Selector, Autocomplete, Number Field, and more. All components are shown in realistic dashboard layouts, not isolated demos. Supports both Radix UI and Base UI flavors, all five shadcn create styles (Vega, Nova, Maia, Lyra, Mira), Tailwind v4, TypeScript. A paid ReUI Pro tier is in waitlist. Free core is MIT. Use for: building complex admin dashboards or SaaS back-office UIs that need production-grade tables, filters, and data management components beyond base shadcn/ui.", "homepage": "https://reui.io", "docs": "https://reui.io/docs", "github": "https://github.com/keenthemes/reui", "components_github": "https://github.com/keenthemes/reui/tree/main/registry", "github_default_branch": "main", "github_stars": 3049, "last_commit": "2026-03-30T12:19:39Z", "archived": false, "license": "MIT", "open_issues": 35, "registry_template": "https://reui.io/r/{style}/{name}.json", "registry_index": "https://reui.io/r/registry.json", "components": [ "alert", "app-shell-1", "app-shell-10", "app-shell-11", "app-shell-12", "app-shell-13", "app-shell-14", "app-shell-15", "app-shell-16", "app-shell-17", "app-shell-18", "app-shell-19", "app-shell-2", "app-shell-20", "app-shell-3", "app-shell-4", "app-shell-5", "app-shell-6", "app-shell-7", "app-shell-8", "app-shell-9", "auth-1", "auth-10", "auth-11", "auth-12", "auth-13", "auth-14", "auth-15", "auth-16", "auth-17", "auth-18", "auth-19", "auth-2", "auth-20", "auth-3", "auth-4", "auth-5", "auth-6", "auth-7", "auth-8", "auth-9", "autocomplete", "badge", "blog-1", "blog-2", "blog-3", "blog-4", "blog-5", "blog-6", "c-accordion-1", "c-accordion-10", "c-accordion-11", "c-accordion-2", "c-accordion-3", "c-accordion-4", "c-accordion-5", "c-accordion-6", "c-accordion-7", "c-accordion-8", "c-accordion-9", "c-alert-1", "c-alert-10", "c-alert-11", "c-alert-12", "c-alert-13", "c-alert-14", "c-alert-15", "c-alert-16", "c-alert-17", "c-alert-18", "c-alert-19", "c-alert-2", "c-alert-20", "c-alert-3", "c-alert-4", "c-alert-5", "c-alert-6", "c-alert-7", "c-alert-8", "c-alert-9", "c-alert-dialog-1", "c-alert-dialog-10", "c-alert-dialog-11", "c-alert-dialog-12", "c-alert-dialog-13", "c-alert-dialog-14", "c-alert-dialog-2", "c-alert-dialog-3", "c-alert-dialog-4", "c-alert-dialog-5", "c-alert-dialog-6", "c-alert-dialog-7", "c-alert-dialog-8", "c-alert-dialog-9", "c-aspect-ratio-1", "c-aspect-ratio-2", "c-aspect-ratio-3", "c-aspect-ratio-4", "c-aspect-ratio-5", "c-aspect-ratio-6" ], "component_items": [ { "name": "alert", "type": "registry:ui", "title": "Alert", "description": null }, { "name": "app-shell-1", "type": "registry:block", "title": "Collapsible icon-rail sidebar app shell with workspace switcher, nested nav, an…", "description": "Dashboard app shell with an icon-collapsible sidebar: workspace switcher, nested platform nav with count badges, pinned resources with row action menus, theme …" }, { "name": "app-shell-10", "type": "registry:block", "title": "AI Agents App Shell with Collapsible Sidebar, Active-Project Rings, and Rich No…", "description": "Inset sidebar shell for an AI agents console: command-K search, collapsible agent nav, projects with progress rings, usage-limit card, org and theme switcher, …" }, { "name": "app-shell-11", "type": "registry:block", "title": "Operations app shell with four toggleable regions and a resizable bottom workbe…", "description": "Dense operations console: collapsible nav, resizable split panes, an expandable bottom workbench sheet, and a right calendar and agenda rail. ReUI Badge, Frame…" }, { "name": "app-shell-12", "type": "registry:block", "title": "Icon-rail sidebar app shell with command-K search, notifications feed, apps gri…", "description": "Dashboard shell: collapsible icon-rail sidebar with nested nav, Soon badges, and project progress rings, plus a header command-K search, rich notifications fee…" }, { "name": "app-shell-13", "type": "registry:block", "title": "Community feed app shell with full-width header above a collapsible icon-rail s…", "description": "Full-width header over a collapsible icon-rail sidebar for community feed apps. Search, Create button, avatar menu, theme toggle, grouped nav with badges, nest…" }, { "name": "app-shell-14", "type": "registry:block", "title": "Mini icon-rail app shell with per-section secondary nav and a tabbed workspace …", "description": "Three-region workspace shell: icon rail, a toggleable secondary nav that swaps per section, and a toolbar with List, Kanban, Calendar, Dashboard tabs plus Sort…" }, { "name": "app-shell-15", "type": "registry:block", "title": "Dark full-width topbar app shell with workspace switcher, pinnable sidebar nav,…", "description": "Dashboard shell with a fixed dark topbar over an icon-collapsible sidebar: workspace switcher, pin/unpin nav with badges, favorites group, gradient Upgrade men…" }, { "name": "app-shell-16", "type": "registry:block", "title": "Dual sidebar app shell with icon rail and collapsible secondary navigation panel", "description": "Two-level dashboard layout: icon rail plus a toggleable secondary nav that swaps per section, with workspace switcher, breadcrumb header, search, and account m…" }, { "name": "app-shell-17", "type": "registry:block", "title": "AI chat assistant app shell with floating sidebar, model picker grid, and promp…", "description": "AI chat workspace: floating collapsible sidebar with a GPT-4/Claude/Gemini model picker, pinned and recent threads, a welcome canvas, and an InputGroup compose…" }, { "name": "app-shell-18", "type": "registry:block", "title": "Task workspace app shell with collapsible floating sidebar and a toggleable AI …", "description": "Three-panel to-do shell: floating Sidebar with task lists, count Badges, color tags and a Progress focus card, plus a toggleable AI chat panel (in-flow at desk…" }, { "name": "app-shell-19", "type": "registry:block", "title": "Calendar app shell with inset sidebar date picker, up-next agenda, and Day/Week…", "description": "Calendar app layout: inset Sidebar with a Calendar date picker, up-next agenda, calendars menu, account menu, and a header Day/Week/Month switcher. ReUI Badge,…" }, { "name": "app-shell-2", "type": "registry:block", "title": "Floating icon-collapsible sidebar shell with command-K search, nested nav, and …", "description": "App shell with a floating collapsible-to-icon Sidebar, command-K search Dialog, nested Platform nav with a live status pulse, workspace switcher Dropdown, and …" }, { "name": "app-shell-20", "type": "registry:block", "title": "Mail client app shell with folder sidebar, split list and reading panes, and ic…", "description": "Email workspace: inset Sidebar with account menu, compose dialog, folders, labels and contacts, a search and category-filter message list, a reading pane, and …" }, { "name": "app-shell-3", "type": "registry:block", "title": "Inset sidebar app shell with per-project progress rings and a multi-type notifi…", "description": "Inset collapsible sidebar dashboard shell with workspace switcher, command search, project donut progress rings, usage limit meter, and notifications popover. …" }, { "name": "app-shell-4", "type": "registry:block", "title": "Mail inbox app shell with icon folder rail, wide message list, and selected-mes…", "description": "Mail and inbox shell: folder icon rail plus a wide 440px message list with live search, filter tabs, rich preview rows, and a selected-message action header (r…" }, { "name": "app-shell-5", "type": "registry:block", "title": "Calendar app shell, icon-rail sidebar switching Calendar, Schedule, Contacts, N…", "description": "Calendar workspace with a dual-pane icon-rail Sidebar swapping mini-Calendar accounts, date-grouped Schedule, searchable Contacts, and Notifications. Uses ReUI…" }, { "name": "app-shell-6", "type": "registry:block", "title": "Dual Sidebar App Shell with Dark Nav Rail and Slide-In Calendar Context Panel", "description": "Three-column workspace shell: dark collapsible nav rail with command search, team list and usage meter, breadcrumb header, and a slide-in right Calendar panel …" }, { "name": "app-shell-7", "type": "registry:block", "title": "Breadcrumb-switcher app shell with org/app/environment dropdowns and a live sys…", "description": "Header-first shell with a breadcrumb of org, app, and environment switcher dropdowns, a live system monitor popover with resource sparklines, command-palette s…" }, { "name": "app-shell-8", "type": "registry:block", "title": "Inset icon-rail app shell with per-section secondary nav, org/app/env switchers…", "description": "Two-level dashboard shell: icon rail plus a per-section secondary nav with live-metric/storage footers, org/app/env switchers, command-K search, and notificati…" }, { "name": "app-shell-9", "type": "registry:block", "title": "Dark inset-sidebar team workspace shell with member presence rail and notificat…", "description": "Dark collapsible-sidebar team shell: presence member rail, notifications feed, command search, AI-credit usage card, workspace switcher. ReUI Frame, Badge; sha…" }, { "name": "auth-1", "type": "registry:block", "title": "Split-screen login page with animated grid backdrop and editorial image panel", "description": "Sign-in page pairing an email or username and password form with show/hide toggle and Google plus Apple buttons over a masked animated grid and a full-height p…" }, { "name": "auth-10", "type": "registry:block", "title": "Split magic-link sign-in with a framed testimonial and customer logo wall trust…", "description": "Split passwordless login: magic-link email field plus Google, Apple, and GitHub SSO, beside a Frame trust card with a star-rated testimonial and brand logo wal…" }, { "name": "auth-11", "type": "registry:block", "title": "Split-screen login with testimonial sidebar and animated dot backdrop", "description": "Two-column login: email or username plus password with show/hide toggle, Google and Apple buttons, and a sidebar with a star-rated testimonial and trust-brand …" }, { "name": "auth-12", "type": "registry:block", "title": "Split login method picker with passkey, SAML SSO, and a framed brand-logo testi…", "description": "Login with Google, email, WebAuthn passkey, SAML SSO, and backup code, a two-step email reveal, and a framed sidebar with an animated brand-logo grid and rotat…" }, { "name": "auth-13", "type": "registry:block", "title": "Split-screen magic-link sign-in with left image sidebar and social login buttons", "description": "Magic-link login page: work email field sends a secure sign-in link, plus Google, Apple, and GitHub social buttons. Two-column split with a full-cover image si…" }, { "name": "auth-14", "type": "registry:block", "title": "Split-screen workspace sign-in with animated stacked media panel and social SSO", "description": "Two-column workspace login page: email and password with show/hide toggle, forgot-password, and Google, Apple, GitHub SSO buttons beside an auto-cycling stacke…" }, { "name": "auth-15", "type": "registry:block", "title": "Centered magic-link email login with logo, social sign-in buttons, and legal fo…", "description": "Passwordless email login that sends a magic link, plus Google, Apple, and GitHub sign-in and a terms and copyright footer. Built with ReUI InputGroup, Field, B…" }, { "name": "auth-16", "type": "registry:block", "title": "Full-page sign-in with app header, SSO and email-continue form, and customer lo…", "description": "Single-column sign-in: app header with create-workspace link, centered Google, GitHub, and SSO buttons over one work-email Continue field, plus a footer custom…" }, { "name": "auth-17", "type": "registry:block", "title": "Centered login method picker with WebAuthn passkey sign-in and email reveal step", "description": "Two-step sign-in: a centered method picker (Google, email, SAML SSO, passkey, backup code) that reveals an email field, with real WebAuthn passkey auth and toa…" }, { "name": "auth-18", "type": "registry:block", "title": "Split-screen sign-in with testimonial sidebar, social login, and password show/…", "description": "Two-column login: email or username field, password Input with show/hide toggle, Google and Apple buttons, plus a testimonial and trust-brand sidebar. Uses ReU…" }, { "name": "auth-19", "type": "registry:block", "title": "Passwordless workspace sign-in page with magic-link work email and Google plus …", "description": "Full-page login screen that emails a secure sign-in link to an approved work address, with Google and GitHub OAuth buttons above an or divider. Built from ReUI…" }, { "name": "auth-2", "type": "registry:block", "title": "Split-screen login with an autoplay founder testimonial carousel and Trustpilot…", "description": "Email or username and password sign-in with show/hide toggle and Google, Apple, GitHub buttons, beside a dark panel with an autoplay founder testimonial carous…" }, { "name": "auth-20", "type": "registry:block", "title": "Centered sign-in card with Google and Apple buttons, password visibility toggle…", "description": "Login page with social sign-in (Google, Apple), an email or username field, and a show or hide password toggle, plus forgot-password and create-account links. …" }, { "name": "auth-3", "type": "registry:block", "title": "Split-screen magic-link sign-in with testimonial and trust-brand sidebar on a d…", "description": "Passwordless magic-link sign-in with a single work-email field and Google, Apple, GitHub buttons, beside a testimonial and trust-brand sidebar on a twinkling d…" }, { "name": "auth-4", "type": "registry:block", "title": "Framed password sign-in card with email or username, social provider row, and f…", "description": "Login on a noise-textured background: ReUI Frame card with email-or-username and password fields, show/hide toggle, full-width submit, plus a Google/Apple/GitH…" }, { "name": "auth-5", "type": "registry:block", "title": "Split-screen marketing trial signup page with animated gradient blob background…", "description": "Full-page registration with a marketing hero, OAuth buttons (Google, GitHub), email and show/hide password fields, and a brand logo trust strip over drifting g…" }, { "name": "auth-6", "type": "registry:block", "title": "Split-screen login with social OAuth and testimonial sidebar over an animated g…", "description": "Two-column sign-in page: email or username, password with show/hide toggle, Forgot password, and Google/Apple/GitHub OAuth, beside a customer testimonial and b…" }, { "name": "auth-7", "type": "registry:block", "title": "Blueprint-framed passwordless sign-in card with magic-link email and customer t…", "description": "Centered dark magic-link sign-in: email field sends a sign-in link, with Google, Apple and GitHub OAuth, a dashed crosshair-cornered frame, and a customer logo…" }, { "name": "auth-8", "type": "registry:block", "title": "Centered Frame login card over a softened photo backdrop with social provider s…", "description": "Single-card sign-in centered on a blurred Unsplash photo with noise grain: email or username and password fields, show/hide toggle, Forgot password, and Google…" }, { "name": "auth-9", "type": "registry:block", "title": "Split magic-link sign-in with an animated brand-logo grid sidebar and rotating …", "description": "Split passwordless login: a work-email field emails a 15-minute magic link, with Google, Apple, GitHub buttons, beside a sidebar of brand logos animating in a …" }, { "name": "autocomplete", "type": "registry:ui", "title": "Autocomplete", "description": null }, { "name": "badge", "type": "registry:ui", "title": "Badge", "description": null }, { "name": "blog-1", "type": "registry:block", "title": "Blog index with cover-image post cards in a responsive three-column grid and au…", "description": "Blog listing on a responsive 1/2/3-column grid of Cards: 16:10 cover, date and read-time, clamped title and excerpt, author footer with Avatar and Read link. B…" }, { "name": "blog-2", "type": "registry:block", "title": "Full-image blog post cards with titles overlaid on covers, hover zoom, and pill…", "description": "Blog index of three full-bleed cover-image cards with a gradient scrim, title and tone label overlaid on the photo, a white pill category Badge, and hover zoom…" }, { "name": "blog-3", "type": "registry:block", "title": "Blog article carousel with cover cards, circular prev/next controls and a progr…", "description": "Featured-article blog carousel with circular prev/next buttons and a 1px progress line as position indicator. Cover scales on hover; category badge and read ti…" }, { "name": "blog-4", "type": "registry:block", "title": "Three-column blog index with stacked Frame cards, grayscale hover-zoom covers, …", "description": "Blog index listing posts as stacked ReUI Frame cards in a three-column row: grayscale cover that zooms on hover, category, date, title, excerpt, and an author …" }, { "name": "blog-5", "type": "registry:block", "title": "Blog post detail page with gradient overlay image hero, byline, pull quote, and…", "description": "Reading page for one blog post, news, changelog, or case study. Cover with gradient scrim, overlaid title and category badge, byline, sections, pull quote, aut…" }, { "name": "blog-6", "type": "registry:block", "title": "Single-column blog post detail page with breadcrumb, author byline, topic badge…", "description": "Centered max-w-3xl blog post detail page: breadcrumb, headline, author byline, cover image, body sections, topic badges, and a two-up Read Next grid of related…" }, { "name": "c-accordion-1", "type": "registry:block", "title": "A basic single-expand accordion", "description": "A basic single-expand accordion" }, { "name": "c-accordion-10", "type": "registry:block", "title": "Accordion with rotating arrow indicator", "description": "Accordion with rotating arrow indicator" }, { "name": "c-accordion-11", "type": "registry:block", "title": "Accordion component for onboarding or setup steps with icons, badges, and QR co…", "description": "Accordion component for onboarding or setup steps with icons, badges, and QR codes" }, { "name": "c-accordion-2", "type": "registry:block", "title": "Accordion with plus/minus indicators", "description": "Accordion with plus/minus indicators" }, { "name": "c-accordion-3", "type": "registry:block", "title": "Accordion with borders and rounded corners", "description": "Accordion with borders and rounded corners" }, { "name": "c-accordion-4", "type": "registry:block", "title": "Accordion embedded within a Card", "description": "Accordion embedded within a Card" }, { "name": "c-accordion-5", "type": "registry:block", "title": "Accordion with disabled items and highlighted state", "description": "Accordion with disabled items and highlighted state" }, { "name": "c-accordion-6", "type": "registry:block", "title": "Advanced accordion with custom icons and badges", "description": "Advanced accordion with custom icons and badges" }, { "name": "c-accordion-7", "type": "registry:block", "title": "Accordion items integrated within Frame and FramePanel", "description": "Accordion items integrated within Frame and FramePanel" }, { "name": "c-accordion-8", "type": "registry:block", "title": "Nested accordion example with bordered items", "description": "Nested accordion example with bordered items" }, { "name": "c-accordion-9", "type": "registry:block", "title": "User list accordion with avatars and role indicators", "description": "User list accordion with avatars and role indicators" } ], "component_count": 1534, "components_truncated": true, "component_types": { "registry:ui": 26, "registry:block": 1504, "registry:hook": 4 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 141, "name": "@roiui", "category": "Component library (general)", "tags": [ "dashboard", "aesthetic", "components" ], "tagline": "Roi UI is a library that offers UI components and blocks built with Base UI primitives. Some blocks and components use motion (framer). Everything is open-source and will be forever.", "short_description": "Roi UI is a library that offers UI components and blocks built with Base UI primitives. Some blocks and components use motion (framer). Everything is open-source and will be forever.", "description": "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.", "homepage": "https://roiui.com", "docs": "https://roiui.com/docs", "github": "https://github.com/preetecool/roi-ui", "components_github": "https://github.com/preetecool/roi-ui/tree/main/registry", "github_default_branch": "main", "github_stars": 51, "last_commit": "2026-07-06T21:19:16Z", "archived": false, "license": null, "open_issues": 0, "registry_template": "https://roiui.com/r/{name}.json", "registry_index": "https://roiui.com/r/registry.json", "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" ], "component_items": [ { "name": "utils", "type": "registry:item", "title": null, "description": null }, { "name": "utils-tailwind", "type": "registry:item", "title": null, "description": null }, { "name": "accordion", "type": "registry:item", "title": "Accordion", "description": "A collapsible content component." }, { "name": "alert-dialog", "type": "registry:item", "title": "Alert Dialog", "description": "A modal dialog that interrupts the user with important content." }, { "name": "autocomplete", "type": "registry:item", "title": "Autocomplete", "description": "An input that suggests options as you type." }, { "name": "alert", "type": "registry:item", "title": "Alert", "description": "A component for displaying important messages to users." }, { "name": "avatar", "type": "registry:item", "title": "Avatar", "description": "An image element with a fallback for representing the user." }, { "name": "background", "type": "registry:item", "title": "Background", "description": "A background component with various visual effects." }, { "name": "badge", "type": "registry:item", "title": "Badge", "description": "A small count and labeling component." }, { "name": "button", "type": "registry:item", "title": "Button", "description": "A button component." }, { "name": "card", "type": "registry:item", "title": "Card", "description": "A container component for displaying content." }, { "name": "calendar", "type": "registry:item", "title": "Calendar", "description": "A date picker calendar component." }, { "name": "carousel", "type": "registry:item", "title": "Carousel", "description": "A slideshow component for cycling through content." }, { "name": "checkbox", "type": "registry:item", "title": "Checkbox", "description": "A control that allows users to select one or more options from a set." }, { "name": "checkbox-group", "type": "registry:item", "title": "Checkbox Group", "description": "A set of checkboxes with shared state management for selecting multiple options." }, { "name": "collapsible", "type": "registry:item", "title": "Collapsible", "description": "An expandable/collapsible panel controlled by a button." }, { "name": "combobox", "type": "registry:item", "title": "Combobox", "description": "A searchable select component." }, { "name": "command", "type": "registry:item", "title": "Command", "description": "A command palette component." }, { "name": "context-menu", "type": "registry:item", "title": "Context Menu", "description": "A menu component triggered by right-click or long press." }, { "name": "copy-button", "type": "registry:item", "title": "Copy Button", "description": "A button component with animated copy-to-clipboard functionality." }, { "name": "dialog", "type": "registry:item", "title": "Dialog", "description": "A modal dialog component." }, { "name": "drawer", "type": "registry:item", "title": "Drawer", "description": "A panel that slides in from the edge of the screen with swipe-to-dismiss gestures." }, { "name": "dropdown-menu", "type": "registry:item", "title": "Dropdown Menu", "description": "A dropdown menu component." }, { "name": "expandable-card", "type": "registry:item", "title": "Expandable Card", "description": "A card component that can expand to show more content." }, { "name": "expandable-card-carousel", "type": "registry:item", "title": "Expandable Card Carousel", "description": "A carousel of expandable cards showcasing core philosophies." }, { "name": "field", "type": "registry:item", "title": "Field", "description": "A form field component with label and validation." }, { "name": "fieldset", "type": "registry:item", "title": "Fieldset", "description": "A native fieldset element with an easily stylable legend." }, { "name": "form", "type": "registry:item", "title": "Form", "description": "A form component for handling user input." }, { "name": "input", "type": "registry:item", "title": "Input", "description": "An input component for user text entry." }, { "name": "like-button", "type": "registry:item", "title": "Like Button", "description": "A button component for liking content." }, { "name": "kbd", "type": "registry:item", "title": "Kbd", "description": "A component for displaying keyboard keys and shortcuts." }, { "name": "menubar", "type": "registry:item", "title": "Menubar", "description": "A horizontal menu bar component." }, { "name": "meter", "type": "registry:item", "title": "Meter", "description": "A graphical display of a numeric value within a range." }, { "name": "navigation-menu", "type": "registry:item", "title": "Navigation Menu", "description": "A navigation menu component." }, { "name": "otp-field", "type": "registry:item", "title": "OTP Field", "description": "A one-time password and verification code entry field." }, { "name": "popover", "type": "registry:item", "title": "Popover", "description": "A floating content container." }, { "name": "radio", "type": "registry:item", "title": "Radio", "description": "A customizable radio button component for selecting one option from a group." }, { "name": "scroll-area", "type": "registry:item", "title": "Scroll Area", "description": "A native scroll container with custom scrollbars." }, { "name": "select", "type": "registry:item", "title": "Select", "description": "A customizable select component for choosing from a list of options." }, { "name": "separator", "type": "registry:item", "title": "Separator", "description": "A separator element accessible to screen readers." }, { "name": "slider", "type": "registry:item", "title": "Slider", "description": "A slider component for selecting values from a range." }, { "name": "switch", "type": "registry:item", "title": "Switch", "description": "A toggle switch component." }, { "name": "tabs", "type": "registry:item", "title": "Tabs", "description": "A set of layered sections of content." }, { "name": "table", "type": "registry:item", "title": "Table", "description": "A responsive table component for displaying structured tabular data." }, { "name": "toast", "type": "registry:item", "title": "Toast", "description": "A succinct message notification." }, { "name": "toggle", "type": "registry:item", "title": "Toggle", "description": "A two-state button that can be turned on or off." }, { "name": "toggle-group", "type": "registry:item", "title": "Toggle Group", "description": "A set of two-state buttons that can be toggled on or off with shared state management." }, { "name": "toolbar", "type": "registry:item", "title": "Toolbar", "description": "A toolbar component for grouping action buttons and controls." }, { "name": "tooltip", "type": "registry:item", "title": "Tooltip", "description": "A popup that displays information on hover." }, { "name": "chart", "type": "registry:item", "title": "Chart", "description": "Composable chart components for building any type of data visualization with Recharts primitives." }, { "name": "progress", "type": "registry:item", "title": "Progress", "description": "Displays the status of a task that takes a long time." }, { "name": "prop-table", "type": "registry:item", "title": "Prop Table", "description": "An expandable table for documenting component props." }, { "name": "number-field", "type": "registry:item", "title": "Number Field", "description": "A numeric input element with increment/decrement buttons and a scrub area." }, { "name": "slider", "type": "registry:item", "title": "Slider", "description": "A range input component for selecting values within a given range." }, { "name": "card-login", "type": "registry:item", "title": "Card Login", "description": "A login card component with email/password fields and social login options." }, { "name": "card-task", "type": "registry:item", "title": "Card Task", "description": "A task card component with badges, avatars, and action menu." }, { "name": "card-traffic", "type": "registry:item", "title": "Card Traffic", "description": "A website traffic card component with line chart and statistics." }, { "name": "card-image-section", "type": "registry:item", "title": "Card Image Section", "description": "A section with 4 image cards in a masonry layout." }, { "name": "ai-chat", "type": "registry:item", "title": "AI Chat", "description": "An AI chat input component with mode selector and action buttons." }, { "name": "card-progress", "type": "registry:item", "title": "Progress Card", "description": "A file upload progress card with multiple file tracking." } ], "component_count": 124, "components_truncated": true, "component_types": { "registry:item": 124 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 142, "name": "@sabraman", "category": "Niche/single-purpose", "tags": [ "mobile", "aesthetic" ], "tagline": "Legacy skeuomorphic UI components and blocks for shadcn.", "short_description": "Legacy skeuomorphic UI components and blocks for shadcn.", "description": "A small personal shadcn registry by Saint Petersburg-based designer/developer Danya Yudin (Sabraman), offering skeuomorphic legacy-style UI components for Next.js. Components confirmed include Roundbit, Legacy Wheel Picker, Legacy Switch, Legacy Slider, Legacy Code Block Command, Legacy Clock, Legacy Alert Dialog, Legacy Bar Button, and Legacy Notification — all evoking iOS/macOS classic skeuomorphic aesthetics. No public GitHub. Free. Use for: adding retro-skeuomorphic iOS-inspired UI accents — scroll pickers, physical-style switches, or analog clocks — into a shadcn/ui project that needs a distinct tactile visual style.", "homepage": "https://sabraman.ru/components", "docs": "https://sabraman.ru/components", "github": "N/A", "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://sabraman.ru/r/{name}.json", "registry_index": "https://sabraman.ru/r/registry.json", "components": [ "roundbit", "legacy-wheel-picker", "legacy-clock", "legacy-notification", "legacy-switch", "legacy-slider", "legacy-code-block-command", "legacy-alert-dialog", "legacy-bar-button" ], "component_items": [ { "name": "roundbit", "type": "registry:item", "title": "Roundbit", "description": "Pixel-stepped rounded corners with Tailwind-style utilities, runtime clip-path generation, and a frame primitive for shaped borders and shadows." }, { "name": "legacy-wheel-picker", "type": "registry:block", "title": "Legacy Wheel Picker", "description": "Legacy wheel picker component built on top of @ncdai/react-wheel-picker." }, { "name": "legacy-clock", "type": "registry:ui", "title": "Legacy Clock", "description": "Working analog clock icon with live hour, minute, and red seconds hands in day and night variants." }, { "name": "legacy-notification", "type": "registry:ui", "title": "Legacy Notification", "description": "Sonner-powered lock-screen notification toast with glossy legacy iOS chrome." }, { "name": "legacy-switch", "type": "registry:ui", "title": "Legacy Switch", "description": "Legacy toggle switch built on top of @radix-ui/react-switch." }, { "name": "legacy-slider", "type": "registry:ui", "title": "Legacy Slider", "description": "Glossy legacy slider control with a raised metallic thumb and silver-blue track." }, { "name": "legacy-code-block-command", "type": "registry:ui", "title": "Legacy Code Block Command", "description": "Skeuomorphic legacy command block with package-manager tabs and clipboard support." }, { "name": "legacy-alert-dialog", "type": "registry:ui", "title": "Legacy Alert Dialog", "description": "Muted navy legacy alert dialog with a silver gloss cap, white keyline, and classic confirmation buttons." }, { "name": "legacy-bar-button", "type": "registry:ui", "title": "Legacy Bar Button", "description": "Classic legacy navigation bar button with text, icon, text-icon, backward, accent, and destructive variants." } ], "component_count": 9, "components_truncated": false, "component_types": { "registry:item": 1, "registry:block": 1, "registry:ui": 7 }, "has_logo": true, "enrichment_errors": [ "github_lookup_failed" ], "featured": false }, { "number": 143, "name": "@satoriui", "category": "Animated components", "tags": [ "saas", "aesthetic" ], "tagline": "A comprehensive suite of high-fidelity interaction components. It offers motion-driven components that designed with motion-react and tailwindcss, that blends seamlessly.", "short_description": "A comprehensive suite of high-fidelity interaction components. It offers motion-driven components that designed with motion-react and tailwindcss, that blends seamlessly.", "description": "Satori UI is a collection of 50+ production-ready React components with physics-based spring-motion animations powered by motion-react (Framer Motion). Components are organized into Components, Interactions, Foundations, and Templates sections. The site highlights a keyboard UI component as a featured example of the tactile, physics-driven feel. Fully accessible, MIT licensed. A Templates and Pricing section suggests freemium or commercial tiers may exist. Tailwind CSS, React, motion-react. Use for: adding premium, spring-physics-driven UI interactions — keyboards, cards, toggles, and micro-interactions — to apps that need a polished, tactile motion feel beyond CSS transitions.", "homepage": "https://satoriui.site", "docs": "https://satoriui.site", "github": "N/A", "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://satoriui.site/r/{name}.json", "registry_index": "https://satoriui.site/r/registry.json", "components": [ "dotted-modern", "keyboard", "security-card", "scroll-tracker", "pro-button", "typewriter-loop", "cyberpunk-button", "flip-clock", "encoded-reveal", "slide-up-reveal", "blur-reveal", "shimmer-text", "kinetic-grid", "beacon-badge", "pulse-button" ], "component_items": [ { "name": "dotted-modern", "type": "registry:component", "title": "Dotted Modern", "description": "Modern dotted background hero component with animated open-source badge." }, { "name": "keyboard", "type": "registry:component", "title": "Keyboard UI", "description": "Sleek, minimalistic & interactive keyboard UI." }, { "name": "security-card", "type": "registry:component", "title": "Security Card", "description": "A sleek security card component with 3D shield visualization." }, { "name": "scroll-tracker", "type": "registry:component", "title": "Scroll Tracker", "description": "Track scroll progress with a visual indicator." }, { "name": "pro-button", "type": "registry:component", "title": "Pro Button", "description": "A high-impact call-to-action with a signature pixel icon and premium finish." }, { "name": "typewriter-loop", "type": "registry:component", "title": "Typewriter Loop", "description": "A looping typewriter CTA with a gradient support, premium touch." }, { "name": "cyberpunk-button", "type": "registry:component", "title": "Cyberpunk Button", "description": "Futuristic, minimalistic button with smooth animations." }, { "name": "flip-clock", "type": "registry:component", "title": "Cyberpunk Button", "description": "Neat and clean functional clock ui with buttery smooth flip animations." }, { "name": "encoded-reveal", "type": "registry:component", "title": "Encoded Reveal", "description": "Matrix like animation, reveals text with random characters." }, { "name": "slide-up-reveal", "type": "registry:component", "title": "Slide Up Reveal", "description": "Buttery smooth text reveal with slide up reveal animation." }, { "name": "blur-reveal", "type": "registry:component", "title": "Blur Reveal", "description": "Mysterious blur reveal animation, just feels awesome." }, { "name": "shimmer-text", "type": "registry:component", "title": "Shimmer Text", "description": "Smooth shimmer animation for premium touch." }, { "name": "kinetic-grid", "type": "registry:component", "title": "Kinetic Grid", "description": "Kinetic grid animation." }, { "name": "beacon-badge", "type": "registry:component", "title": "Beacon Badge", "description": "A status badge with a customizable beacon (ping) animation and blur reveal text." }, { "name": "pulse-button", "type": "registry:component", "title": "Pulse Button", "description": "A high-impact, beautifully animated button with pulsing dot patterns and smooth interactions." } ], "component_count": 15, "components_truncated": false, "component_types": { "registry:component": 15 }, "has_logo": true, "enrichment_errors": [ "github_lookup_failed" ], "featured": true }, { "number": 144, "name": "@scrollxui", "category": "Animated components", "tags": [ "saas", "aesthetic" ], "tagline": "ScrollX UI is an open-source React and shadcn-compatible component library for animated, interactive, and customizable user interfaces. It offers motion-driven components that blend seamlessly with modern ShadCN setups.", "short_description": "ScrollX UI is an open-source React and shadcn-compatible component library for animated, interactive, and customizable user interfaces. It offers motion-driven components that blend seamlessly with modern ShadCN setups.", "description": "ScrollX UI is an open-source, motion-rich React component library with 140+ animated, interactive components and 30+ marketing blocks, all in TypeScript + Tailwind CSS format. Components span text animations (electric text, decorated text, fancy text), interactive elements (hold-to-confirm, drag interactions, expandable dock, expandable cards, card tilt, card flip), backgrounds (aurora dots, meteors, grid, cosmic, beam, dot wave), and UI primitives (Globe, Keyboard, Infinite Canvas, Flowing Logos, Avatar Group, Bento Grid). Blocks include Hero Sections, CTA, Pricing, Testimonials, FAQ, Waitlist, Bento, and more. Tailwind v4, React, Framer Motion/Motion. Free (MIT). Use for: building visually expressive marketing pages, SaaS landing pages, or developer portfolios that need modern motion-driven components and marketing section blocks.", "homepage": "https://www.scrollxui.dev", "docs": "https://www.scrollxui.dev/docs", "github": "https://github.com/Adityakishore0/ScrollX-UI", "components_github": "https://github.com/Adityakishore0/ScrollX-UI/tree/main/src/components", "github_default_branch": "main", "github_stars": 294, "last_commit": "2026-06-08T23:45:10Z", "archived": false, "license": null, "open_issues": 0, "registry_template": "https://www.scrollxui.dev/registry/{name}.json", "registry_index": "https://www.scrollxui.dev/registry/registry.json", "components": [ "utils", "accordion", "alert-dialog", "animated-button", "animated-tabs", "animated-testimonials", "animated-textgenerate", "announcement", "aspect-ratio", "avatar", "avatar-group", "aurora-dots", "backgroundmeteors", "background-paths", "badge", "barswave", "beams-upstream", "bento-grid", "bolt-strike", "border-glide", "button", "card", "card-flip", "card-tilt", "carousel", "calendar", "checkbox-pro", "checklist-cell", "clock", "codeblock", "collapsible", "columnlines", "cosmic-background", "cursor-highlight", "cursorimagetrail", "decorated-text", "dot-wave", "draggable-avatar", "drift-card", "dropdown-menu", "dualsparks", "electric-text", "expandable-cards", "expandable-dock", "facescape", "fancy-text", "flashy-card", "flex-navbar", "flipflow", "flipstack", "flowing-logos", "folder", "folder-tree", "followcursor", "glass", "glowingbordercard", "globe", "globe-wireframe", "gravity", "heroui", "hold-toconfirm", "hyperlink", "infinite-canvas", "iphone", "input-otp", "interactive-input", "kbd", "keyboard", "kinetic-testimonials", "label", "lamphome", "layered-button", "layer-stack", "layered-text", "lean-card", "loader", "loginform", "logo-stepper", "lustretext", "magicdock", "media-card", "meteor-orbit", "modern-loader", "movinglines-background", "motioncards", "motion-grid", "motion-navbar", "morphotextflip", "morphy-button", "navbar-flow", "not-found", "orb-button", "pagination", "particles", "parallaxcards", "pixel-background", "pixel-highlight", "popover", "profilecard", "progress" ], "component_items": [ { "name": "utils", "type": "registry:lib", "title": "Utils", "description": null }, { "name": "accordion", "type": "registry:ui", "title": "Accordion", "description": "A collapsible component for showing and hiding content sections." }, { "name": "alert-dialog", "type": "registry:ui", "title": "Alert Dialog", "description": "A modal dialog used to convey critical information and require a user response before proceeding.." }, { "name": "animated-button", "type": "registry:ui", "title": "Animated Button", "description": "AnimatedButton is a highly customizable animated button component with shimmer effects, glow, and visual styling options." }, { "name": "animated-tabs", "type": "registry:ui", "title": "Animated Tabs", "description": "A headless and styled tab UI component set for switching content views." }, { "name": "animated-testimonials", "type": "registry:ui", "title": "Animated Testimonials", "description": "Minimal testimonials with image and quote for clean, modern design." }, { "name": "animated-textgenerate", "type": "registry:ui", "title": "Animated TextGenerate", "description": "Generates animated text word-by-word with blur, highlights, links, and smooth effects." }, { "name": "announcement", "type": "registry:ui", "title": "Announcement", "description": "An announcement component that highlights key info with icons, effects, and expandable content." }, { "name": "aspect-ratio", "type": "registry:ui", "title": "Aspect Ratio", "description": "A responsive container component that maintains a fixed aspect ratio, commonly used for media like images and videos." }, { "name": "avatar", "type": "registry:ui", "title": "Avatar", "description": "Customizable Avatar component with animated borders for status indicators like \"close friends\" or \"normal story\"." }, { "name": "avatar-group", "type": "registry:ui", "title": "Avatar Group", "description": "Overlapping avatar circles that expand smoothly to reveal each user's name on hover." }, { "name": "aurora-dots", "type": "registry:ui", "title": "Aurora Dots", "description": "A captivating background effect featuring softly glowing, animated dots that mimic the ethereal beauty of the aurora borealis." }, { "name": "backgroundmeteors", "type": "registry:ui", "title": "Background Meteors", "description": "animated background featuring vertical meteor-like beams falling from the top to the bottom of the screen over a grid pattern." }, { "name": "background-paths", "type": "registry:ui", "title": "Background Paths", "description": "A set of SVG paths that animate as if being drawn. Great for tech hero backgrounds." }, { "name": "badge", "type": "registry:ui", "title": "Badge", "description": "A small badge component with customizable variants and shiny animation effects." }, { "name": "barswave", "type": "registry:ui", "title": "BarsWave", "description": "Vertical wave bars animate in symmetry, forming a subtle motion-driven background layer." }, { "name": "beams-upstream", "type": "registry:ui", "title": "Beams Upstream", "description": "Multiple background beams travel upstream, forming a hero section background." }, { "name": "bento-grid", "type": "registry:ui", "title": "Bento Grid", "description": "A responsive grid layout for showcasing features in varied card sizes with optional tilt effects." }, { "name": "bolt-strike", "type": "registry:ui", "title": "Bolt Strike", "description": "lightning bolts burst randomly with sparks and particles, creating a high-energy, reactive background effect." }, { "name": "border-glide", "type": "registry:ui", "title": "Border Glide", "description": "Modern UI cards with a moving border and smooth transitions." }, { "name": "button", "type": "registry:ui", "title": "Button", "description": "Reusable button component with multiple variants and sizes." }, { "name": "card", "type": "registry:ui", "title": "Card", "description": "Renders a card component comprising a header, content section, and footer..." }, { "name": "card-flip", "type": "registry:ui", "title": "Card Flip", "description": "Renders a card component with flip animation, supporting front/back content." }, { "name": "card-tilt", "type": "registry:ui", "title": "Card Tilt", "description": "smooth card tilt that responds naturally to your cursor, giving the card a more polished, modern look." }, { "name": "carousel", "type": "registry:ui", "title": "Carousel", "description": "A carousel component with card stack visualization for cycling through content." }, { "name": "calendar", "type": "registry:ui", "title": "Calendar", "description": "A date field component that enables users to choose and edit a date." }, { "name": "checkbox-pro", "type": "registry:ui", "title": "Checkbox Pro", "description": "A customizable checkbox component with animated checkmark and indeterminate states." }, { "name": "checklist-cell", "type": "registry:ui", "title": "Checklist Cell", "description": "Animated checklist illustration with sliding tasks and progressive completion." }, { "name": "clock", "type": "registry:ui", "title": "Clock", "description": "clock component with rotating hands and glowing effects, perfect for CTA sections." }, { "name": "codeblock", "type": "registry:ui", "title": "CodeBlock", "description": "Syntax-highlighted codeblock component built on top of react-syntax-highlighter." }, { "name": "collapsible", "type": "registry:ui", "title": "Collapsible", "description": "An interactive component which expands/collapses a panel with a smooth motion." }, { "name": "columnlines", "type": "registry:ui", "title": "ColumnLines", "description": "column grid background with radial fade and subtle noise. Great for hero backgrounds." }, { "name": "cosmic-background", "type": "registry:ui", "title": "Cosmic Background", "description": "A modern cosmic background featuring smooth motion and immersive depth effects." }, { "name": "cursor-highlight", "type": "registry:ui", "title": "Cursor Highlight", "description": "Text is revealed on scroll with pointer, gradient, and border effects." }, { "name": "cursorimagetrail", "type": "registry:ui", "title": "Cursor ImageTrail", "description": "The CursorImageTrail component creates an interactive mouse trail effect with animated images." }, { "name": "decorated-text", "type": "registry:ui", "title": "Decorated Text", "description": "decorative text frame with corner accents and a compact entrance effect." }, { "name": "dot-wave", "type": "registry:ui", "title": "Dot Wave", "description": "Dot-based waves ripple outward in symmetry, creating a subtle, motion-driven background layer" }, { "name": "draggable-avatar", "type": "registry:ui", "title": "Draggable Avatar", "description": "It displays a circular, draggable avatar with customizable size and style." }, { "name": "drift-card", "type": "registry:ui", "title": "Drift Card", "description": "An interactive card with a drift hover effect that visually highlights content." }, { "name": "dropdown-menu", "type": "registry:ui", "title": "Dropdown Menu", "description": "Animated Dropdown Menu Reveals a menu of options or actions when activated by a button." }, { "name": "dualsparks", "type": "registry:ui", "title": "Dual Sparks", "description": "Corner-based spark waves that radiate inward and outward with smooth motion." }, { "name": "electric-text", "type": "registry:ui", "title": "Electric Text", "description": "Animated electric text with glowing, distorted outline-solid for dynamic neon effects." }, { "name": "expandable-cards", "type": "registry:ui", "title": "Expandable Cards", "description": "Interactive card layout where hovered cards expand smoothly for focused content viewing." }, { "name": "expandable-dock", "type": "registry:ui", "title": "Expandable Dock", "description": "A customizable expandable dock component." }, { "name": "facescape", "type": "registry:ui", "title": "Facescape", "description": "Interactive, animated user avatars with hover effects and responsive layout." }, { "name": "fancy-text", "type": "registry:ui", "title": "Fancy Text", "description": "A refined text reveal animation with smooth character motion and a clean, modern visual flow." }, { "name": "flashy-card", "type": "registry:ui", "title": "Flashy Card", "description": "Interactive card with smooth animated activation and visual effects." }, { "name": "flex-navbar", "type": "registry:ui", "title": "Flex Navbar", "description": "A modern navbar with smooth expansion, media panels, and theme controls." }, { "name": "flipflow", "type": "registry:ui", "title": "FlipFlow", "description": "A looping flow of flip cards with smooth motion and subtle interactive effects." }, { "name": "flipstack", "type": "registry:ui", "title": "FlipStack", "description": "A stylish and animated card stack UI for showcasing content in layered views." }, { "name": "flowing-logos", "type": "registry:ui", "title": "Flowing Logos", "description": "Flowing logo showcase with smooth animations, hover effects, and modern UI." }, { "name": "folder", "type": "registry:ui", "title": "Folder", "description": "Interactive 3D Folder UI component with hover & click animations for modern apps." }, { "name": "folder-tree", "type": "registry:ui", "title": "Folder Tree", "description": "A customizable folder tree component for displaying hierarchical data with expandable nodes." }, { "name": "followcursor", "type": "registry:ui", "title": "Follow Cursor", "description": "Colorful, fluid cursor trails that respond to mouse movement." }, { "name": "glass", "type": "registry:ui", "title": "Glass", "description": "glass surface with interactive ripple and dynamic cursor effects." }, { "name": "glowingbordercard", "type": "registry:ui", "title": "Glowing Border Card", "description": "A customizable card with a glowing border effect that changes colors based on light and dark modes." }, { "name": "globe", "type": "registry:ui", "title": "Globe", "description": "The Globe component creates beautiful 5kb WebGL Globe." }, { "name": "globe-wireframe", "type": "registry:ui", "title": "Globe Wireframe", "description": "The Globe Wireframe component creates beautiful globe with smooth city rotations, responsive design, and premium motion." }, { "name": "gravity", "type": "registry:ui", "title": "Gravity", "description": "Gravity pulls objects as they launch, soar, and fall inside a container." }, { "name": "heroui", "type": "registry:ui", "title": "Hero Sections", "description": "A set of hero sections ranging from simple to complex layouts." } ], "component_count": 180, "components_truncated": true, "component_types": { "registry:lib": 1, "registry:ui": 145, "registry:block": 34 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 145, "name": "@shadcn-editor", "category": "Editor (rich text/code)", "tags": [ "components" ], "tagline": "Accessible, Customizable, Rich Text Editor. Made with Lexical and Shadcn/UI. Open Source. Open Code.", "short_description": "Accessible, Customizable, Rich Text Editor. Made with Lexical and Shadcn/UI. Open Source. Open Code.", "description": "shadcn-editor is an accessible, open-source rich-text editor built on Facebook's Lexical framework and styled with shadcn/ui. It ships as a single registry item (editor-x) containing an extensive plugin set: CodeHighlight, AutoLink, ClickableLink, CheckList, List, OverflowNode, DraggableBlock, FloatingLinkEditor, FloatingTextFormatToolbar, ComponentPickerMenu, ContextMenu, EmojiPicker, Mentions, Layout (multi-column), Markdown shortcuts, speech-to-text, import/export, and embedded media (Twitter/YouTube). Nodes include TweetNode, YouTubeNode, EmojiNode, MentionNode, LayoutContainerNode. Fully copy-owned. Free and open-source. Use for: embedding a Lexical-powered document editor with mentions, embeds, code blocks, and markdown support into a Next.js + shadcn/ui app.", "homepage": "https://shadcn-editor.vercel.app", "docs": "https://shadcn-editor.vercel.app", "github": "https://github.com/htmujahid/shadcn-editor", "components_github": "https://github.com/htmujahid/shadcn-editor/tree/main/src/components", "github_default_branch": "main", "github_stars": 1355, "last_commit": "2026-06-05T15:38:07Z", "archived": false, "license": null, "open_issues": 1, "registry_template": "https://raw.githubusercontent.com/htmujahid/shadcn-editor/refs/heads/main/public/r/{name}.json", "registry_index": "https://raw.githubusercontent.com/htmujahid/shadcn-editor/refs/heads/main/public/r/registry.json", "components": [ "editor-x" ], "component_items": [ { "name": "editor-x", "type": "registry:block", "title": "Editor X", "description": "A rich text editor built on Lexical with plugins, nodes, extensions, and toolbar support." } ], "component_count": 1, "components_truncated": false, "component_types": { "registry:block": 1 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 146, "name": "@shadcn-map", "category": "Maps", "tags": [ "dashboard" ], "tagline": "A map component for shadcn/ui. Built with Leaflet and React Leaflet.", "short_description": "A map component for shadcn/ui. Built with Leaflet and React Leaflet.", "description": "shadcn-map is a single-component shadcn registry item providing a Leaflet-powered interactive map component styled to integrate with shadcn/ui's design system. Built with React Leaflet and Leaflet, it wraps map rendering in a shadcn-compatible component API. Very focused in scope — one map component with docs. Free and open-source (MIT). Use for: dropping an interactive Leaflet map into a shadcn/ui project without custom Leaflet setup, particularly when you need a lightweight alternative to Google Maps or Mapbox for location display in dashboards or forms.", "homepage": "https://shadcn-map.vercel.app", "docs": "https://shadcn-map.vercel.app/docs", "github": "https://github.com/tonghohin/shadcn-map", "components_github": "https://github.com/tonghohin/shadcn-map/tree/main/registry", "github_default_branch": "main", "github_stars": 328, "last_commit": "2026-05-20T03:03:54Z", "archived": false, "license": "MIT", "open_issues": 1, "registry_template": "http://shadcn-map.vercel.app/r/{name}.json", "registry_index": "http://shadcn-map.vercel.app/r/registry.json", "components": [ "map", "basic-map", "map-with-custom-tiles", "map-with-markers", "map-with-marker-cluster-group", "map-with-custom-marker-cluster-group", "map-with-custom-markers", "map-with-circle", "map-with-circle-marker", "map-with-polyline", "map-with-polygon", "map-with-rectangle", "map-with-styled-shapes", "map-with-popups-and-tooltips", "map-with-zoom-control", "map-with-layers-control", "map-with-tile-layers-control", "map-with-layer-groups-control", "map-with-feature-groups-control", "map-with-locate-control", "map-with-locate-control-callbacks", "map-with-custom-control-position", "map-with-complex-custom-control-position", "map-with-draw-control", "map-with-draw-control-callback", "map-with-draw-control-specific-shapes", "map-with-search-control", "map-with-search-control-place-select", "map-with-search-control-results-change", "map-with-search-control-configurations", "map-with-custom-control-container", "map-with-fullscreen-control" ], "component_items": [ { "name": "map", "type": "registry:ui", "title": "Map", "description": "A map component." }, { "name": "basic-map", "type": "registry:example", "title": null, "description": null }, { "name": "map-with-custom-tiles", "type": "registry:example", "title": null, "description": null }, { "name": "map-with-markers", "type": "registry:example", "title": null, "description": null }, { "name": "map-with-marker-cluster-group", "type": "registry:example", "title": null, "description": null }, { "name": "map-with-custom-marker-cluster-group", "type": "registry:example", "title": null, "description": null }, { "name": "map-with-custom-markers", "type": "registry:example", "title": null, "description": null }, { "name": "map-with-circle", "type": "registry:example", "title": null, "description": null }, { "name": "map-with-circle-marker", "type": "registry:example", "title": null, "description": null }, { "name": "map-with-polyline", "type": "registry:example", "title": null, "description": null }, { "name": "map-with-polygon", "type": "registry:example", "title": null, "description": null }, { "name": "map-with-rectangle", "type": "registry:example", "title": null, "description": null }, { "name": "map-with-styled-shapes", "type": "registry:example", "title": null, "description": null }, { "name": "map-with-popups-and-tooltips", "type": "registry:example", "title": null, "description": null }, { "name": "map-with-zoom-control", "type": "registry:example", "title": null, "description": null }, { "name": "map-with-layers-control", "type": "registry:example", "title": null, "description": null }, { "name": "map-with-tile-layers-control", "type": "registry:example", "title": null, "description": null }, { "name": "map-with-layer-groups-control", "type": "registry:example", "title": null, "description": null }, { "name": "map-with-feature-groups-control", "type": "registry:example", "title": null, "description": null }, { "name": "map-with-locate-control", "type": "registry:example", "title": null, "description": null }, { "name": "map-with-locate-control-callbacks", "type": "registry:example", "title": null, "description": null }, { "name": "map-with-custom-control-position", "type": "registry:example", "title": null, "description": null }, { "name": "map-with-complex-custom-control-position", "type": "registry:example", "title": null, "description": null }, { "name": "map-with-draw-control", "type": "registry:example", "title": null, "description": null }, { "name": "map-with-draw-control-callback", "type": "registry:example", "title": null, "description": null }, { "name": "map-with-draw-control-specific-shapes", "type": "registry:example", "title": null, "description": null }, { "name": "map-with-search-control", "type": "registry:example", "title": null, "description": null }, { "name": "map-with-search-control-place-select", "type": "registry:example", "title": null, "description": null }, { "name": "map-with-search-control-results-change", "type": "registry:example", "title": null, "description": null }, { "name": "map-with-search-control-configurations", "type": "registry:example", "title": null, "description": null }, { "name": "map-with-custom-control-container", "type": "registry:example", "title": null, "description": null }, { "name": "map-with-fullscreen-control", "type": "registry:example", "title": null, "description": null } ], "component_count": 32, "components_truncated": false, "component_types": { "registry:ui": 1, "registry:example": 31 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 147, "name": "@shadcn-space", "category": "Blocks & sections (marketing/SaaS)", "tags": [ "saas", "dashboard" ], "tagline": "ShadcnSpace is a collection of extra-ordinary, highly customizable shadcn/ui components, blocks, and themes to build modern UIs with speed and clarity.", "short_description": "ShadcnSpace is a collection of extra-ordinary, highly customizable shadcn/ui components, blocks, and themes to build modern UIs with speed and clarity.", "description": "Shadcn Space is an open-source UI system (588+ registry items) built on Base UI primitives for modern React apps. The registry is heavily block-oriented: 27+ hero section variants, 24 feature sections, 23 product sections, 18 statistics/widget sections, 15 pricing and CTA blocks, 14 testimonial blocks, 13 about sections, plus chart, navbar, table, dialog, blog, and textarea components. Also includes Dashboard layouts/UI Kits and landing page templates. Built with shadcn/ui, Base UI, Tailwind CSS. Free core (MIT). A paid All Access Pass exists. Use for: bootstrapping SaaS landing pages, marketing sites, or admin dashboards by composing ready-made hero/feature/pricing/testimonial sections quickly without building from scratch.", "homepage": "https://shadcnspace.com", "docs": "https://shadcnspace.com/docs/getting-started/introduction", "github": "https://github.com/shadcnspace/shadcnspace", "components_github": "https://github.com/shadcnspace/shadcnspace/tree/main/src/components", "github_default_branch": "main", "github_stars": 635, "last_commit": "2026-06-30T06:19:11Z", "archived": false, "license": "MIT", "open_issues": 1, "registry_template": "https://shadcnspace.com/r/{name}.json", "registry_index": "https://shadcnspace.com/r/registry.json", "components": [ "hero-01", "hero-02", "hero-03", "hero-04", "hero-05", "hero-06", "hero-07", "hero-08", "hero-09", "hero-10", "hero-11", "hero-12", "hero-13", "hero-14", "hero-15", "hero-16", "hero-17", "hero-18", "hero-19", "hero-20", "hero-21", "hero-22", "hero-23", "hero-24", "hero-25", "hero-26", "hero-27", "integration-01", "integration-02", "integration-03", "integration-04", "pricing-01", "pricing-02", "pricing-03", "pricing-04", "pricing-05", "pricing-06", "pricing-07", "pricing-08", "pricing-09", "pricing-10", "pricing-11", "pricing-12", "pricing-13", "pricing-14", "pricing-15", "bio-link-01", "bio-link-02", "bio-link-03", "bio-link-04", "testimonial-01", "testimonial-02", "testimonial-03", "testimonial-04", "testimonial-05", "testimonial-06", "testimonial-07", "testimonial-08", "testimonial-09", "testimonial-10", "testimonial-11", "testimonial-12", "testimonial-13", "testimonial-14", "feature-01", "feature-02", "feature-03", "feature-04", "feature-05", "feature-06", "feature-07", "feature-08", "feature-09", "feature-10", "feature-11", "feature-12", "feature-13", "feature-14", "feature-15", "feature-16", "feature-17", "feature-18", "feature-19", "feature-20", "feature-21", "feature-22", "feature-23", "feature-24", "about-us-section-01", "about-us-section-02", "about-us-section-03", "about-us-section-04", "about-us-section-05", "about-us-section-06", "about-us-section-07", "about-us-section-08", "about-us-section-09", "about-us-section-10", "about-us-section-11", "about-us-section-12" ], "component_items": [ { "name": "hero-01", "type": "registry:block", "title": "Hero 01 - Agency Hero Section", "description": "Clean agency hero section designed for SaaS and startup websites, featuring bold headline, gradient background, trust badges, client logos, and high converting…" }, { "name": "hero-02", "type": "registry:block", "title": "Hero 02 - Real Estate Hero Section", "description": "Luxury real estate hero section crafted for property listings, featuring immersive imagery, location highlight, key amenities, pricing details, and prominent S…" }, { "name": "hero-03", "type": "registry:block", "title": "Hero 03 - Digital Agency Hero Section", "description": "High-impact digital agency hero section with cinematic background video, bold typography, brand driven headline, and clear CTA, perfect for creative studios an…" }, { "name": "hero-04", "type": "registry:block", "title": "Hero 04 - Portfolio Hero Section", "description": "Modern portfolio hero section built for designers and developers, featuring bold typography, availability badge, clear CTAs, and responsive layout, perfect for…" }, { "name": "hero-05", "type": "registry:block", "title": "Hero 05 - Crypto Hero Section", "description": "Modern crypto exchange hero section designed for fintech startups, featuring dark UI, beautiful graphic, trust signals, and conversion focused CTAs for secure …" }, { "name": "hero-06", "type": "registry:block", "title": "Hero 06 - Personal Portfolio Hero Section", "description": "Personal portfolio hero section built for designers and developers, featuring availability badge, intro headline, social links, project CTA, and client logos t…" }, { "name": "hero-07", "type": "registry:block", "title": "Hero 07 - SaaS Hero Section", "description": "A bold, conversion-focused hero section designed for SaaS products, featuring a strong headline, announcement badge, supporting copy, dual CTAs, and a product …" }, { "name": "hero-08", "type": "registry:block", "title": "Hero 08 - Education Hero Section", "description": "A modern hero section crafted for education platforms, featuring a powerful headline, trust badge, clear CTAs, and instructor-led course previews to inspire le…" }, { "name": "hero-09", "type": "registry:block", "title": "Hero 09 - Cleaning Services Hero Section", "description": "A conversion-focused hero section designed for service businesses, featuring trust indicators, bold messaging, strong CTAs, and lifestyle imagery to instantly …" }, { "name": "hero-10", "type": "registry:block", "title": "Hero 10 - Engineering Courses Hero Section", "description": "A modern education-focused hero section built to showcase technical courses, highlight learner trust, display ratings, and guide users toward personalized lear…" }, { "name": "hero-11", "type": "registry:block", "title": "Hero 11 - AI Analytics Hero Section", "description": "A bold, dark-themed hero section designed for AI and analytics platforms, highlighting real-time insights, smart decision-making, and driving engagement with s…" }, { "name": "hero-12", "type": "registry:block", "title": "Hero 12 - SaaS Agency Hero Section", "description": "A modern, high-impact hero section tailored for SaaS agencies to showcase expertise, promote services, and drive conversions with strong messaging, clear CTAs,…" }, { "name": "hero-13", "type": "registry:block", "title": "Hero 13 - Creative Studio Hero", "description": "A striking hero section designed to capture attention instantly—combining bold messaging, immersive visuals, and clear calls-to-action to position your studio …" }, { "name": "hero-14", "type": "registry:block", "title": "Hero 14 - Health & Medical Hero Section", "description": "A dynamic hero section featuring a background video that captures attention instantly, communicates your brand story with impact, and guides visitors toward me…" }, { "name": "hero-15", "type": "registry:block", "title": "Hero 15 - AI Startup Hero Section", "description": "A bold, dark-themed hero section designed to highlight trusted real agents, strategic partnerships, and clear calls-to-action that guide organizations toward c…" }, { "name": "hero-16", "type": "registry:block", "title": "Hero 16 - Modern AI Business Hero Section", "description": "A professional hero section crafted for enterprise AI businesses, featuring scalable solutions, real-time intelligence, and clear calls-to-action that inspire …" }, { "name": "hero-17", "type": "registry:block", "title": "Hero 17 - Consulting Hero Section", "description": "A modern, high-impact hero section showcasing business expertise, growth metrics, and collaborative visuals to build credibility and drive meaningful client en…" }, { "name": "hero-18", "type": "registry:block", "title": "Hero 18 - AI SaaS Product Hero Section", "description": "A modern SaaS hero section highlighting AI-driven product capabilities with clear messaging, primary actions, feature navigation, and product preview—designed …" }, { "name": "hero-19", "type": "registry:block", "title": "Hero 19 - Developer Portfolio Hero Section", "description": "A personal portfolio hero section introducing the developer with a strong headline, profile visual, key achievements, and call-to-action—designed to showcase e…" }, { "name": "hero-20", "type": "registry:block", "title": "Hero 20 - SaaS Dashboard Hero Section", "description": "A modern SaaS hero section showcasing an intuitive dashboard, highlighting real-time analytics, key metrics, and actionable insights to simplify decisions and …" }, { "name": "hero-21", "type": "registry:block", "title": "Hero 21 - Product Showcase Hero Section", "description": "A modern hero section highlighting key features, real user feedback, and intuitive design—crafted to position your product and increase conversions." }, { "name": "hero-22", "type": "registry:block", "title": "Hero 22 - Creator Growth Hero Section", "description": "A modern hero section designed for creator platforms, featuring strong social proof, engaging user visuals, and clear messaging to highlight growth tools and d…" }, { "name": "hero-23", "type": "registry:block", "title": "Hero 23 - AI Coding Model Hero section", "description": "A clean hero section highlighting AI-powered coding tools, workflow automation, and real-time dashboards, designed to help developers build faster and scale wi…" }, { "name": "hero-24", "type": "registry:block", "title": "Hero 24 - Workspace Hero Section", "description": "A clean dashboard hero section featuring a centralized workspace, live analytics, and workflow management tools, designed to help teams stay organized and work…" }, { "name": "hero-25", "type": "registry:block", "title": "Hero 25 - SaaS Product Hero Section", "description": "A modern SaaS hero section combining bold messaging, product positioning, trust indicators, and key metrics, designed to quickly communicate value and guide us…" }, { "name": "hero-26", "type": "registry:block", "title": "Hero 26 - Creative Agency Hero Section", "description": "A minimal hero section combining expressive visuals, clean layouts, and focused messaging—crafted to showcase creativity, build brand presence, and capture att…" }, { "name": "hero-27", "type": "registry:block", "title": "Hero 27 - AI Platform Hero Section", "description": "A modern SaaS hero section combining bold messaging, product positioning, trust indicators, and key metrics, designed to quickly communicate value and guide us…" }, { "name": "integration-01", "type": "registry:block", "title": "Integration 01 - Unified Integrations", "description": "Seamlessly connect your favorite tools and APIs to automate workflows, centralize data, and enhance productivity — giving developers the flexibility to build f…" }, { "name": "integration-02", "type": "registry:block", "title": "Integration 02 - Smart Integrations", "description": "Easily integrate with popular tools your team already uses to streamline workflows, reduce manual effort, and create a connected ecosystem that improves collab…" }, { "name": "integration-03", "type": "registry:block", "title": "Integration 03 - Advanced Integrations", "description": "Connect powerful tools into one intelligent ecosystem to automate workflows, simplify operations, and help teams work smarter with scalable integrations built …" }, { "name": "integration-04", "type": "registry:block", "title": "Integration 04 - Enterprise Integrations", "description": "Securely connect your entire technology stack with enterprise-grade integrations that enhance data flow, improve reliability, and give teams the flexibility to…" }, { "name": "pricing-01", "type": "registry:block", "title": "Pricing 01 - Startup Pricing Plans", "description": "A clean two tier pricing section with feature comparison, highlighted plans, and strong CTAs, suited for agencies, Startups & SaaS to convert visitors by clear…" }, { "name": "pricing-02", "type": "registry:block", "title": "Pricing 02 - Scalable Pricing Table", "description": "A three tier pricing layout with a highlighted recommended plan, feature checklists, and clear CTAs, perfect for any website having pricing section to guide us…" }, { "name": "pricing-03", "type": "registry:block", "title": "Pricing 03 - Simple Subscription Pricing", "description": "A modern pricing section with monthly vs yearly toggle, three plan cards, feature lists, and conversion focused CTAs, ideal for SaaS, courses, or membership pl…" }, { "name": "pricing-04", "type": "registry:block", "title": "Pricing 04 - Highlighted Plan Pricing", "description": "A visually rich pricing section with promotional banner, monthly vs yearly toggle, and recommended plan badge, designed to boost conversions by emphasizing sav…" }, { "name": "pricing-05", "type": "registry:block", "title": "Pricing 05 - Flexible Pricing Plans", "description": "Present clear, scalable pricing tiers designed to support businesses at every stage—helping users compare features, understand value quickly, and choose the pl…" }, { "name": "pricing-06", "type": "registry:block", "title": "Pricing 06 - Simple & Transparent Service Pricing", "description": "Showcase clearly structured cleaning packages with upfront pricing, helping customers quickly compare options, understand what’s included, and confidently book…" }, { "name": "pricing-07", "type": "registry:block", "title": "Pricing 07 - Business Plan Pricing", "description": "A clean pricing layout showcasing multiple subscription tiers, feature comparisons, and clear plan benefits designed to support startups, founders, and growing…" }, { "name": "pricing-08", "type": "registry:block", "title": "Pricing 08 - Modern SaaS Pricing", "description": "A clean pricing section with three plans, a highlighted recommendation, billing toggle, and clear CTAs to guide plan selection" }, { "name": "pricing-09", "type": "registry:block", "title": "Pricing 09 - Personalized Pricing Plans", "description": "A modern pricing section with flexible subscription tiers, a highlighted popular plan, feature lists, and strong CTAs designed to help users choose quickly." }, { "name": "pricing-10", "type": "registry:block", "title": "Pricing 10 - Three-Tiered Pricing Plans", "description": "A simple and scalable pricing section with three plans, feature checklists, and clear CTAs, making it easy for users to understand and decide." }, { "name": "pricing-11", "type": "registry:block", "title": "Pricing 11 - Add-Ons Pricing Section", "description": "A modern add-ons pricing section showcasing flexible upgrade options, feature highlights, and clear pricing tiers, designed to enhance workflows and drive conv…" }, { "name": "pricing-12", "type": "registry:block", "title": "Pricing 12 - Simple Tech Upgrade Plans", "description": "A modern two-tier pricing section with billing toggle, feature highlights, and clear CTAs, designed to encourage upgrades and simplify decision making." }, { "name": "pricing-13", "type": "registry:block", "title": "Pricing 13 - Tabular Pricing Layout", "description": "A detailed tabular layout with multiple plans, feature availability, and highlighted option, built to simplify decision making and improve conversions." }, { "name": "pricing-14", "type": "registry:block", "title": "Pricing 14 - Single Plan Pricing", "description": "A clean single plan pricing card with feature highlights, billing toggle, and strong CTA, designed to focus attention and drive quick decisions." }, { "name": "pricing-15", "type": "registry:block", "title": "Pricing 15 - Choose and Compare Pricing", "description": "A modern pricing interface with plan options and side feature panel, designed to improve clarity, comparison, and overall user decision making." }, { "name": "bio-link-01", "type": "registry:block", "title": "Bio Link 01 - Founder Bio Link", "description": "A clean founder-focused bio links layout with profile image, quick access buttons, social links, and CTA section, perfect for showcasing products and updates." }, { "name": "bio-link-02", "type": "registry:block", "title": "Bio Link 02 - Speaker Bio Link", "description": "A sleek speaker bio page with session booking, social links, featured video, and event schedule, designed to boost visibility, credibility, and audience connec…" }, { "name": "bio-link-03", "type": "registry:block", "title": "Bio Link 03 - Fitness Link Hub", "description": "A clean fitness bio link page with quick actions, social links, workout categories, and video content, designed to inspire daily movement and healthy routines." }, { "name": "bio-link-04", "type": "registry:block", "title": "Bio Link 04 - Portfolio Bio Link", "description": "A modern creator portfolio link hub featuring profile info, social presence, product cards, and highlights, perfect for showcasing work, tools, and personal br…" }, { "name": "testimonial-01", "type": "registry:block", "title": "Testimonial 01 - Bento Grid Testimonials", "description": "A multi card testimonial section combining customer quotes, imagery, and performance stats, ideal for showcasing social proof, building trust, and reinforcing …" }, { "name": "testimonial-02", "type": "registry:block", "title": "Testimonial 02 - Testimonial Slider Showcase", "description": "A clean testimonial slider with customer photo, detailed quote, navigation controls, and partner logos—perfect for highlighting success stories and building in…" }, { "name": "testimonial-03", "type": "registry:block", "title": "Testimonial 03 - Text and Video Testimonials", "description": "Highlight authentic client experiences through impactful testimonials that build credibility, demonstrate real results, and help potential customers feel confi…" }, { "name": "testimonial-04", "type": "registry:block", "title": "Testimonial 04 - Client Success Stories", "description": "Showcase measurable outcomes and real client feedback to demonstrate impact, build trust, and highlight how your platform drives smarter decisions, stronger co…" }, { "name": "testimonial-05", "type": "registry:block", "title": "Testimonial 05 - Modern Grid Testimonials", "description": "Build credibility with authentic testimonials from respected clients, highlighting real results, seamless collaboration, and the value your platform delivers t…" }, { "name": "testimonial-06", "type": "registry:block", "title": "Testimonial 06 - Clean & Modern Testimonials", "description": "Showcase genuine customer experiences that highlight measurable success, improved workflows, and stronger collaboration—helping prospects build trust in your p…" }, { "name": "testimonial-07", "type": "registry:block", "title": "Testimonial 07 - Multi Platform Testimonials", "description": "Highlight authentic customer feedback that reflects real success, seamless adoption, and measurable growth—helping visitors quickly understand the value your p…" }, { "name": "testimonial-08", "type": "registry:block", "title": "Testimonial 08 - Customer Story Testimonials", "description": "A professional testimonial experience designed to showcase authentic customer feedback, highlight success stories, and reinforce the real-world value of your p…" }, { "name": "testimonial-09", "type": "registry:block", "title": "Testimonial 09 - Quote & Stats Testimonials", "description": "A modern testimonial layout combining real customer feedback with performance statistics, helping highlight proven outcomes, strengthen credibility, and build …" }, { "name": "testimonial-10", "type": "registry:block", "title": "Testimonial 10 - Split Layout Testimonials", "description": "A testimonial section featuring trusted company logos and authentic client quotes, helping reinforce credibility and demonstrate real results from satisfied cu…" } ], "component_count": 736, "components_truncated": true, "component_types": { "registry:block": 352, "registry:component": 359, "registry:page": 25 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 148, "name": "@shadcn-studio", "category": "Component library (general)", "tags": [ "saas", "dashboard", "aesthetic", "components" ], "tagline": "An open-source set of shadcn/ui components, blocks, and templates with a powerful theme generator.", "short_description": "An open-source set of shadcn/ui components, blocks, and templates with a powerful theme generator.", "description": "Open-source shadcn/ui distribution backed by ThemeSelection offering components, blocks, templates, and a theme generator, with support for both Radix UI and Base UI primitives. Covers components (variants of Accordion, Button, Badge, Card, Input, etc.), marketing/landing blocks, 20+ free and premium templates (dashboards, landing pages), a Figma UI kit, Figma-to-code plugin, and a shadcn/studio MCP server. Built on React, Tailwind CSS, and Motion for animated variants. Free tier available; premium templates require purchase. Use for: bootstrapping React/Next.js projects that need both polished UI components and pre-built page sections under a single registry.", "homepage": "https://shadcnstudio.com", "docs": "https://shadcnstudio.com/docs/getting-started/introduction", "github": "https://github.com/shadcnstudio/shadcn-studio", "components_github": "https://github.com/shadcnstudio/shadcn-studio/tree/main/src/components", "github_default_branch": "main", "github_stars": 1682, "last_commit": "2026-02-16T05:48:49Z", "archived": false, "license": null, "open_issues": 7, "registry_template": "https://shadcnstudio.com/r/{style}/{name}.json", "registry_index": null, "components": [], "component_items": [], "component_count": null, "components_truncated": false, "component_types": {}, "has_logo": true, "enrichment_errors": [ "registry_index_unresolved" ], "featured": true }, { "number": 170, "name": "@shadcn-ui-blocks", "category": "Uncategorized", "tags": [], "tagline": "Shadcn blocks across standard collections and handcrafted premium collections, plus a beautiful templates. Start free, then unlock more with Pro.", "short_description": "", "description": "Shadcn blocks across standard collections and handcrafted premium collections, plus a beautiful templates. Start free, then unlock more with Pro.", "homepage": "https://www.shadcn-ui-blocks.com", "docs": "https://www.shadcn-ui-blocks.com/docs/getting-started", "github": null, "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://www.shadcn-ui-blocks.com/r/{name}.json", "registry_index": "https://www.shadcn-ui-blocks.com/r/registry.json", "components": [ "application-pro-accessibility-a11y-checklist-panel", "application-pro-accessibility-a11y-issue-trends", "application-pro-accessibility-a11y-preferences-panel", "application-pro-accessibility-assistive-tech-matrix", "application-pro-accessibility-contrast-checker-card", "application-pro-accessibility-focus-order-inspector", "application-pro-accessibility-heading-outline-tree", "application-pro-accessibility-keyboard-nav-guide", "application-pro-accessibility-live-region-log", "application-pro-accessibility-media-captions-audit", "application-pro-accessibility-screen-reader-labels-table", "application-pro-accessibility-touch-target-audit", "application-pro-activity-activity-calendar", "application-pro-activity-activity-heatmap", "application-pro-activity-approvals-queue", "application-pro-activity-audit-export-card", "application-pro-activity-audit-trail-timeline", "application-pro-activity-changelog-feed", "application-pro-activity-comment-mentions-list", "application-pro-activity-comment-thread-panel", "application-pro-activity-deploy-activity-feed", "application-pro-activity-edit-history-diff", "application-pro-activity-filtered-activity-log", "application-pro-activity-inactivity-watch-card", "application-pro-activity-live-presence-bar", "application-pro-activity-member-activity-panel", "application-pro-activity-mention-feed", "application-pro-activity-pinned-updates-card", "application-pro-activity-reaction-activity-feed", "application-pro-activity-status-change-log", "application-pro-activity-team-activity-feed", "application-pro-activity-team-pulse-card", "application-pro-activity-version-history-list", "application-pro-activity-who-did-what-table", "application-pro-admin-moderation-audit-search-panel", "application-pro-admin-moderation-automation-rules-panel", "application-pro-admin-moderation-ban-appeal-panel", "application-pro-admin-moderation-content-flags-table", "application-pro-admin-moderation-escalation-path-panel", "application-pro-admin-moderation-feature-toggle-admin", "application-pro-admin-moderation-ip-blocklist-manager", "application-pro-admin-moderation-moderation-queue", "application-pro-admin-moderation-moderator-performance-board", "application-pro-admin-moderation-queue-health-panel", "application-pro-admin-moderation-report-review-card", "application-pro-admin-moderation-role-permissions-matrix", "application-pro-admin-moderation-user-admin-table", "application-pro-ai-assistant-action-approval-card", "application-pro-ai-assistant-agent-run-trace", "application-pro-ai-assistant-ai-usage-card", "application-pro-ai-assistant-assistant-chat-panel", "application-pro-ai-assistant-assistant-empty-state", "application-pro-ai-assistant-citations-panel", "application-pro-ai-assistant-context-sources-panel", "application-pro-ai-assistant-conversation-history-list", "application-pro-ai-assistant-feedback-thumbs-row", "application-pro-ai-assistant-inline-suggestion-card", "application-pro-ai-assistant-model-picker-card", "application-pro-ai-assistant-prompt-composer", "application-pro-ai-assistant-prompt-library-grid", "application-pro-ai-assistant-thread-summary-card", "application-pro-app-shells-bottom-panel-shell", "application-pro-app-shells-breadcrumb-header-shell", "application-pro-app-shells-centered-content-shell", "application-pro-app-shells-collapsible-sidebar-shell", "application-pro-app-shells-command-bar-shell", "application-pro-app-shells-dashboard-home-shell", "application-pro-app-shells-document-tabs-shell", "application-pro-app-shells-dual-sidebar-shell", "application-pro-app-shells-env-banner-shell", "application-pro-app-shells-focus-mode-shell", "application-pro-app-shells-full-bleed-shell", "application-pro-app-shells-icon-sidebar-shell", "application-pro-app-shells-inbox-shell", "application-pro-app-shells-nested-nav-sidebar-shell", "application-pro-app-shells-right-rail-shell", "application-pro-app-shells-settings-shell", "application-pro-app-shells-sidebar-shell", "application-pro-app-shells-split-content-shell", "application-pro-app-shells-sticky-toolbar-shell", "application-pro-app-shells-tabbed-page-shell", "application-pro-app-shells-topbar-shell", "application-pro-app-shells-two-pane-shell", "application-pro-app-shells-wizard-shell", "application-pro-auth-pages-accept-invite-page", "application-pro-auth-pages-account-recovery-page", "application-pro-auth-pages-backup-codes-page", "application-pro-auth-pages-deactivated-account-page", "application-pro-auth-pages-device-approval-page", "application-pro-auth-pages-email-changed-confirm", "application-pro-auth-pages-forgot-password-page", "application-pro-auth-pages-join-workspace-page", "application-pro-auth-pages-locked-account-page", "application-pro-auth-pages-magic-link-page", "application-pro-auth-pages-oauth-callback-page", "application-pro-auth-pages-oauth-consent-page", "application-pro-auth-pages-passkey-setup-page", "application-pro-auth-pages-reset-password-page", "application-pro-auth-pages-session-expired-page", "application-pro-auth-pages-sign-in-page" ], "component_items": [ { "name": "application-pro-accessibility-a11y-checklist-panel", "type": "registry:block", "title": "A11y Checklist Panel", "description": "WCAG 2.1 audit checklist with pass, fail, and manual badges per criterion, an overall score, and per-row links to the W3C understanding docs." }, { "name": "application-pro-accessibility-a11y-issue-trends", "type": "registry:block", "title": "A11y Issue Trends", "description": "Stacked bar chart card tracking open accessibility issues by severity across six release audits with a headline count and remediation note." }, { "name": "application-pro-accessibility-a11y-preferences-panel", "type": "registry:block", "title": "A11y Preferences Panel", "description": "Accessibility settings panel with a text size selector, live sample line, and grouped vision, motion, and screen reader switches with helper text." }, { "name": "application-pro-accessibility-assistive-tech-matrix", "type": "registry:block", "title": "Assistive Tech Matrix", "description": "Screen reader support matrix crossing core app flows with four assistive tech pairings, labeled status cells, and an open findings list." }, { "name": "application-pro-accessibility-contrast-checker-card", "type": "registry:block", "title": "Contrast Checker Card", "description": "Theme token contrast audit card showing computed ratios and AA and AAA pass badges for normal and large text across four Acme token pairings." }, { "name": "application-pro-accessibility-focus-order-inspector", "type": "registry:block", "title": "Focus Order Inspector", "description": "Split audit view pairing a dialog blueprint with numbered focus markers beside a stop list showing selectors, roles, and flagged order issues." }, { "name": "application-pro-accessibility-heading-outline-tree", "type": "registry:block", "title": "Heading Outline Tree", "description": "Indented document heading tree with landmark chips, level tags, and issue badges for skipped levels, empty headings, and a duplicate H1." }, { "name": "application-pro-accessibility-keyboard-nav-guide", "type": "registry:block", "title": "Keyboard Nav Guide", "description": "Keyboard shortcut reference table covering global browser keys and Acme app shortcuts rendered with Kbd components, action descriptions, and context labels." }, { "name": "application-pro-accessibility-live-region-log", "type": "registry:block", "title": "Live Region Log", "description": "ARIA live region event log with timestamps, politeness badges, source selectors, and flags for duplicate, chatty, and empty announcements." }, { "name": "application-pro-accessibility-media-captions-audit", "type": "registry:block", "title": "Media Captions Audit", "description": "Media library audit pairing coverage tiles and progress bars with a per asset table of caption, transcript, and audio description chips." }, { "name": "application-pro-accessibility-screen-reader-labels-table", "type": "registry:block", "title": "Screen Reader Labels Table", "description": "Accessible name audit table listing Acme workspace UI elements with their computed label, ARIA role, labeled or missing status, and an exact fix hint." }, { "name": "application-pro-accessibility-touch-target-audit", "type": "registry:block", "title": "Touch Target Audit", "description": "Interactive control audit showing hit areas at true scale in 44px frames with measured sizes, AA and AAA badges, and fix hints." }, { "name": "application-pro-activity-activity-calendar", "type": "registry:block", "title": "Activity Calendar", "description": "Month grid calendar with per-day activity dots scaled by event count and a selected-day event list beside it." }, { "name": "application-pro-activity-activity-heatmap", "type": "registry:block", "title": "Activity Heatmap", "description": "Weekday by hour heatmap of workspace events with intensity cells, a Less to More legend, and peak and quiet window callouts." }, { "name": "application-pro-activity-approvals-queue", "type": "registry:block", "title": "Approvals Queue", "description": "Pending requests with context and age, approve or deny, expiry told to the asker." }, { "name": "application-pro-activity-audit-export-card", "type": "registry:block", "title": "Audit Export Card", "description": "Compliance export form with date range, event count, format selector, and an append-only log disclosure note." }, { "name": "application-pro-activity-audit-trail-timeline", "type": "registry:block", "title": "Audit Trail Timeline", "description": "The compliance log grouped by day, mono actions, second precision, source IPs." }, { "name": "application-pro-activity-changelog-feed", "type": "registry:block", "title": "Changelog Feed", "description": "In-app changelog grouped by month with dated entries, type badges for Feature, Fix, Improvement, and Performance." }, { "name": "application-pro-activity-comment-mentions-list", "type": "registry:block", "title": "Comment Mentions List", "description": "Comment mentions inbox showing each document and section, the quoted comment with your name highlighted, and a jump to reply action." }, { "name": "application-pro-activity-comment-thread-panel", "type": "registry:block", "title": "Comment Thread Panel", "description": "A thread with one nested reply, a resolved marker with reopen, and the composer." }, { "name": "application-pro-activity-deploy-activity-feed", "type": "registry:block", "title": "Deploy Activity Feed", "description": "Engineering deploy timeline showing who shipped what service to which environment with status, commit SHA, and one rollback event." }, { "name": "application-pro-activity-edit-history-diff", "type": "registry:block", "title": "Edit History Diff", "description": "Document version history with a selectable edit list on the left and an inline before and after diff panel on the right using theme token opacity." }, { "name": "application-pro-activity-filtered-activity-log", "type": "registry:block", "title": "Filtered Activity Log", "description": "Activity log in a filtered state with type chips, an applied person filter, a clear all action, and the matching events with counts." }, { "name": "application-pro-activity-inactivity-watch-card", "type": "registry:block", "title": "Inactivity Watch Card", "description": "Watchlist of projects gone quiet showing owner avatar, last event summary, a days idle count, and a nudge action per row." }, { "name": "application-pro-activity-live-presence-bar", "type": "registry:block", "title": "Live Presence Bar", "description": "Realtime presence strip with stacked avatars, status dots for editing and viewing states, and a plus-overflow count." }, { "name": "application-pro-activity-member-activity-panel", "type": "registry:block", "title": "Member Activity Panel", "description": "Single member drill down with an avatar header, three weekly stat columns, and a recent actions list with typed icons and timestamps." }, { "name": "application-pro-activity-mention-feed", "type": "registry:block", "title": "Mention Feed", "description": "Mentions inbox showing author, document context, highlighted snippet, timestamp, and a reply affordance per item." }, { "name": "application-pro-activity-pinned-updates-card", "type": "registry:block", "title": "Pinned Updates Card", "description": "Announcements widget showing three pinned workspace updates with author, tag badge, body text, and an unpin action." }, { "name": "application-pro-activity-reaction-activity-feed", "type": "registry:block", "title": "Reaction Activity Feed", "description": "Social activity feed showing who reacted to or commented on your work, with emoji badges and inline comment quotes." }, { "name": "application-pro-activity-status-change-log", "type": "registry:block", "title": "Status Change Log", "description": "Vertical timeline of status transitions for one entity with actor names, timestamps, and time-in-state durations." }, { "name": "application-pro-activity-team-activity-feed", "type": "registry:block", "title": "Team Activity Feed", "description": "Workspace events on a timeline rail with avatars and one expanded comment." }, { "name": "application-pro-activity-team-pulse-card", "type": "registry:block", "title": "Team Pulse Card", "description": "Weekly team activity summary with commit, comment, and task stats, inline sparklines, and a most-active member row." }, { "name": "application-pro-activity-version-history-list", "type": "registry:block", "title": "Version History List", "description": "Named saves with autosaves collapsed, restore always creates, never rewinds." }, { "name": "application-pro-activity-who-did-what-table", "type": "registry:block", "title": "Who Did What Table", "description": "Workspace activity table with actor avatars, plain-English action verbs, target resources, and result badges." }, { "name": "application-pro-admin-moderation-audit-search-panel", "type": "registry:block", "title": "Audit Search Panel", "description": "Compliance audit log with actor, action type, and date range filters, monospace action chips, IP column, and CSV export." }, { "name": "application-pro-admin-moderation-automation-rules-panel", "type": "registry:block", "title": "Automation Rules Panel", "description": "Automated rule cards in a two column grid with enabled switches, monospace When and Then chips, and match, precision, and overturned stats." }, { "name": "application-pro-admin-moderation-ban-appeal-panel", "type": "registry:block", "title": "Ban Appeal Panel", "description": "Ban appeal review with the original enforcement reason, appellant statement, prior enforcement history, and uphold or reverse actions each requiring a written …" }, { "name": "application-pro-admin-moderation-content-flags-table", "type": "registry:block", "title": "Content Flags Table", "description": "Moderation flags overview table with content snippets, flag reasons, sortable flag counts, status badges, and per-row review actions." }, { "name": "application-pro-admin-moderation-escalation-path-panel", "type": "registry:block", "title": "Escalation Path Panel", "description": "Vertical escalation stepper with numbered tiers on a rail showing response SLAs, on call avatars, routed category badges, and auto escalation rules." }, { "name": "application-pro-admin-moderation-feature-toggle-admin", "type": "registry:block", "title": "Feature Toggle Admin", "description": "Feature flag rows with environment badges, rollout percentage bars, kill-switch toggles, and a callout that kill switches take effect within 10 seconds globall…" }, { "name": "application-pro-admin-moderation-ip-blocklist-manager", "type": "registry:block", "title": "IP Blocklist Manager", "description": "Split blocklist manager pairing an add rule form with scope and duration choices beside ruled entries showing CIDR chips, hit counts, and expiry." }, { "name": "application-pro-admin-moderation-moderation-queue", "type": "registry:block", "title": "Moderation Queue", "description": "Reported items as prioritized cards with content snippet, reason, reporter count, age, and Approve, Remove, and Escalate actions per item." }, { "name": "application-pro-admin-moderation-moderator-performance-board", "type": "registry:block", "title": "Moderator Performance Board", "description": "Moderator table with focus queues, decision counts, seven day sparklines, median handle time, agreement meters, and overturned counts." }, { "name": "application-pro-admin-moderation-queue-health-panel", "type": "registry:block", "title": "Queue Health Panel", "description": "Four stat tiles above a ruled queue list with open counts, oldest item age, SLA status badges, load bars, and assigned moderator avatars." }, { "name": "application-pro-admin-moderation-report-review-card", "type": "registry:block", "title": "Report Review Card", "description": "Single report case with reported content, reporter identity, author flag history, and a decision panel that names the consequence of every action." }, { "name": "application-pro-admin-moderation-role-permissions-matrix", "type": "registry:block", "title": "Role Permissions Matrix", "description": "A permissions matrix with category grouped rows and four role columns showing member counts and check or minus access marks per cell." }, { "name": "application-pro-admin-moderation-user-admin-table", "type": "registry:block", "title": "User Admin Table", "description": "Admin member roster with status badges, signup date, last seen, flag counts, and per-row impersonate and suspend actions logged to the audit trail." }, { "name": "application-pro-ai-assistant-action-approval-card", "type": "registry:block", "title": "Action Approval Card", "description": "Approval gate for a proposed assistant bulk change showing sample before and after field values with approve and reject buttons." }, { "name": "application-pro-ai-assistant-agent-run-trace", "type": "registry:block", "title": "Agent Run Trace", "description": "Vertical timeline of agent tool steps with status icons, tool badges, mono query detail lines, durations, and a raw log link." }, { "name": "application-pro-ai-assistant-ai-usage-card", "type": "registry:block", "title": "Ai Usage Card", "description": "AI token usage panel with a monthly progress bar, a per feature breakdown, and the overage policy stated in the same view." }, { "name": "application-pro-ai-assistant-assistant-chat-panel", "type": "registry:block", "title": "Assistant Chat Panel", "description": "Conversation thread with alternating user and assistant bubbles, inline source chips, and regenerate and copy affordances." }, { "name": "application-pro-ai-assistant-assistant-empty-state", "type": "registry:block", "title": "Assistant Empty State", "description": "Pre-conversation assistant panel with 4 example prompt chips and plain lists of what the assistant can see and cannot do yet." }, { "name": "application-pro-ai-assistant-citations-panel", "type": "registry:block", "title": "Citations Panel", "description": "Sources side panel listing 4 cited documents with title, matched snippet, relevance chip, and an honest footer note." }, { "name": "application-pro-ai-assistant-context-sources-panel", "type": "registry:block", "title": "Context Sources Panel", "description": "Data access panel listing assistant readable sources with icon, item count, last sync time, and a switch, plus one excluded source." }, { "name": "application-pro-ai-assistant-conversation-history-list", "type": "registry:block", "title": "Conversation History List", "description": "Chat history sidebar listing past assistant threads grouped by recency with title, snippet, timestamp, and a delete affordance." }, { "name": "application-pro-ai-assistant-feedback-thumbs-row", "type": "registry:block", "title": "Feedback Thumbs Row", "description": "AI response feedback row with thumbs up and down, a copy and regenerate action, and a reason picker revealed on negative feedback." }, { "name": "application-pro-ai-assistant-inline-suggestion-card", "type": "registry:block", "title": "Inline Suggestion Card", "description": "Text editor surface showing an AI ghost-text completion with Tab to accept and Esc to dismiss keyboard hints and an authorship notice." }, { "name": "application-pro-ai-assistant-model-picker-card", "type": "registry:block", "title": "Model Picker Card", "description": "Model selection card with three rows showing tier, cost per 1k tokens, a one-line tradeoff, and the balanced model pre-selected." }, { "name": "application-pro-ai-assistant-prompt-composer", "type": "registry:block", "title": "Prompt Composer", "description": "AI input surface with a model chip, attach and slash command buttons, a token counter, and a keyboard hinted send button." }, { "name": "application-pro-ai-assistant-prompt-library-grid", "type": "registry:block", "title": "Prompt Library Grid", "description": "Saved prompt cards in a filterable grid showing title, description, category badge, and use count with a create prompt affordance." } ], "component_count": 3566, "components_truncated": true, "component_types": { "registry:block": 3467, "registry:item": 99 }, "has_logo": true, "enrichment_errors": [ "github_unresolved" ], "featured": false }, { "number": 149, "name": "@shadcnblocks", "category": "Blocks & sections (marketing/SaaS)", "tags": [ "saas", "dashboard" ], "tagline": "A shadcn/ui registry with 1429 blocks, 1189 component variants, 14 templates, themes, and admin dashboard patterns.", "short_description": "A shadcn/ui registry with 1429 blocks, 1189 component variants, 14 templates, themes, and admin dashboard patterns.", "description": "Premium shadcn/ui registry with 1,635 marketing/SaaS blocks organized into 60+ categories (Hero 217, Feature 311, Pricing 96, Testimonial 39, Footer 44, Data Table 32, Sidebar 21, Dashboard 18, Ecommerce, Charts, and more), 1,684 component variants, 16 Next.js/Astro templates (priced ~$79 each), an Admin Kit, and a Figma Kit. Installation via shadcn CLI, MCP, or a VS Code/Cursor IDE extension. Free blocks available; full access requires a one-time purchase ($149-$399). Use for: rapidly assembling marketing pages or SaaS dashboards from a best-in-class collection of production-ready, full-width sections.", "homepage": "https://shadcnblocks.com", "docs": "https://shadcnblocks.com/docs", "github": "https://github.com/shadcnblocks/shadcn-ui-blocks", "components_github": "https://github.com/shadcnblocks/shadcn-ui-blocks/tree/master/src/components", "github_default_branch": "master", "github_stars": 364, "last_commit": "2025-10-09T20:08:07Z", "archived": false, "license": null, "open_issues": 0, "registry_template": "https://shadcnblocks.com/r/{name}.json", "registry_index": "https://shadcnblocks.com/r/registry.json", "components": [ "about1", "about10", "about12", "about13", "about14", "about15", "about16", "about17", "about18", "about19", "about2", "about28", "about3", "about4", "about5", "about6", "about7", "about8", "about9", "accept-invite1", "accept-invite2", "address-book1", "address-book2", "application-shell1", "application-shell10", "application-shell11", "application-shell12", "application-shell13", "application-shell14", "application-shell2", "application-shell3", "application-shell4", "application-shell5", "application-shell6", "application-shell7", "application-shell8", "application-shell9", "awards1", "awards2", "awards3", "awards4", "awards5", "awards6", "awards7", "background-pattern1", "background-pattern10", "background-pattern100", "background-pattern11", "background-pattern111", "background-pattern112", "background-pattern113", "background-pattern115", "background-pattern116", "background-pattern117", "background-pattern12", "background-pattern13", "background-pattern14", "background-pattern15", "background-pattern16", "background-pattern17", "background-pattern18", "background-pattern19", "background-pattern2", "background-pattern20", "background-pattern21", "background-pattern22", "background-pattern23", "background-pattern24", "background-pattern25", "background-pattern26", "background-pattern27", "background-pattern28", "background-pattern29", "background-pattern3", "background-pattern30", "background-pattern31", "background-pattern32", "background-pattern33", "background-pattern34", "background-pattern35", "background-pattern36", "background-pattern37", "background-pattern38", "background-pattern39", "background-pattern4", "background-pattern40", "background-pattern5", "background-pattern6", "background-pattern7", "background-pattern8", "background-pattern9", "background-pattern95", "background-pattern96", "background-pattern97", "background-pattern98", "background-pattern99", "banner1", "banner2", "banner3", "banner4" ], "component_items": [ { "name": "about1", "type": "registry:block", "title": "About 1 - Multi-Section Mission Values", "description": "A multi-section about block with mission statement, values grid with icons, and image panels for company storytelling." }, { "name": "about10", "type": "registry:block", "title": "About 10 - Sticky Sidebar Company Profile", "description": "A two-column about section with sticky sidebar containing avatar and contact link, and main content with bio, philosophy, workspace image, and team list." }, { "name": "about12", "type": "registry:block", "title": "About 12 - Agency Profile with Process Cards", "description": "A structured agency about section with labeled sections, process cards with numbered badges, milestone stats, awards list, and testimonial with case study link." }, { "name": "about13", "type": "registry:block", "title": "About 13 - Story with Avatar Profile", "description": "A six-column about section with large story headline, team intro text, avatar profile card, philosophy paragraph, and full-width image." }, { "name": "about14", "type": "registry:block", "title": "About 14 - About with Hero Image", "description": "A six-column about section with headline, full-width hero image, labeled intro text, avatar profile, and philosophy statement." }, { "name": "about15", "type": "registry:block", "title": "About 15 - Tilted Photo Profile Card", "description": "A dark two-column about section with rotated polaroid-style photo card on the left and headline with body text on the right." }, { "name": "about16", "type": "registry:block", "title": "About 16 - Why Us Stats Section", "description": "A six-column about section with sticky Why Us label, quote-style headline, supporting text, full-width image, and three-row stats list." }, { "name": "about17", "type": "registry:block", "title": "About 17 - Interactive Tab Profile", "description": "A seven-column profile section with role and timezone info, bio text, interactive tab navigation, and tab-controlled image display." }, { "name": "about18", "type": "registry:block", "title": "About 18 - Mission and Drive Sections", "description": "A seven-column about section with mission and drive content blocks, each with label, headline, and supporting text, separated by a two-image row." }, { "name": "about19", "type": "registry:block", "title": "About 19 - Image Left Quote Right", "description": "A seven-column about section with large bordered image on the left and headline, text, quote attribution with avatar on the right." }, { "name": "about2", "type": "registry:block", "title": "About 2 - Stats Grid with Logos and Testimonial", "description": "A comprehensive about block with centered intro, asymmetric image grid, stats section, logo strip, and benefit cards with testimonial." }, { "name": "about28", "type": "registry:block", "title": "About 28 - Two-Column About with Staggered Images", "description": "A two-column about section with alternating image and text blocks, featuring staggered image pairs and multi-paragraph text with optional CTA." }, { "name": "about3", "type": "registry:block", "title": "About 3 - Company Profile with Achievements", "description": "A two-column about section with main image, breakout card, logo strip, and achievements stats grid on muted background." }, { "name": "about4", "type": "registry:block", "title": "About 4 - Vision and Creators with Image Grid", "description": "A centered about section with six-image grid, two-column vision and creators text blocks, and muted CTA banner." }, { "name": "about5", "type": "registry:block", "title": "About 5 - Developer Platform Story", "description": "A developer-focused about section with two-column intro, large image, tech logos, origin story, and milestone cards." }, { "name": "about6", "type": "registry:block", "title": "About 6 - Story and Workplace Photo Grid", "description": "A two-column about section with story text and staggered photo grids showing team and workplace imagery." }, { "name": "about7", "type": "registry:block", "title": "About 7 - Product Story with Offset Images", "description": "A narrative about section with offset image layout, product philosophy text, team photos, and careers CTA button." }, { "name": "about8", "type": "registry:block", "title": "About 8 - Fintech About with Stats Carousel", "description": "A fintech-style about section with plus-sign pattern background, stats row, mission narrative, image carousel, and founding team." }, { "name": "about9", "type": "registry:block", "title": "About 9 - Developer Profile with Photos", "description": "A personal profile section with large team photo, role and location info with flag icon, bio text, and secondary workspace image." }, { "name": "accept-invite1", "type": "registry:block", "title": "Accept Invite 1 - Two-Column Invite with Email Form", "description": "A two-column invitation acceptance screen with Google sign-in, email input form, welcome message, and footer links." }, { "name": "accept-invite2", "type": "registry:block", "title": "Accept Invite 2 - Centered Invite Card with Avatar", "description": "A compact centered invitation card with host avatar initial, personalized message, and accept/decline buttons with expiration notice." }, { "name": "address-book1", "type": "registry:block", "title": "Address Book 1 - Address book list with edit modes and default selection", "description": "This component provides an interactive interface for managing and editing a list of addresses, allowing users to add, edit, and delete addresses with form inpu…" }, { "name": "address-book2", "type": "registry:block", "title": "Address Book 2 - Card grid address book with default selection", "description": "The AddressBook2 component is designed to manage a collection of addresses, allowing users to view, edit, add, and delete addresses within a card-based layout.…" }, { "name": "application-shell1", "type": "registry:block", "title": "Application Shell 1 - Sidebar Shell with Breadcrumbs", "description": "A full application shell with collapsible sidebar, grouped navigation with submenus, user dropdown in footer, header with breadcrumbs, and placeholder content …" }, { "name": "application-shell10", "type": "registry:block", "title": "Application Shell 10 - Support Ticket Shell", "description": "A support or helpdesk application shell with ticket sidebar, command palette search, conversation view with message input, and ticket category navigation." }, { "name": "application-shell11", "type": "registry:block", "title": "Application Shell 11 - Video Platform Shell", "description": "A YouTube-style video platform shell with category sidebar, collapsible subscription sections, search bar in header, and user dropdown with account options." }, { "name": "application-shell12", "type": "registry:block", "title": "Application Shell 12 - Two-tier sidebar shell with organization switcher", "description": "Two-tier sidebar with collapsible panel, organization switcher, and animated transitions." }, { "name": "application-shell13", "type": "registry:block", "title": "Application Shell 13 - Top navigation shell with dropdown menus and mobile sheet", "description": "Top navigation bar with dropdown menus, search field, organization switcher, and mobile bottom navigation." }, { "name": "application-shell14", "type": "registry:block", "title": "Application Shell 14 - Crypto exchange shell with wallet and token menus", "description": "Cryptocurrency exchange interface with wallet menu, token favorites, notifications, and rounded navigation tabs." }, { "name": "application-shell2", "type": "registry:block", "title": "Application Shell 2 - Inset Sidebar with Icon Collapse", "description": "An application shell with inset collapsible sidebar that collapses to icon-only mode, grouped navigation with submenus, user dropdown footer, and content area." }, { "name": "application-shell3", "type": "registry:block", "title": "Application Shell 3 - Top Navigation Bar Shell", "description": "An application shell with horizontal top navigation bar featuring dropdown menus, search input, user dropdown, and mobile sheet menu for responsive navigation." }, { "name": "application-shell4", "type": "registry:block", "title": "Application Shell 4 - Top Navigation with Tabs", "description": "An application shell with horizontal top navigation using tab-style links, search input, user dropdown, and mobile sheet menu for responsive navigation." }, { "name": "application-shell5", "type": "registry:block", "title": "Application Shell 5 - Floating Sidebar Shell", "description": "An application shell with floating sidebar variant, grouped navigation with collapsible submenus, user dropdown footer, and toggle button in sidebar header." }, { "name": "application-shell6", "type": "registry:block", "title": "Application Shell 6 - Module Switcher Sidebar Shell", "description": "An application shell with module switcher in sidebar, animated navigation transitions, badge counts on menu items, and drawer for mobile with motion effects." }, { "name": "application-shell7", "type": "registry:block", "title": "Application Shell 7 - Messaging App Shell", "description": "A messaging-style application shell with channel sidebar, pinned items, user presence indicators, header with breadcrumbs and actions, and drawer for mobile." }, { "name": "application-shell8", "type": "registry:block", "title": "Application Shell 8 - Email Client Shell", "description": "An email client application shell with folder sidebar, workspace switcher, search input, message list with badges, and user dropdown with notification settings." }, { "name": "application-shell9", "type": "registry:block", "title": "Application Shell 9 - IDE-Style File Explorer Shell", "description": "A code editor-style application shell with activity bar, file explorer sidebar with collapsible folders, and panel toggle for secondary content area." }, { "name": "awards1", "type": "registry:block", "title": "Awards 1 - Awards table with linked rows", "description": "A section with a large heading and a full-width table of award name, description, and year, with each name linked externally." }, { "name": "awards2", "type": "registry:block", "title": "Awards 2 - Sticky label with awards list", "description": "A two-column layout with a small uppercase label and sticky positioning beside a list of award titles and years separated by hairline borders." }, { "name": "awards3", "type": "registry:block", "title": "Awards 3 - Awards list with hover accent rows", "description": "A titled section with intro text and stacked rows showing a color marker, award title, categories, year, and a sliding accent background on hover." }, { "name": "awards4", "type": "registry:block", "title": "Awards 4 - Awards table with logos and date subtitle", "description": "A large display Awards heading paired with a parenthetical date subtitle above a table of logo chips, names, nominations, and years." }, { "name": "awards5", "type": "registry:block", "title": "Awards 5 - Awards list with pointer-following preview", "description": "A serif-styled grid with a sticky sidebar label and large award titles where pointer movement drives a scaled preview image for the active row." }, { "name": "awards6", "type": "registry:block", "title": "Awards 6 - Milestones grid with separator rows", "description": "A display-size milestones heading over a labeled grid of milestone title, type, and year with horizontal separators between entries." }, { "name": "awards7", "type": "registry:block", "title": "Awards 7 - Split accolades list and product spotlight", "description": "Two columns: intro and an accolade stack with separators on the left, and a product image band plus headline, copy, and three large stats on the right." }, { "name": "background-pattern1", "type": "registry:block", "title": "Background Pattern 1 - Full-screen radial gradient background pattern", "description": "This component generates a full-screen background pattern with a radial gradient effect, applying customizable styles through optional class names. It features…" }, { "name": "background-pattern10", "type": "registry:block", "title": "Background Pattern 10 - Full-viewport CSS grid background pattern", "description": "This component creates a visually appealing background with a grid pattern using CSS gradients, which is centered and takes up the full width and height of the…" }, { "name": "background-pattern100", "type": "registry:block", "title": "Background Pattern 100 - Bottom Blurred Gradient With Noise", "description": "A full-height section with two large bottom-corner radial gradients, heavy blur, desaturated SVG noise on top, and centered pattern placeholder." }, { "name": "background-pattern11", "type": "registry:block", "title": "Background Pattern 11 - Full-screen diagonal cross grid section", "description": "This component renders a full-screen section with a diagonal cross grid background pattern, making it suitable for visually distinct layouts. It accepts a `cla…" }, { "name": "background-pattern111", "type": "registry:block", "title": "Background Pattern 111 - Left Fade Dot Grid Background", "description": "A full-height centered section whose primary dot grid is masked so the pattern reads strongest toward the upper right and fades leftward, with PatternPlacehold…" }, { "name": "background-pattern112", "type": "registry:block", "title": "Background Pattern 112 - Right Fade Dot Grid Background", "description": "A full-height centered section whose primary dot grid is masked so the pattern is strongest toward the upper left and softens toward the right, including Patte…" }, { "name": "background-pattern113", "type": "registry:block", "title": "Background Pattern 113 - Bottom Corner Dot Grid Background", "description": "A full-height centered section with a primary dot grid masked from the bottom-right corner so the pattern fades toward the opposite side, plus PatternPlacehold…" }, { "name": "background-pattern115", "type": "registry:block", "title": "Background Pattern 115 - Center Vignette Dot Grid Background", "description": "A full-height centered section with a primary dot grid vignetted from the middle so the edges fall away, centered PatternPlaceholder, and optional section clas…" }, { "name": "background-pattern116", "type": "registry:block", "title": "Background Pattern 116 - Top Band Dot Grid Background", "description": "A full-height centered section with a wide elliptical mask so the primary dot grid is strongest under the top edge and fades downward with a soft multi-stop fa…" }, { "name": "background-pattern117", "type": "registry:block", "title": "Background Pattern 117 - Bottom Band Dot Grid Background", "description": "A full-height centered section with a primary-tinted dot grid that fades upward from the bottom, using PatternPlaceholder as sample foreground content." }, { "name": "background-pattern12", "type": "registry:block", "title": "Background Pattern 12 - Diagonal cross grid background pattern with fades", "description": "This component displays a visually engaging diagonal cross grid background pattern with fade effects, suitable for enhancing the visual appeal of any block. It…" }, { "name": "background-pattern13", "type": "registry:block", "title": "Background Pattern 13 - Diagonal crosshatch with side fade", "description": "This component renders a visually engaging background pattern featuring a left fade diagonal cross grid, suitable for enhancing the aesthetic appeal of any int…" }, { "name": "background-pattern14", "type": "registry:block", "title": "Background Pattern 14 - Diagonal cross grid with top fade", "description": "This component serves as a full-screen background pattern block, featuring a diagonally oriented cross grid with a top fade effect. It allows customization thr…" }, { "name": "background-pattern15", "type": "registry:block", "title": "Background Pattern 15 - Bottom-centered diagonal cross-grid background pattern", "description": "This component creates a visually engaging background pattern with diagonal cross grids and a bottom fade effect, enhancing the aesthetic of any interface. It …" }, { "name": "background-pattern16", "type": "registry:block", "title": "Background Pattern 16 - Lower-left diagonal cross-grid background pattern", "description": "This component creates a visually appealing background pattern using diagonal cross grids and fade effects, ideal for enhancing the aesthetics of any user inte…" }, { "name": "background-pattern17", "type": "registry:block", "title": "Background Pattern 17 - Lower-right diagonal cross-grid background pattern", "description": "This component creates a visually appealing background pattern using a diagonal cross grid with a radial fade effect, set to fill a full-screen height layout. …" } ], "component_count": 3441, "components_truncated": true, "component_types": { "registry:block": 3405, "registry:component": 36 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 150, "name": "@shadcncraft", "category": "Blocks & sections (marketing/SaaS)", "tags": [ "saas" ], "tagline": "A starter collection of polished shadcn/ui components and blocks built to production standards. Part of a larger Figma + React system designed to scale with your product.", "short_description": "A starter collection of polished shadcn/ui components and blocks built to production standards. Part of a larger Figma + React system designed to scale with your product.", "description": "Free, open-source shadcn/ui registry shipping polished, production-ready components and marketing blocks, part of a larger Shadcncraft ecosystem that also includes a matched Figma UI kit and a premium React design system. The free tier covers landing-page building blocks (Hero, Feature, CTA, and similar marketing sections) aligned to shadcn/ui conventions and Tailwind CSS. Installable via the shadcn CLI using the @shadcncraft namespace. Use for: adding high-quality landing-page sections to a Next.js or React project without installing a heavyweight template.", "homepage": "https://shadcncraft.com", "docs": "https://shadcncraft.com/docs", "github": "https://github.com/shadcncraft/shadcncraft-free", "components_github": "https://github.com/shadcncraft/shadcncraft-free/tree/main/src/registry", "github_default_branch": "main", "github_stars": 30, "last_commit": "2026-03-03T22:26:01Z", "archived": false, "license": "Apache-2.0", "open_issues": 1, "registry_template": "https://shadcncraft.com/r/{name}.json", "registry_index": "https://shadcncraft.com/r/registry.json", "components": [ "index", "style", "avatar-stack", "featured-icon", "marquee", "page-heading", "placeholder-logo", "profile-card", "section-heading", "star-rating", "tagline", "image-zoom", "banner-10", "benefits-13", "contact-11", "faqs-4", "footer-4", "newsletter-signup-5", "testimonials-11", "top-navigation-5", "semantic-tokens", "design-system", "use-carousel", "use-click-outside", "use-mobile" ], "component_items": [ { "name": "index", "type": "registry:style", "title": null, "description": null }, { "name": "style", "type": "registry:style", "title": null, "description": null }, { "name": "avatar-stack", "type": "registry:ui", "title": "Avatar Stack", "description": "A compact, visually appealing component for displaying multiple user avatars in an overlapping stack. Perfect for showing participants in a group chat, team me…" }, { "name": "featured-icon", "type": "registry:ui", "title": "Featured Icon", "description": "A component that places an icon inside a styled square or circle frame for extra prominence. This component makes supporting visuals stand out in marketing lay…" }, { "name": "marquee", "type": "registry:ui", "title": "Marquee", "description": "A smooth, endlessly looping scroller ideal for showcasing logos, testimonials, images, or sponsor lists. Features auto-play with customizable speed, pause-on-h…" }, { "name": "page-heading", "type": "registry:ui", "title": "Page Heading", "description": "A component that acts as the text-focused version of a hero banner. This component combines a pre-heading label, an H1 heading, supporting description text, an…" }, { "name": "placeholder-logo", "type": "registry:ui", "title": "Placeholder Logo", "description": "A component for that can be replaced with your brand's main logo. This component ensures layouts stay consistent before brand assets are applied." }, { "name": "profile-card", "type": "registry:ui", "title": "Profile Card", "description": "An extension of the avatar component with more details on the individual. Good for blog posts etc." }, { "name": "section-heading", "type": "registry:ui", "title": "Section Heading", "description": "A component that standardizes heading typography and spacing. This component includes a pre-heading label, main heading, and body text in different layout vari…" }, { "name": "star-rating", "type": "registry:ui", "title": "Star Rating", "description": "A component that displays ratings with stars and an optional label. This component builds trust with visual feedback." }, { "name": "tagline", "type": "registry:ui", "title": "Tagline", "description": "A component that displays a tagline with different variants." }, { "name": "image-zoom", "type": "registry:ui", "title": "Image Zoom", "description": "Image zoom is a component that allows you to zoom in on an image." }, { "name": "banner-10", "type": "registry:block", "title": "Banner 10 – Inline announcement link", "description": "A minimal announcement banner for low-friction updates. Renders as simple inline text with an optional icon and link, plus a close action. Best for subtle prod…" }, { "name": "benefits-13", "type": "registry:block", "title": "Benefits 13 – Card grid with section header", "description": "A layout with a section header followed by a grid of equal-height cards. Each card includes an icon, title, and short text, arranged in a consistent grid that …" }, { "name": "contact-11", "type": "registry:block", "title": "Contact 11 – Centered form with supporting sidebar", "description": "A balanced contact layout with a primary, centered form and a secondary sidebar that mirrors or reinforces the same interaction. The main column keeps focus on…" }, { "name": "faqs-4", "type": "registry:block", "title": "FAQ 4 – Centered accordion with supporting panel", "description": "A clean, centered FAQ accordion paired with a narrow sidebar version. Uses a strong section header and clear dividers for easy scanning, with an optional suppo…" }, { "name": "footer-4", "type": "registry:block", "title": "Footer 4 – Brand-led sitemap footer", "description": "A sitemap footer anchored by a short brand statement and logo, followed by structured link columns and legal links. Gives more context about the company while …" }, { "name": "newsletter-signup-5", "type": "registry:block", "title": "Newsletter Signup 5 – Inline callout with contained form", "description": "A horizontal newsletter signup pattern presented inside a soft container to separate it from surrounding content. The headline and description anchor the left …" }, { "name": "testimonials-11", "type": "registry:block", "title": "Testimonial 11 – Editorial quote grid", "description": "A structured testimonial layout that combines a clear section header with a multi-column grid of short quotes. It balances scannability and depth by presenting…" }, { "name": "top-navigation-5", "type": "registry:block", "title": "Top Navigation 5 – Minimal center-aligned links with inline auth", "description": "A stripped-back, center-aligned top navigation that prioritizes clarity and whitespace. Primary links sit in a single horizontal row with the brand anchored to…" }, { "name": "semantic-tokens", "type": "registry:theme", "title": null, "description": null }, { "name": "design-system", "type": "registry:style", "title": null, "description": null }, { "name": "use-carousel", "type": "registry:hook", "title": null, "description": null }, { "name": "use-click-outside", "type": "registry:hook", "title": null, "description": null }, { "name": "use-mobile", "type": "registry:hook", "title": null, "description": null } ], "component_count": 25, "components_truncated": false, "component_types": { "registry:style": 3, "registry:ui": 10, "registry:block": 8, "registry:theme": 1, "registry:hook": 3 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 151, "name": "@shadcndesign", "category": "Design system", "tags": [ "ai", "aesthetic", "components" ], "tagline": "A growing collection of high-quality blocks and themes for shadcn/ui.", "short_description": "A growing collection of high-quality blocks and themes for shadcn/ui.", "description": "A premium shadcn/ui ecosystem created by a veteran Figma designer (7+ years, former Ant Design maintainer) offering a pixel-perfect Figma kit with components, variants, and Tailwind CSS variable alignment, plus production-ready React blocks, an agent-skills bundle, and a Figma plugin. Targets designers and developers who need design-to-code fidelity. Loved by 7,500+ teams. Pricing is via lifetime access. No public GitHub repo. Use for: teams requiring a tightly paired Figma + React shadcn/ui design system where design tokens and component states match exactly between design and implementation.", "homepage": "https://www.shadcndesign.com", "docs": "https://www.shadcndesign.com/docs/getting-started", "github": "N/A", "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://shadcndesign-free.vercel.app/r/{name}.json", "registry_index": "https://shadcndesign-free.vercel.app/r/registry.json", "components": [ "404-section-1", "banner-1", "bento-grid-1", "blog-section-1", "comparison-section-1", "contact-section-1", "cta-section-1", "empty-lp-section-1", "faq-section-1", "feature-section-1", "footer-1", "gallery-section-1", "header-section-1", "hero-section-1", "logo-section-1", "lp-navbar-1", "pattern-1", "pricing-section-1", "rich-text-section-1", "stats-section-1", "team-section-1", "testimonials-section-1", "tagline", "logo", "placeholder-logo-buzzsnap", "placeholder-logo-dashstar", "placeholder-logo-editly", "placeholder-logo-geoaura", "placeholder-logo-nanodea", "placeholder-logo-orionbo", "placeholder-logo-revahub", "placeholder-logo-starlight", "theme-purple", "theme-honey", "theme-sketchpad", "theme-soft-orange", "theme-fast-red", "theme-night-wind", "theme-citrus", "theme-soulslike", "theme-fresh-lime", "theme-orbiter", "theme-neon-forest", "theme-icecream" ], "component_items": [ { "name": "404-section-1", "type": "registry:component", "title": "404 Section 1", "description": "404 error page section with modern design" }, { "name": "banner-1", "type": "registry:component", "title": "Banner 1", "description": "Promotional banner with close button and modern styling" }, { "name": "bento-grid-1", "type": "registry:component", "title": "Bento Grid 1", "description": "Feature-rich layout with dynamic grid showcasing product features" }, { "name": "blog-section-1", "type": "registry:component", "title": "Blog Section 1", "description": "Blog posts grid with featured articles and metadata" }, { "name": "comparison-section-1", "type": "registry:component", "title": "Comparison Section 1", "description": "Feature comparison table with mobile-responsive design" }, { "name": "contact-section-1", "type": "registry:component", "title": "Contact Section 1", "description": "Contact form with validation and privacy policy checkbox" }, { "name": "cta-section-1", "type": "registry:component", "title": "CTA Section 1", "description": "Call-to-action section with primary background and compelling copy" }, { "name": "empty-lp-section-1", "type": "registry:component", "title": "Empty LP Section 1", "description": "Placeholder section for custom content" }, { "name": "faq-section-1", "type": "registry:component", "title": "FAQ Section 1", "description": "Frequently asked questions with accordion interface and CTA card" }, { "name": "feature-section-1", "type": "registry:component", "title": "Feature Section 1", "description": "Feature showcase with image and dual-column layout" }, { "name": "footer-1", "type": "registry:component", "title": "Footer 1", "description": "Site footer with navigation links and legal information" }, { "name": "gallery-section-1", "type": "registry:component", "title": "Gallery Section 1", "description": "Image gallery section with aspect ratio control" }, { "name": "header-section-1", "type": "registry:component", "title": "Header Section 1", "description": "Page header with title and description" }, { "name": "hero-section-1", "type": "registry:component", "title": "Hero Section 1", "description": "Hero section with dual-column layout and call-to-action buttons" }, { "name": "logo-section-1", "type": "registry:component", "title": "Logo Section 1", "description": "Logo showcase section with placeholder logos" }, { "name": "lp-navbar-1", "type": "registry:component", "title": "LP Navbar 1", "description": "Landing page navigation with mobile menu and logo" }, { "name": "pattern-1", "type": "registry:component", "title": "Pattern 1", "description": "Background pattern component for visual enhancement" }, { "name": "pricing-section-1", "type": "registry:component", "title": "Pricing Section 1", "description": "Pricing table with billing toggle and feature tooltips" }, { "name": "rich-text-section-1", "type": "registry:component", "title": "Rich Text Section 1", "description": "Article layout with author information and structured content" }, { "name": "stats-section-1", "type": "registry:component", "title": "Stats Section 1", "description": "Statistics showcase with dual-column layout and metrics" }, { "name": "team-section-1", "type": "registry:component", "title": "Team Section 1", "description": "Team member showcase with social links and descriptions" }, { "name": "testimonials-section-1", "type": "registry:component", "title": "Testimonials Section 1", "description": "Customer testimonial with avatar and quote" }, { "name": "tagline", "type": "registry:component", "title": "Tagline", "description": "Reusable tagline component with variants" }, { "name": "logo", "type": "registry:component", "title": "Logo", "description": "Brand logo component with customizable size" }, { "name": "placeholder-logo-buzzsnap", "type": "registry:component", "title": "Placeholder Logo Buzzsnap", "description": "Placeholder logo component for logo section 1" }, { "name": "placeholder-logo-dashstar", "type": "registry:component", "title": "Placeholder Logo Dashstar", "description": "Placeholder logo component for logo section 1" }, { "name": "placeholder-logo-editly", "type": "registry:component", "title": "Placeholder Logo Editly", "description": "Placeholder logo component for logo section 1" }, { "name": "placeholder-logo-geoaura", "type": "registry:component", "title": "Placeholder Logo Geoaura", "description": "Placeholder logo component for logo section 1" }, { "name": "placeholder-logo-nanodea", "type": "registry:component", "title": "Placeholder Logo Nanodea", "description": "Placeholder logo component for logo section 1" }, { "name": "placeholder-logo-orionbo", "type": "registry:component", "title": "Placeholder Logo Orionbo", "description": "Placeholder logo component for logo section 1" }, { "name": "placeholder-logo-revahub", "type": "registry:component", "title": "Placeholder Logo Revahub", "description": "Placeholder logo component for logo section 1" }, { "name": "placeholder-logo-starlight", "type": "registry:component", "title": "Placeholder Logo Starlight", "description": "Placeholder logo component for logo section 1" }, { "name": "theme-purple", "type": "registry:theme", "title": "Purple Theme by shadcndesign.com", "description": null }, { "name": "theme-honey", "type": "registry:theme", "title": "Honey Theme by shadcndesign.com", "description": null }, { "name": "theme-sketchpad", "type": "registry:theme", "title": "Sketchpad Theme by shadcndesign.com", "description": null }, { "name": "theme-soft-orange", "type": "registry:theme", "title": "Soft Orange Theme by shadcndesign.com", "description": null }, { "name": "theme-fast-red", "type": "registry:theme", "title": "Fast Red Theme by shadcndesign.com", "description": null }, { "name": "theme-night-wind", "type": "registry:theme", "title": "Night Wind Theme by shadcndesign.com", "description": null }, { "name": "theme-citrus", "type": "registry:theme", "title": "Citrus Theme by shadcndesign.com", "description": null }, { "name": "theme-soulslike", "type": "registry:theme", "title": "Soulslike Theme by shadcndesign.com", "description": null }, { "name": "theme-fresh-lime", "type": "registry:theme", "title": "Fresh Lime Theme by shadcndesign.com", "description": null }, { "name": "theme-orbiter", "type": "registry:theme", "title": "Orbiter Theme by shadcndesign.com", "description": null }, { "name": "theme-neon-forest", "type": "registry:theme", "title": "Neon Forest Theme by shadcndesign.com", "description": null }, { "name": "theme-icecream", "type": "registry:theme", "title": "Icecream Theme by shadcndesign.com", "description": null } ], "component_count": 44, "components_truncated": false, "component_types": { "registry:component": 32, "registry:theme": 12 }, "has_logo": true, "enrichment_errors": [ "github_lookup_failed" ], "featured": true }, { "number": 152, "name": "@shadcnhooks", "category": "Hooks/utilities", "tags": [ "components" ], "tagline": "A comprehensive React Hooks Collection built with Shadcn.", "short_description": "A comprehensive React Hooks Collection built with Shadcn.", "description": "A growing TypeScript-first React hooks collection distributed through the shadcn registry, built for React 19+ with SSR compatibility and zero or minimal external dependencies. Each hook is individually installable (e.g., npx shadcn@latest add @shadcnhooks/use-counter). Documented hooks include use-counter, use-boolean, and others following the shadcn copy-paste philosophy. Tree-shakeable; no lock-in. Use for: adding well-tested, typed utility hooks — state management, toggles, timers, event listeners — directly into a project as owned source files rather than a package dependency.", "homepage": "https://shadcn-hooks.com", "docs": "https://shadcn-hooks.com/docs/introduction", "github": "https://github.com/Debbl/shadcn-hooks", "components_github": "https://github.com/Debbl/shadcn-hooks/tree/main/src/registry", "github_default_branch": "main", "github_stars": 58, "last_commit": "2026-07-07T16:49:48Z", "archived": false, "license": "MIT", "open_issues": 8, "registry_template": "https://shadcn-hooks.com/r/{name}.json", "registry_index": "https://shadcn-hooks.com/r/registry.json", "components": [ "is-browser", "create-effect-with-target", "create-context", "use-why-did-you-update", "use-update-effect", "use-update", "use-unmount", "use-toggle", "use-title", "use-timeout", "use-throttle-fn", "use-throttle-effect", "use-throttle", "use-text-selection", "use-swr", "use-stick-to-bottom", "use-scroll-lock", "use-reset-state", "use-query", "use-previous", "use-os", "use-network", "use-mouse", "use-mount", "use-memoized-fn", "use-mcp", "use-lock-fn", "use-latest", "use-isomorphic-layout-effect", "use-is-online", "use-is-match-media", "use-is-hydrated", "use-interval", "use-in-viewport", "use-hover", "use-hash", "use-fullscreen", "use-fps", "use-event-listener", "use-element-size", "use-effect-with-target", "use-effect-event", "use-document-visibility", "use-deep-compare-layout-effect", "use-deep-compare-effect", "use-debounce-fn", "use-debounce-effect", "use-debounce", "use-custom-compare-effect", "use-creation", "use-counter", "use-controllable-value", "use-clipboard", "use-click-away", "use-click-any-where", "use-boolean", "use-battery", "use-active-element" ], "component_items": [ { "name": "is-browser", "type": "registry:lib", "title": null, "description": "A library that checks if the code is running in a browser." }, { "name": "create-effect-with-target", "type": "registry:lib", "title": null, "description": "A hook to create an effect with a target." }, { "name": "create-context", "type": "registry:lib", "title": null, "description": "Create a context object." }, { "name": "use-why-did-you-update", "type": "registry:hook", "title": null, "description": "A hook to log the props that changed in a component" }, { "name": "use-update-effect", "type": "registry:hook", "title": null, "description": "A hook to run an effect only when the component updates" }, { "name": "use-update", "type": "registry:hook", "title": null, "description": "A hook to force a component to re-render" }, { "name": "use-unmount", "type": "registry:hook", "title": null, "description": "A hook to run a function when the component unmounts" }, { "name": "use-toggle", "type": "registry:hook", "title": null, "description": "A hook to toggle a value" }, { "name": "use-title", "type": "registry:hook", "title": null, "description": "A hook to reactively manage document.title" }, { "name": "use-timeout", "type": "registry:hook", "title": null, "description": "A hook that creates a timeout." }, { "name": "use-throttle-fn", "type": "registry:hook", "title": null, "description": "A hook to throttle a function" }, { "name": "use-throttle-effect", "type": "registry:hook", "title": null, "description": "A hook to throttle an effect" }, { "name": "use-throttle", "type": "registry:hook", "title": null, "description": "A hook to throttle a value" }, { "name": "use-text-selection", "type": "registry:hook", "title": null, "description": "A hook to get the text selection and its bounding rect from an element" }, { "name": "use-swr", "type": "registry:hook", "title": null, "description": "A hook to get the latest value of a variable" }, { "name": "use-stick-to-bottom", "type": "registry:hook", "title": null, "description": "A lightweight React Hook intended mainly for AI chat applications, for smoothly sticking to bottom of messages" }, { "name": "use-scroll-lock", "type": "registry:hook", "title": null, "description": "A hook to lock the scroll of the body" }, { "name": "use-reset-state", "type": "registry:hook", "title": null, "description": "A hook to reset a state" }, { "name": "use-query", "type": "registry:hook", "title": null, "description": "useQuery is a hook that allows you to fetch data from an API and cache the results." }, { "name": "use-previous", "type": "registry:hook", "title": null, "description": "A hook to get the previous value of a variable" }, { "name": "use-os", "type": "registry:hook", "title": null, "description": "A hook to detect the current operating system" }, { "name": "use-network", "type": "registry:hook", "title": null, "description": "A hook to get the network state" }, { "name": "use-mouse", "type": "registry:hook", "title": null, "description": "A hook to track mouse position with optional touch support" }, { "name": "use-mount", "type": "registry:hook", "title": null, "description": "A hook to run a function when the component mounts" }, { "name": "use-memoized-fn", "type": "registry:hook", "title": null, "description": "A hook to declare a memoized function" }, { "name": "use-mcp", "type": "registry:hook", "title": null, "description": "A hook to get the latest value of a variable" }, { "name": "use-lock-fn", "type": "registry:hook", "title": null, "description": "A hook to lock a function until the previous promise is resolved" }, { "name": "use-latest", "type": "registry:hook", "title": null, "description": "A hook to get the latest value of a variable" }, { "name": "use-isomorphic-layout-effect", "type": "registry:hook", "title": null, "description": "A hook to use layout effect on the client side" }, { "name": "use-is-online", "type": "registry:hook", "title": null, "description": "A hook to check if the user is online" }, { "name": "use-is-match-media", "type": "registry:hook", "title": null, "description": "A hook to check if the media query matches" }, { "name": "use-is-hydrated", "type": "registry:hook", "title": null, "description": "A hook to check if the component is hydrated" }, { "name": "use-interval", "type": "registry:hook", "title": null, "description": "A hook that creates an interval." }, { "name": "use-in-viewport", "type": "registry:hook", "title": null, "description": "A hook to check if an element is in the viewport" }, { "name": "use-hover", "type": "registry:hook", "title": null, "description": "A hook to check if the mouse is hovering over an element" }, { "name": "use-hash", "type": "registry:hook", "title": null, "description": "A hook to get current hash" }, { "name": "use-fullscreen", "type": "registry:hook", "title": null, "description": "A hook to manage fullscreen state" }, { "name": "use-fps", "type": "registry:hook", "title": null, "description": "A hook to calculate the FPS" }, { "name": "use-event-listener", "type": "registry:hook", "title": null, "description": "A hook to attach event listeners to DOM elements, the window, or media query lists." }, { "name": "use-element-size", "type": "registry:hook", "title": null, "description": "A hook to track an element's width and height" }, { "name": "use-effect-with-target", "type": "registry:hook", "title": null, "description": "A hook to create an effect with a target element that re-runs when the target or dependencies change" }, { "name": "use-effect-event", "type": "registry:hook", "title": null, "description": "A hook to declare an effect event" }, { "name": "use-document-visibility", "type": "registry:hook", "title": null, "description": "A hook to track the document visibility state" }, { "name": "use-deep-compare-layout-effect", "type": "registry:hook", "title": null, "description": "A hook to use a deep compare layout effect" }, { "name": "use-deep-compare-effect", "type": "registry:hook", "title": null, "description": "A hook to use a deep compare effect" }, { "name": "use-debounce-fn", "type": "registry:hook", "title": null, "description": "A hook to debounce a function" }, { "name": "use-debounce-effect", "type": "registry:hook", "title": null, "description": "A hook to debounce an effect" }, { "name": "use-debounce", "type": "registry:hook", "title": null, "description": "A hook to debounce a value" }, { "name": "use-custom-compare-effect", "type": "registry:hook", "title": null, "description": "A hook like useEffect but with a custom compare function" }, { "name": "use-creation", "type": "registry:hook", "title": null, "description": "A hook to create a value only once" }, { "name": "use-counter", "type": "registry:hook", "title": null, "description": "A hook that creates a counter." }, { "name": "use-controllable-value", "type": "registry:hook", "title": null, "description": "A hook to manage a controllable value" }, { "name": "use-clipboard", "type": "registry:hook", "title": null, "description": "A hook to copy text to clipboard" }, { "name": "use-click-away", "type": "registry:hook", "title": null, "description": "A hook to click away from an element" }, { "name": "use-click-any-where", "type": "registry:hook", "title": null, "description": "A hook to click anywhere" }, { "name": "use-boolean", "type": "registry:hook", "title": null, "description": "A hook to toggle a boolean value" }, { "name": "use-battery", "type": "registry:hook", "title": null, "description": "A hook to monitor battery information" }, { "name": "use-active-element", "type": "registry:hook", "title": null, "description": "A hook to track the currently focused element in the document" } ], "component_count": 58, "components_truncated": false, "component_types": { "registry:lib": 3, "registry:hook": 55 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 153, "name": "@shadcnmaps", "category": "Maps", "tags": [ "dashboard" ], "tagline": "Beautiful map components powered by pure SVG.", "short_description": "Beautiful map components powered by pure SVG.", "description": "A registry of 170+ interactive SVG map components for React covering all world countries, continents (Africa, Europe, Asia), US states, and several country-level subdivisions (Brazil, Japan, Australia). Built with pure React SVG and no external mapping libraries. Features include hover tooltips, region click/keyboard selection, zoom/pan controls, custom markers, and full CSS-variable theming with light/dark mode. Installed per map via the shadcn CLI. Free and open-source. Use for: embedding interactive choropleth or region-selection maps in dashboards or data-viz pages without a heavy mapping library dependency.", "homepage": "https://shadcnmaps.com", "docs": "https://shadcnmaps.com/overview/getting-started", "github": "https://github.com/LGLabGreg/shadcnmaps", "components_github": "https://github.com/LGLabGreg/shadcnmaps/tree/main/registry", "github_default_branch": "main", "github_stars": 9, "last_commit": "2026-07-04T11:05:58Z", "archived": false, "license": null, "open_issues": 5, "registry_template": "https://shadcnmaps.com/r/{name}.json", "registry_index": "https://shadcnmaps.com/r/registry.json", "components": [ "map", "usa", "africa", "alabama", "alaska", "algeria", "angola", "argentina", "arizona", "arkansas", "asia", "australia", "austria", "azerbaijan", "france", "world", "bahrain", "bangladesh", "belarus", "belgium", "bolivia", "brazil", "bulgaria", "california", "colorado", "cameroon", "central-america", "canada", "caribbean", "china", "colombia", "connecticut", "costa-rica", "cote-ivoire", "croatia", "cuba", "czech-republic", "democratic-republic-congo", "denmark", "dominican-republic", "ecuador", "egypt", "el-salvador", "estonia", "ethiopia", "finland", "germany", "ghana", "greece", "guatemala", "honduras", "hungary", "india", "indonesia", "iran", "iraq", "ireland", "israel", "italy", "japan", "jordan", "kazakhstan", "kenya", "kuwait", "latvia", "lebanon", "libya", "lithuania", "luxembourg", "macau", "malaysia", "mexico", "monaco", "morocco", "myanmar", "nepal", "netherlands", "new-zealand", "nigeria", "norway", "oman", "pakistan", "panama", "paraguay", "peru", "philippines", "poland", "portugal", "puerto-rico", "qatar", "romania", "russia", "saudi-arabia", "serbia", "singapore", "slovakia", "slovenia", "south-africa", "south-korea", "spain" ], "component_items": [ { "name": "map", "type": "registry:ui", "title": "Map", "description": "Core SVG map renderer with region interaction, tooltips, and markers. Required by all map components." }, { "name": "usa", "type": "registry:component", "title": "USA Map", "description": "Interactive United States map with all 50 states and DC. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "africa", "type": "registry:component", "title": "Africa", "description": "Interactive Africa map with 56 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "alabama", "type": "registry:component", "title": "Alabama", "description": "Interactive Alabama map with 68 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "alaska", "type": "registry:component", "title": "Alaska", "description": "Interactive Alaska map with 30 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "algeria", "type": "registry:component", "title": "Algeria", "description": "Interactive Algeria map with 49 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "angola", "type": "registry:component", "title": "Angola", "description": "Interactive Angola map with 19 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "argentina", "type": "registry:component", "title": "Argentina", "description": "Interactive Argentina map with 25 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "arizona", "type": "registry:component", "title": "Arizona", "description": "Interactive Arizona map with 16 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "arkansas", "type": "registry:component", "title": "Arkansas", "description": "Interactive Arkansas map with 76 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "asia", "type": "registry:component", "title": "Asia", "description": "Interactive Asia map with 54 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "australia", "type": "registry:component", "title": "Australia", "description": "Interactive Australia map with 9 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "austria", "type": "registry:component", "title": "Austria", "description": "Interactive Austria map with 10 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "azerbaijan", "type": "registry:component", "title": "Azerbaijan", "description": "Interactive Azerbaijan map with 79 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "france", "type": "registry:component", "title": "France Map", "description": "Interactive France map with 13 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "world", "type": "registry:component", "title": "World Map", "description": "Interactive World map with 256 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "bahrain", "type": "registry:component", "title": "Bahrain", "description": "Interactive Bahrain map with 5 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "bangladesh", "type": "registry:component", "title": "Bangladesh", "description": "Interactive Bangladesh map with 7 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "belarus", "type": "registry:component", "title": "Belarus", "description": "Interactive Belarus map with 7 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "belgium", "type": "registry:component", "title": "Belgium", "description": "Interactive Belgium map with 11 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "bolivia", "type": "registry:component", "title": "Bolivia", "description": "Interactive Bolivia map with 9 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "brazil", "type": "registry:component", "title": "Brazil", "description": "Interactive Brazil map with 27 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "bulgaria", "type": "registry:component", "title": "Bulgaria", "description": "Interactive Bulgaria map with 28 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "california", "type": "registry:component", "title": "California", "description": "Interactive California map with 58 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "colorado", "type": "registry:component", "title": "Colorado", "description": "Interactive Colorado map with 64 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "cameroon", "type": "registry:component", "title": "Cameroon", "description": "Interactive Cameroon map with 10 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "central-america", "type": "registry:component", "title": "Central America", "description": "Interactive Central America map with 7 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "canada", "type": "registry:component", "title": "Canada", "description": "Interactive Canada map with 13 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "caribbean", "type": "registry:component", "title": "Caribbean", "description": "Interactive Caribbean map with 35 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "china", "type": "registry:component", "title": "China", "description": "Interactive China map with 32 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "colombia", "type": "registry:component", "title": "Colombia", "description": "Interactive Colombia map with 33 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "connecticut", "type": "registry:component", "title": "Connecticut", "description": "Interactive Connecticut map with 8 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "costa-rica", "type": "registry:component", "title": "Costa Rica", "description": "Interactive Costa Rica map with 7 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "cote-ivoire", "type": "registry:component", "title": "Côte d'Ivoire", "description": "Interactive Côte d'Ivoire map with 19 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "croatia", "type": "registry:component", "title": "Croatia", "description": "Interactive Croatia map with 21 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "cuba", "type": "registry:component", "title": "Cuba", "description": "Interactive Cuba map with 16 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "czech-republic", "type": "registry:component", "title": "Czech Republic", "description": "Interactive Czech Republic map with 14 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "democratic-republic-congo", "type": "registry:component", "title": "Democratic Republic of the Congo", "description": "Interactive Democratic Republic of the Congo map with 11 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "denmark", "type": "registry:component", "title": "Denmark", "description": "Interactive Denmark map with 98 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "dominican-republic", "type": "registry:component", "title": "Dominican Republic", "description": "Interactive Dominican Republic map with 32 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "ecuador", "type": "registry:component", "title": "Ecuador", "description": "Interactive Ecuador map with 24 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "egypt", "type": "registry:component", "title": "Egypt", "description": "Interactive Egypt map with 27 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "el-salvador", "type": "registry:component", "title": "El Salvador", "description": "Interactive El Salvador map with 14 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "estonia", "type": "registry:component", "title": "Estonia", "description": "Interactive Estonia map with 15 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "ethiopia", "type": "registry:component", "title": "Ethiopia", "description": "Interactive Ethiopia map with 11 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "finland", "type": "registry:component", "title": "Finland", "description": "Interactive Finland map with 18 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "germany", "type": "registry:component", "title": "Germany", "description": "Interactive Germany map with 16 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "ghana", "type": "registry:component", "title": "Ghana", "description": "Interactive Ghana map with 10 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "greece", "type": "registry:component", "title": "Greece", "description": "Interactive Greece map with 14 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "guatemala", "type": "registry:component", "title": "Guatemala", "description": "Interactive Guatemala map with 22 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "honduras", "type": "registry:component", "title": "Honduras", "description": "Interactive Honduras map with 18 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "hungary", "type": "registry:component", "title": "Hungary", "description": "Interactive Hungary map with 43 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "india", "type": "registry:component", "title": "India", "description": "Interactive India map with 36 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "indonesia", "type": "registry:component", "title": "Indonesia", "description": "Interactive Indonesia map with 33 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "iran", "type": "registry:component", "title": "Iran", "description": "Interactive Iran map with 31 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "iraq", "type": "registry:component", "title": "Iraq", "description": "Interactive Iraq map with 18 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "ireland", "type": "registry:component", "title": "Ireland", "description": "Interactive Ireland map with 34 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "israel", "type": "registry:component", "title": "Israel", "description": "Interactive Israel map with 6 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "italy", "type": "registry:component", "title": "Italy", "description": "Interactive Italy map with 21 regions. Supports click, hover, selection, tooltips, and custom markers." }, { "name": "japan", "type": "registry:component", "title": "Japan", "description": "Interactive Japan map with 47 regions. Supports click, hover, selection, tooltips, and custom markers." } ], "component_count": 361, "components_truncated": true, "component_types": { "registry:ui": 1, "registry:component": 180, "registry:file": 180 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 154, "name": "@shadcnstore", "category": "Blocks & sections (marketing/SaaS)", "tags": [ "saas" ], "tagline": "A growing collection of shadcn/ui components, blocks, and templates for building modern web apps.", "short_description": "A growing collection of shadcn/ui components, blocks, and templates for building modern web apps.", "description": "A growing shadcn/ui block and template marketplace covering marketing blocks (Hero 6, Feature 10, Testimonial 9, FAQ 4, Pricing 6, Team 9, Footer 7, CTA 10, Stats 8, Bento Grid 4, Contact 6), e-commerce blocks (Storefront Hero, Product Overview, Cart, Checkout, Reviews, Order History), and application UI blocks. Built with React, Tailwind CSS, and Tailwind v3/v4 themes, with a Figma kit also available. Freemium model with a premium tier for full access. Use for: pulling ready-made marketing or e-commerce page sections into a Next.js project in a single category-browsable registry.", "homepage": "https://www.shadcnstore.com", "docs": "https://www.shadcnstore.com/docs", "github": "https://github.com/silicondeck/shadcn-dashboard-landing-template", "components_github": null, "github_default_branch": "main", "github_stars": 834, "last_commit": "2026-02-17T07:16:26Z", "archived": false, "license": "MIT", "open_issues": 4, "registry_template": "https://shadcnstore.com/r/{name}.json", "registry_index": "https://shadcnstore.com/r/registry.json", "components": [ "app-shell-1", "app-shell-2", "app-shell-3", "app-1", "app-2", "chart-1", "chart-2", "chart-3", "chart-4", "chart-5", "chart-6", "datatable-1", "datatable-2", "datatable-3", "datatable-4", "error-page-1", "error-page-2", "error-page-3", "error-page-4", "forgot-password-page-1", "forgot-password-page-2", "forgot-password-page-3", "forgot-password-page-4", "forgot-password-page-5", "forgot-password-page-6", "login-page-1", "login-page-2", "login-page-3", "login-page-4", "login-page-5", "login-page-6", "signup-page-1", "signup-page-2", "signup-page-3", "signup-page-4", "signup-page-5", "signup-page-6", "widget-1", "widget-2", "widget-3", "widget-4", "widget-5", "widget-6", "category-filter-1", "category-filter-2", "category-filter-3", "checkout-form-1", "checkout-form-2", "checkout-form-3", "checkout-form-4", "order-history-1", "order-history-2", "order-history-3", "order-history-4", "product-category-1", "product-category-2", "product-category-3", "product-category-4", "product-category-5", "product-category-6", "product-category-7", "product-card-1", "product-card-2", "product-card-3", "product-card-4", "product-card-5", "product-overview-1", "product-overview-2", "product-overview-3", "product-overview-4", "product-overview-5", "review-rating-1", "review-rating-2", "review-rating-3", "review-rating-4", "review-rating-5", "shopping-cart-1", "shopping-cart-2", "shopping-cart-3", "shopping-cart-4", "storefront-hero-1", "storefront-hero-2", "storefront-hero-3", "storefront-hero-4", "storefront-hero-5", "storefront-hero-6", "storefront-hero-7", "storefront-hero-8", "bento-grid-1", "bento-grid-2", "bento-grid-3", "bento-grid-4", "blog-section-1", "blog-section-2", "blog-section-3", "blog-section-4", "contact-section-1", "contact-section-2", "contact-section-3", "contact-section-4" ], "component_items": [ { "name": "app-shell-1", "type": "registry:block", "title": "E-commerce Shell", "description": "Complete e-commerce frontend with product navigation, shopping cart, categories, and user features" }, { "name": "app-shell-2", "type": "registry:block", "title": "Landing Page Shell", "description": "Marketing-focused landing page with hero section, features showcase, testimonials, and conversion CTA" }, { "name": "app-shell-3", "type": "registry:block", "title": "Blog Platform Shell", "description": "Content-focused blog layout with article listings, categories, sidebar widgets, and reader engagement" }, { "name": "app-1", "type": "registry:block", "title": "App Dashboard 1", "description": "Simple dashboard layout with sidebar navigation and stats" }, { "name": "app-2", "type": "registry:block", "title": "Task Management 2", "description": "Kanban-style task board with drag-and-drop functionality" }, { "name": "chart-1", "type": "registry:block", "title": "Sales Performance Chart", "description": "Clean and simple bar and line chart displaying monthly sales volume and conversion rate trends with dual y-axis visualization" }, { "name": "chart-2", "type": "registry:block", "title": "Revenue & Growth Analytics Chart", "description": "Modern combined bar and line chart showing revenue performance vs targets with growth percentage trends, featuring interactive time period filters and comprehe…" }, { "name": "chart-3", "type": "registry:block", "title": "Analytics Dashboard Chart", "description": "Comprehensive analytics dashboard chart with product sales and volume metrics, featuring trend indicators and recent activity tracking" }, { "name": "chart-4", "type": "registry:block", "title": "Multi-Tab Financial Dashboard", "description": "Interactive financial dashboard with tabbed navigation showing Income (area chart), Expenses (radial chart), and Profit (bar chart) with real-time metrics" }, { "name": "chart-5", "type": "registry:block", "title": "Earnings Timeline Dashboard", "description": "Time-based earnings dashboard with interactive time period tabs (1d, 5d, 1m, 6m, 1y) and area chart visualization with recent activity tracking" }, { "name": "chart-6", "type": "registry:block", "title": "Leading Companies Dashboard", "description": "Radial progress chart dashboard showcasing company performance metrics with department breakdown and visitor statistics" }, { "name": "datatable-1", "type": "registry:block", "title": "Users List Datatable", "description": "Comprehensive user management table with search, filters, pagination, and action dropdowns. Includes user avatars, roles, login status, and two-factor authenti…" }, { "name": "datatable-2", "type": "registry:block", "title": "User Records with Stats Datatable", "description": "Advanced user records table with statistics cards, role icons, plan details, and status management. Features filter dropdowns, bulk actions, and comprehensive …" }, { "name": "datatable-3", "type": "registry:block", "title": "Products Inventory Datatable", "description": "Product inventory management table with images, SKU tracking, quantity badges, star ratings, and status indicators. Includes stock alerts and product actions" }, { "name": "datatable-4", "type": "registry:block", "title": "Advanced Orders Management Dashboard", "description": "Modern orders datatable with analytics cards, command palette (⌘K), tabs navigation, bulk actions, column visibility control, and real-time order tracking. Fea…" }, { "name": "error-page-1", "type": "registry:block", "title": "Error Page 1", "description": "A responsive error page" }, { "name": "error-page-2", "type": "registry:block", "title": "Error Page 2", "description": "A responsive error page" }, { "name": "error-page-3", "type": "registry:block", "title": "Error Page 3", "description": "Interactive 404 page with search and help options" }, { "name": "error-page-4", "type": "registry:block", "title": "Error Page 4", "description": "Maintenance page with countdown and progress tracking" }, { "name": "forgot-password-page-1", "type": "registry:block", "title": "Forgot Password Page 1", "description": "A responsive forgot password page" }, { "name": "forgot-password-page-2", "type": "registry:block", "title": "Forgot Password Page 2", "description": "Simple password reset form with email confirmation" }, { "name": "forgot-password-page-3", "type": "registry:block", "title": "Forgot Password Page 3", "description": "Multi-step password reset with verification code" }, { "name": "forgot-password-page-4", "type": "registry:block", "title": "Forgot Password Page 4", "description": "A modern forgot password page" }, { "name": "forgot-password-page-5", "type": "registry:block", "title": "Forgot Password Page 5", "description": "A modern two-column forgot password page with illustration" }, { "name": "forgot-password-page-6", "type": "registry:block", "title": "Forgot Password Page 6", "description": "A modern responsive forgot password page" }, { "name": "login-page-1", "type": "registry:block", "title": "Login Page 1", "description": "A responsive login page" }, { "name": "login-page-2", "type": "registry:block", "title": "Login Page 2", "description": "Clean and simple login form with social authentication" }, { "name": "login-page-3", "type": "registry:block", "title": "Login Page 3", "description": "Split-screen login with background image and enhanced UX" }, { "name": "login-page-4", "type": "registry:block", "title": "Login Page 4", "description": "A modern animated login page" }, { "name": "login-page-5", "type": "registry:block", "title": "Login Page 5", "description": "A modern two-column login page with illustration" }, { "name": "login-page-6", "type": "registry:block", "title": "Login Page 6", "description": "A modern animated login page" }, { "name": "signup-page-1", "type": "registry:block", "title": "Signup Page 1", "description": "A responsive signup page" }, { "name": "signup-page-2", "type": "registry:block", "title": "Signup Page 2", "description": "Multi-step signup form with progress tracking" }, { "name": "signup-page-3", "type": "registry:block", "title": "Signup Page 3", "description": "Simple signup form with social authentication options" }, { "name": "signup-page-4", "type": "registry:block", "title": "Signup Page 4", "description": "A modern animated signup page" }, { "name": "signup-page-5", "type": "registry:block", "title": "Signup Page 5", "description": "A modern two-column signup page with illustration" }, { "name": "signup-page-6", "type": "registry:block", "title": "Signup Page 6", "description": "A modern animated signup page" }, { "name": "widget-1", "type": "registry:block", "title": "Analytics Dashboard Widget", "description": "Comprehensive analytics dashboard with product sales and volume metrics, featuring trend indicators and recent activity tracking" }, { "name": "widget-2", "type": "registry:block", "title": "Active Tasks Timeline Widget", "description": "Interactive task timeline widget with team avatars, progress tracking, and dashed border design for project management" }, { "name": "widget-3", "type": "registry:block", "title": "Active Tasks Timeline Widget", "description": "Interactive task timeline widget with team avatars, progress tracking, and dashed border design for project management" }, { "name": "widget-4", "type": "registry:block", "title": "Active Tasks Timeline Widget", "description": "Interactive task timeline widget with team avatars, progress tracking, and dashed border design for project management" }, { "name": "widget-5", "type": "registry:block", "title": "Notable Channels Analytics Widget", "description": "Social media channels overview widget with progress bars, metrics display, and interactive area chart showing engagement trends" }, { "name": "widget-6", "type": "registry:block", "title": "Top Products Sales & Volume Widget", "description": "Side-by-side product comparison widget displaying top products by sales and volume with percentage changes, icons, and metrics" }, { "name": "category-filter-1", "type": "registry:block", "title": "Horizontal Filter Bar 1", "description": "A horizontal filter bar with dropdowns and active filter display" }, { "name": "category-filter-2", "type": "registry:block", "title": "Sidebar Category Filter 2", "description": "A sidebar filter with expandable categories and subcategories" }, { "name": "category-filter-3", "type": "registry:block", "title": "Advanced Filter Sidebar 3", "description": "A comprehensive filter sidebar with toggle-based selection and real-time results" }, { "name": "checkout-form-1", "type": "registry:block", "title": "Simple Checkout Form 1", "description": "A clean and straightforward checkout form with essential fields" }, { "name": "checkout-form-2", "type": "registry:block", "title": "Single-Page Checkout 2", "description": "A comprehensive single-page checkout with order summary and secure payment" }, { "name": "checkout-form-3", "type": "registry:block", "title": "Multi-Step Checkout 3", "description": "A guided multi-step checkout process with progress indicator and validation" }, { "name": "checkout-form-4", "type": "registry:block", "title": "Checkout Form with Collections 4", "description": "A checkout form with collections of presets" }, { "name": "order-history-1", "type": "registry:block", "title": "Order History 1", "description": "A clean and straightforward order history" }, { "name": "order-history-2", "type": "registry:block", "title": "Order History 2", "description": "A clean and straightforward order history" }, { "name": "order-history-3", "type": "registry:block", "title": "Order History 3", "description": "A clean and straightforward order history" }, { "name": "order-history-4", "type": "registry:block", "title": "Order Management Table 4", "description": "A detailed table view for managing orders with sorting and pagination" }, { "name": "product-category-1", "type": "registry:block", "title": "Product Category Card 1", "description": "A clean and modern product category card design" }, { "name": "product-category-2", "type": "registry:block", "title": "Product Category Card 2", "description": "Image-based category cards with overlay text and trending badges" }, { "name": "product-category-3", "type": "registry:block", "title": "Product Category Card 3", "description": "A clean and modern product category card design" }, { "name": "product-category-4", "type": "registry:block", "title": "Product Category Card 4", "description": "A clean and modern product category card design" }, { "name": "product-category-5", "type": "registry:block", "title": "Product Category Card 5", "description": "Detailed category list with icons, subcategories, and search functionality" }, { "name": "product-category-6", "type": "registry:block", "title": "Category Grid Cards 6", "description": "A clean and modern product category card design" } ], "component_count": 182, "components_truncated": true, "component_types": { "registry:block": 182 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 155, "name": "@shadcnui-blocks", "category": "Blocks & sections (marketing/SaaS)", "tags": [ "saas" ], "tagline": "A collection of premium, production-ready shadcn/ui blocks, components and templates.", "short_description": "A collection of premium, production-ready shadcn/ui blocks, components and templates.", "description": "A free collection of 200+ production-ready shadcn/ui blocks and 25+ extended component variants, built with Next.js, Tailwind CSS, and TypeScript. Block categories include Hero sections, pricing tables, testimonials, feature grids, and footers, all shipping with light and dark mode. No account or paywall required — copy-paste from the site. Component variants extend standard shadcn/ui defaults with more styles and sizes. Use for: pulling free, dark-mode-ready marketing and landing-page blocks into any Next.js project without a subscription or signup.", "homepage": "https://shadcnui-blocks.com", "docs": "N/A", "github": "https://github.com/akash3444/shadcn-ui-blocks", "components_github": "https://github.com/akash3444/shadcn-ui-blocks/tree/main/src/registry", "github_default_branch": "main", "github_stars": 620, "last_commit": "2026-05-10T07:58:16Z", "archived": false, "license": "MIT", "open_issues": 3, "registry_template": "https://shadcnui-blocks.com/r/{name}.json", "registry_index": "https://shadcnui-blocks.com/r/registry.json", "components": [ "dot-pattern", "particles", "animated-grid-pattern", "marquee", "accordion-01", "accordion-02", "accordion-03", "accordion-04", "accordion-05", "accordion-06", "accordion-07", "accordion-08", "accordion-09", "accordion-10", "accordion-11", "accordion-12", "alert-01", "alert-02", "alert-03", "alert-04", "alert-05", "alert-06", "alert-07", "alert-08", "alert-09", "alert-10", "alert-dialog-01", "alert-dialog-02", "alert-dialog-03", "alert-dialog-04", "alert-dialog-05", "alert-dialog-06", "avatar-01", "avatar-02", "avatar-03", "avatar-04", "avatar-05", "avatar-06", "avatar-07", "avatar-08", "avatar-09", "avatar-10", "avatar-11", "avatar-12", "avatar-13", "avatar-14", "avatar-15", "avatar-16", "badge-01", "badge-02", "badge-03", "badge-04", "badge-05", "badge-06", "badge-07", "badge-08", "badge-09", "badge-10", "badge-11", "badge-12", "badge-13", "badge-14", "badge-15", "badge-16", "badge-17", "button-01", "button-02", "button-03", "button-04", "button-08", "button-17", "button-18", "button-19", "button-22", "button-16", "button-20", "button-14", "button-15", "button-11", "button-12", "button-07", "button-06", "button-09", "button-05", "button-13", "button-23", "button-10", "button-21", "card-01", "card-02", "card-03", "card-07", "card-04", "card-05", "card-08", "card-06", "checkbox-02", "checkbox-01", "checkbox-06", "checkbox-03" ], "component_items": [ { "name": "dot-pattern", "type": "registry:ui", "title": "Dot Pattern", "description": "A simple dot pattern" }, { "name": "particles", "type": "registry:ui", "title": "Particles", "description": "A simple particles" }, { "name": "animated-grid-pattern", "type": "registry:ui", "title": "Animated Grid Pattern", "description": "A simple animated grid pattern" }, { "name": "marquee", "type": "registry:ui", "title": "Marquee", "description": "A simple marquee" }, { "name": "accordion-01", "type": "registry:component", "title": "Default Accordion", "description": "A default accordion component" }, { "name": "accordion-02", "type": "registry:component", "title": "Outline Accordion", "description": "An outline styled accordion" }, { "name": "accordion-03", "type": "registry:component", "title": "Box Accordion", "description": "A box styled accordion" }, { "name": "accordion-04", "type": "registry:component", "title": "Contained Accordion", "description": "A contained accordion component" }, { "name": "accordion-05", "type": "registry:component", "title": "Box Contained Accordion", "description": "A box-contained accordion component" }, { "name": "accordion-06", "type": "registry:component", "title": "Tabs Accordion", "description": "A tabs-styled accordion component" }, { "name": "accordion-07", "type": "registry:component", "title": "Highlight Active Item Accordion", "description": "An accordion that highlights the active item" }, { "name": "accordion-08", "type": "registry:component", "title": "Multiple Expanded at a time Accordion", "description": "An accordion that allows multiple items to be expanded at once" }, { "name": "accordion-09", "type": "registry:component", "title": "Expand Icon Accordion", "description": "An accordion with a custom expand icon" }, { "name": "accordion-10", "type": "registry:component", "title": "Icon Accordion", "description": "An accordion with icons" }, { "name": "accordion-11", "type": "registry:component", "title": "Media Content Accordion", "description": "An accordion with media content" }, { "name": "accordion-12", "type": "registry:component", "title": "Disabled Item Accordion", "description": "An accordion with disabled items" }, { "name": "alert-01", "type": "registry:component", "title": "Primary Alert", "description": "A primary alert component" }, { "name": "alert-02", "type": "registry:component", "title": "Destructive Alert", "description": "A destructive alert component" }, { "name": "alert-03", "type": "registry:component", "title": "Success Alert", "description": "A success alert component" }, { "name": "alert-04", "type": "registry:component", "title": "Warning Alert", "description": "A warning alert component" }, { "name": "alert-05", "type": "registry:component", "title": "Info Alert", "description": "An info alert component" }, { "name": "alert-06", "type": "registry:component", "title": "Alert With Background", "description": "An alert with background component" }, { "name": "alert-07", "type": "registry:component", "title": "Soft Alert", "description": "A soft alert component" }, { "name": "alert-08", "type": "registry:component", "title": "Bootstrap Alert", "description": "A bootstrap-styled alert component" }, { "name": "alert-09", "type": "registry:component", "title": "Callout Alert", "description": "A callout alert component" }, { "name": "alert-10", "type": "registry:component", "title": "Alert With Actions", "description": "An alert with actions component" }, { "name": "alert-dialog-01", "type": "registry:component", "title": "Default Alert Dialog", "description": "A default alert dialog component" }, { "name": "alert-dialog-02", "type": "registry:component", "title": "Alert Dialog With Icon", "description": "An alert dialog with icon component" }, { "name": "alert-dialog-03", "type": "registry:component", "title": "Destructive Alert Dialog", "description": "A destructive alert dialog component" }, { "name": "alert-dialog-04", "type": "registry:component", "title": "Info Alert Dialog", "description": "An info alert dialog component" }, { "name": "alert-dialog-05", "type": "registry:component", "title": "Customized Header Alert Dialog", "description": "An alert dialog with customized header" }, { "name": "alert-dialog-06", "type": "registry:component", "title": "Customized Footer Alert Dialog", "description": "An alert dialog with customized footer" }, { "name": "avatar-01", "type": "registry:component", "title": "Default Avatar", "description": "A default avatar component" }, { "name": "avatar-02", "type": "registry:component", "title": "Clickable Avatar", "description": "A clickable avatar component" }, { "name": "avatar-03", "type": "registry:component", "title": "Avatar with Tooltip", "description": "An avatar with tooltip component" }, { "name": "avatar-04", "type": "registry:component", "title": "Avatar with Text", "description": "An avatar with text component" }, { "name": "avatar-05", "type": "registry:component", "title": "Avatar with Hover Card", "description": "An avatar with hover card component" }, { "name": "avatar-06", "type": "registry:component", "title": "Avatar Size", "description": "Different sizes of avatar component" }, { "name": "avatar-07", "type": "registry:component", "title": "Avatar Color", "description": "Different colors of avatar component" }, { "name": "avatar-08", "type": "registry:component", "title": "Avatar Shape", "description": "Different shapes of avatar component" }, { "name": "avatar-09", "type": "registry:component", "title": "Avatar Fallback", "description": "Avatar with fallback component" }, { "name": "avatar-10", "type": "registry:component", "title": "Avatar with Ring", "description": "Avatar with ring component" }, { "name": "avatar-11", "type": "registry:component", "title": "Avatar Status", "description": "Avatar with status indicator component" }, { "name": "avatar-12", "type": "registry:component", "title": "Avatar Group", "description": "Group of avatars component" }, { "name": "avatar-13", "type": "registry:component", "title": "Avatar Group with Max", "description": "Group of avatars with maximum limit component" }, { "name": "avatar-14", "type": "registry:component", "title": "Avatar Group with Max", "description": "Group of avatars with maximum limit component" }, { "name": "avatar-15", "type": "registry:component", "title": "Avatar Group with Max", "description": "Group of avatars with maximum limit component" }, { "name": "avatar-16", "type": "registry:component", "title": "Avatar Dropdown Menu", "description": "An avatar dropdown menu component" }, { "name": "badge-01", "type": "registry:component", "title": "Default Badge", "description": "A default badge component" }, { "name": "badge-02", "type": "registry:component", "title": "Secondary Badge", "description": "A secondary badge component" }, { "name": "badge-03", "type": "registry:component", "title": "Outline Badge", "description": "An outline badge component" }, { "name": "badge-04", "type": "registry:component", "title": "Destructive Badge", "description": "A destructive badge component" }, { "name": "badge-05", "type": "registry:component", "title": "Rounded Badge", "description": "A rounded badge component" }, { "name": "badge-06", "type": "registry:component", "title": "Gradient Badge", "description": "A gradient badge component" }, { "name": "badge-07", "type": "registry:component", "title": "Gradient Outline Badge", "description": "A gradient outline badge component" }, { "name": "badge-08", "type": "registry:component", "title": "Soft Badge", "description": "A soft badge component" }, { "name": "badge-09", "type": "registry:component", "title": "Status Badge", "description": "A status badge component" }, { "name": "badge-10", "type": "registry:component", "title": "Badge with Image", "description": "A badge with image component" }, { "name": "badge-11", "type": "registry:component", "title": "Badge with Icon", "description": "A badge with icon component" }, { "name": "badge-12", "type": "registry:component", "title": "Clickable Badge", "description": "A clickable badge component" } ], "component_count": 542, "components_truncated": true, "component_types": { "registry:ui": 4, "registry:component": 303, "registry:item": 32, "registry:block": 203 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 156, "name": "@shadcnuikit", "category": "Dashboard/admin templates", "tags": [ "saas", "dashboard" ], "tagline": "Launch your projects faster with admin dashboards, website templates, components, blocks, and pre-built real-world examples.", "short_description": "Launch your projects faster with admin dashboards, website templates, components, blocks, and pre-built real-world examples.", "description": "A commercial shadcn/ui kit focused on admin dashboards and multi-page web apps, built with Next.js, TypeScript, and Tailwind CSS. The free tier includes 1 dashboard and 5+ pages; the premium lifetime plan adds 10 dashboards, 50+ pages, 10+ web-app templates, 100+ premium components, 5+ color schemes, dark/light mode, LTR/RTL support, multiple layouts, and a theme customizer. Targets developers building internal tools and SaaS admin panels. Use for: bootstrapping a production admin dashboard project that needs multiple pre-built data-dense pages and role-differentiated layouts out of the box.", "homepage": "https://shadcnuikit.com", "docs": "N/A", "github": "https://github.com/bundui/shadcn-admin-dashboard-free", "components_github": "https://github.com/bundui/shadcn-admin-dashboard-free/tree/main/components", "github_default_branch": "main", "github_stars": 379, "last_commit": "2025-12-19T22:23:33Z", "archived": false, "license": null, "open_issues": 0, "registry_template": "https://shadcnuikit.com/r/{name}.json", "registry_index": "https://shadcnuikit.com/r/registry.json", "components": [ "chart1", "chart10", "chart11", "chart12", "chart13", "chart14", "chart15", "chart16", "chart17", "chart18", "chart19", "chart2", "chart20", "chart3", "chart4", "chart5", "chart6", "chart7", "chart8", "chart9", "form-layout1", "form-layout2", "dashboard-modal1", "dashboard-modal2", "dashboard-modal3", "dashboard-page-layout1", "dashboard-page-layout2", "dashboard-page-layout3", "sidebar-layout", "signin-form1", "signin-form2", "signin-form3", "stat-card1", "stat-card2", "stat-card3", "stat-card4", "stat-card5", "stat-card6", "stat-card7", "stat-card8", "table", "checkout1", "checkout2", "checkout3", "checkout4", "checkout5", "product-category1", "product-category2", "product-category3", "product-category4", "product-details1", "product-details2", "product-details3", "product-details4", "product-details5", "product-details6", "product-details7", "product-features1", "product-features2", "product-list1", "product-list2", "product-list3", "product-list4", "product-list5", "product-list6", "product-list7", "product-list8", "product-quickview1", "product-quickview2", "promo-section", "shopping-cart1", "shopping-cart2", "shopping-cart3", "shopping-cart4", "store-navigation", "changelog1", "changelog2", "changelog3", "changelog4", "cta1", "cta10", "cta2", "cta3", "cta4", "cta5", "cta6", "cta7", "cta8", "cta9", "feature1", "feature10", "feature11", "feature12", "feature13", "feature2", "feature3", "feature4", "feature5", "feature6", "feature7" ], "component_items": [ { "name": "chart1", "type": "registry:block", "title": "Charts", "description": "Chart block with title and single or multi-series data viz." }, { "name": "chart10", "type": "registry:block", "title": "Charts", "description": "Chart card with visualization and legend." }, { "name": "chart11", "type": "registry:block", "title": "Charts", "description": "Chart with single or multiple series and labels." }, { "name": "chart12", "type": "registry:block", "title": "Charts", "description": "Chart block with title and data viz." }, { "name": "chart13", "type": "registry:block", "title": "Charts", "description": "Chart layout with axis and series." }, { "name": "chart14", "type": "registry:block", "title": "Charts", "description": "Chart with grid background and data display." }, { "name": "chart15", "type": "registry:block", "title": "Charts", "description": "Chart card with visualization and optional controls." }, { "name": "chart16", "type": "registry:block", "title": "Charts", "description": "Chart with title and legend." }, { "name": "chart17", "type": "registry:block", "title": "Charts", "description": "Data chart with axis and series." }, { "name": "chart18", "type": "registry:block", "title": "Charts", "description": "Chart block for dashboard metrics." }, { "name": "chart19", "type": "registry:block", "title": "Charts", "description": "Chart with visualization and optional subtitle." }, { "name": "chart2", "type": "registry:block", "title": "Charts", "description": "Chart card with legend and optional timeframe." }, { "name": "chart20", "type": "registry:block", "title": "Charts", "description": "Chart card with title and data viz." }, { "name": "chart3", "type": "registry:block", "title": "Charts", "description": "Dashboard chart with axis labels and data series." }, { "name": "chart4", "type": "registry:block", "title": "Charts", "description": "Chart layout with title and visualization." }, { "name": "chart5", "type": "registry:block", "title": "Charts", "description": "Chart with grid or card wrapper and optional controls." }, { "name": "chart6", "type": "registry:block", "title": "Charts", "description": "Data chart with legend and axis." }, { "name": "chart7", "type": "registry:block", "title": "Charts", "description": "Chart block for line, bar, or area visualization." }, { "name": "chart8", "type": "registry:block", "title": "Charts", "description": "Chart with title and data display." }, { "name": "chart9", "type": "registry:block", "title": "Charts", "description": "Dashboard chart with optional subtitle or filters." }, { "name": "form-layout1", "type": "registry:block", "title": "Form layouts", "description": "Form with grouped fields, labels, and submit area." }, { "name": "form-layout2", "type": "registry:block", "title": "Form layouts", "description": "Form layout with columns or sections and actions." }, { "name": "dashboard-modal1", "type": "registry:block", "title": "Modal dialogs", "description": "Modal with title, content area, and action buttons." }, { "name": "dashboard-modal2", "type": "registry:block", "title": "Modal dialogs", "description": "Dialog layout with header, body, and footer actions." }, { "name": "dashboard-modal3", "type": "registry:block", "title": "Modal dialogs", "description": "Modal or dialog with form or confirmation content." }, { "name": "dashboard-page-layout1", "type": "registry:block", "title": "Page layouts", "description": "Dashboard page with header and main content area." }, { "name": "dashboard-page-layout2", "type": "registry:block", "title": "Page layouts", "description": "Page layout with sidebar, top bar, and content." }, { "name": "dashboard-page-layout3", "type": "registry:block", "title": "Page layouts", "description": "Full page structure with nav and content region." }, { "name": "sidebar-layout", "type": "registry:block", "title": "Sidebar layouts", "description": "Layout with collapsible sidebar and main content area." }, { "name": "signin-form1", "type": "registry:block", "title": "Sign in forms", "description": "Login form with email, password, and submit button." }, { "name": "signin-form2", "type": "registry:block", "title": "Sign in forms", "description": "Sign-in layout with fields and optional social or link." }, { "name": "signin-form3", "type": "registry:block", "title": "Sign in forms", "description": "Login form with card layout and primary CTA." }, { "name": "stat-card1", "type": "registry:block", "title": "Stat cards", "description": "Card with metric value, label, and optional trend." }, { "name": "stat-card2", "type": "registry:block", "title": "Stat cards", "description": "Stat card with number, subtitle, and optional icon." }, { "name": "stat-card3", "type": "registry:block", "title": "Stat cards", "description": "Metric card with value and label in a compact layout." }, { "name": "stat-card4", "type": "registry:block", "title": "Stat cards", "description": "Stat block with headline number and description." }, { "name": "stat-card5", "type": "registry:block", "title": "Stat cards", "description": "Card showing a KPI with optional sparkline or icon." }, { "name": "stat-card6", "type": "registry:block", "title": "Stat cards", "description": "Metric card with value, label, and styling." }, { "name": "stat-card7", "type": "registry:block", "title": "Stat cards", "description": "Stat card with number and subtitle." }, { "name": "stat-card8", "type": "registry:block", "title": "Stat cards", "description": "Dashboard stat block with value and optional trend." }, { "name": "table", "type": "registry:block", "title": "Tables", "description": "Data table with columns, rows, and optional actions or badges." }, { "name": "checkout1", "type": "registry:block", "title": "Checkout page", "description": "Checkout page with product list, shipping options, payment methods, and order summary." }, { "name": "checkout2", "type": "registry:block", "title": "Checkout page", "description": "Checkout page with product list, shipping options, payment methods, and order summary." }, { "name": "checkout3", "type": "registry:block", "title": "Checkout page", "description": "Checkout page with product list, shipping options, payment methods, and order summary." }, { "name": "checkout4", "type": "registry:block", "title": "Checkout page", "description": "Checkout page with product list, shipping options, payment methods, and order summary." }, { "name": "checkout5", "type": "registry:block", "title": "Checkout page", "description": "Checkout page with product list, shipping options, payment methods, and order summary." }, { "name": "product-category1", "type": "registry:block", "title": "Product category", "description": "Category section with products in a grid or list." }, { "name": "product-category2", "type": "registry:block", "title": "Product category", "description": "Category block with headline and product cards." }, { "name": "product-category3", "type": "registry:block", "title": "Product category", "description": "Category layout with filters or tabs and product grid." }, { "name": "product-category4", "type": "registry:block", "title": "Product category", "description": "Category page section with products and optional sidebar." }, { "name": "product-details1", "type": "registry:block", "title": "Product details", "description": "Product page with image gallery, title, price, and add-to-cart." }, { "name": "product-details2", "type": "registry:block", "title": "Product details", "description": "Detail layout with main image, specs, and purchase CTA." }, { "name": "product-details3", "type": "registry:block", "title": "Product details", "description": "Product view with gallery, description, and options." }, { "name": "product-details4", "type": "registry:block", "title": "Product details", "description": "Detail section with images and key info side by side." }, { "name": "product-details5", "type": "registry:block", "title": "Product details", "description": "Product block with image, price, variants, and CTA." }, { "name": "product-details6", "type": "registry:block", "title": "Product details", "description": "Layout with product images and details column." }, { "name": "product-details7", "type": "registry:block", "title": "Product details", "description": "Product detail with gallery, specs, and add-to-cart." }, { "name": "product-features1", "type": "registry:block", "title": "Product features", "description": "Section highlighting product features with icons or bullets." }, { "name": "product-features2", "type": "registry:block", "title": "Product features", "description": "Product benefits or specs in a list or grid." }, { "name": "product-list1", "type": "registry:block", "title": "Product list", "description": "List of product cards with image, title, price, and action." } ], "component_count": 759, "components_truncated": true, "component_types": { "registry:block": 253, "registry:component": 506 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 157, "name": "@shark", "category": "Component library (general)", "tags": [ "aesthetic", "components" ], "tagline": "shadcn/ui-style components built on Ark UI.", "short_description": "shadcn/ui-style components built on Ark UI.", "description": "A shadcn/ui-style component library of 90+ components built on top of Ark UI primitives instead of Radix UI, styled with Tailwind CSS and tailwind-variants. Follows the same CLI and copy-paste distribution model as shadcn/ui, so components live in your repo. Supports React, Solid, Vue, and Svelte. Ark UI provides WAI-ARIA-compliant behavior and keyboard navigation. Free and open-source under MIT. Use for: projects that want the shadcn/ui developer experience and design aesthetic but prefer Ark UI's headless primitives over Radix UI, or need cross-framework component compatibility.", "homepage": "https://shark.vini.one", "docs": "https://shark.vini.one/docs", "github": "https://github.com/sharkui-inc/shark-ui", "components_github": "https://github.com/sharkui-inc/shark-ui/tree/main/registry", "github_default_branch": "main", "github_stars": 163, "last_commit": "2026-07-02T22:26:29Z", "archived": false, "license": "MIT", "open_issues": 3, "registry_template": "https://shark.vini.one/r/{name}.json", "registry_index": null, "components": [], "component_items": [], "component_count": null, "components_truncated": false, "component_types": {}, "has_logo": true, "enrichment_errors": [ "registry_index_unresolved" ], "featured": true }, { "number": 158, "name": "@shieldcn", "category": "Niche/single-purpose", "tags": [ "components" ], "tagline": "Beautiful README badges as a service. A shields.io alternative with the visual quality of shadcn/ui. Drop-in SVG badge components for npm, GitHub, Discord, and more.", "short_description": "Beautiful README badges as a service. A shields.io alternative with the visual quality of shadcn/ui. Drop-in SVG badge components for npm, GitHub, Discord, and more.", "description": "A shields.io alternative that generates SVG and PNG README badges styled to match shadcn/ui button variants. Supports 25+ providers (npm, GitHub, Discord, and more), 6 visual variants, 16 themes, and 40,000+ icons via Iconify. Also supports badge groups similar to a ButtonGroup. Free and open-source (MIT), deployed as a web service with a live generator at shieldcn.dev. No React component runtime required — outputs static SVG/PNG URLs for Markdown. Use for: adding visually consistent, high-quality badges to open-source project READMEs that match your shadcn/ui design language.", "homepage": "https://shieldcn.dev", "docs": "https://shieldcn.dev/docs", "github": "https://github.com/jal-co/shieldcn", "components_github": null, "github_default_branch": "main", "github_stars": 569, "last_commit": "2026-07-07T03:29:20Z", "archived": false, "license": "MIT", "open_issues": 5, "registry_template": "https://shieldcn.dev/r/{name}.json", "registry_index": null, "components": [], "component_items": [], "component_count": null, "components_truncated": false, "component_types": {}, "has_logo": true, "enrichment_errors": [ "registry_index_unresolved" ], "featured": false }, { "number": 159, "name": "@skiper-ui", "category": "Animated components", "tags": [ "aesthetic" ], "tagline": "Brand new uncommon components for your Next.js project. Use with ease through shadcn CLI 3.0, featuring fast-growing components and collections that are easy to edit and use.", "short_description": "Brand new uncommon components for your Next.js project. Use with ease through shadcn CLI 3.0, featuring fast-growing components and collections that are easy to edit and use.", "description": "A growing registry of visually striking, uncommon shadcn/ui-compatible components for Next.js, focused on distinctive interactions and micro-animations. Includes 103+ components such as Dynamic Island, Image Reveal, Hover Members, Vercel Tooltip, Image Cursor Trail, Aave Token Swap UI, and Devouring Details sign-in. Most items require a Pro subscription; a small free tier is available. Installed via shadcn CLI (@skiper-ui namespace). Inspired by design engineers like Emil Kowalski and Rauno Freiberg. Use for: adding rare, high-craft interactive components to a Next.js product when standard shadcn/ui primitives are too ordinary.", "homepage": "https://skiper-ui.com/", "docs": "https://skiper-ui.com/docs/quick-start", "github": "N/A", "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://skiper-ui.com/registry/{name}.json", "registry_index": "https://skiper-ui.com/registry/registry.json", "components": [ "skiper3", "skiper4", "skiper16", "skiper17", "skiper19", "skiper25", "skiper26", "skiper28", "skiper30", "skiper31", "skiper34", "skiper37", "skiper39", "skiper40", "skiper41", "skiper47", "skiper48", "skiper49", "skiper50", "skiper51", "skiper52", "skiper53", "skiper54", "skiper58", "skiper61", "skiper62", "skiper63", "skiper64", "skiper65", "skiper66", "skiper67", "skiper87", "skiper89", "skiper99", "skiper101", "skiper102", "skiper106" ], "component_items": [ { "name": "skiper3", "type": "registry:ui", "title": null, "description": "Apple play button" }, { "name": "skiper4", "type": "registry:ui", "title": null, "description": "Theme toggle buttons" }, { "name": "skiper16", "type": "registry:ui", "title": null, "description": "Card stack scroll" }, { "name": "skiper17", "type": "registry:ui", "title": null, "description": "Card stack with gsap and rotate" }, { "name": "skiper19", "type": "registry:ui", "title": null, "description": "Svg follow scroll" }, { "name": "skiper25", "type": "registry:ui", "title": null, "description": "Music toggle btn" }, { "name": "skiper26", "type": "registry:ui", "title": null, "description": "Theme toggle btn" }, { "name": "skiper28", "type": "registry:ui", "title": null, "description": "3D perspective text" }, { "name": "skiper30", "type": "registry:ui", "title": null, "description": "Oliver parallax" }, { "name": "skiper31", "type": "registry:ui", "title": null, "description": "Text Scroll animation" }, { "name": "skiper34", "type": "registry:ui", "title": null, "description": "Scroll images reveal 003" }, { "name": "skiper37", "type": "registry:ui", "title": null, "description": "Animated number" }, { "name": "skiper39", "type": "registry:ui", "title": null, "description": "Canvas crowd" }, { "name": "skiper40", "type": "registry:ui", "title": null, "description": "CssLink" }, { "name": "skiper41", "type": "registry:ui", "title": null, "description": "Progressive Blur" }, { "name": "skiper47", "type": "registry:ui", "title": null, "description": "Perspective carousel" }, { "name": "skiper48", "type": "registry:ui", "title": null, "description": "Card swipe carousel" }, { "name": "skiper49", "type": "registry:ui", "title": null, "description": "Inverted perspective carousel" }, { "name": "skiper50", "type": "registry:ui", "title": null, "description": "Creative carousel 001" }, { "name": "skiper51", "type": "registry:ui", "title": null, "description": "Creative carousel 002" }, { "name": "skiper52", "type": "registry:ui", "title": null, "description": "ExpandOnHover" }, { "name": "skiper53", "type": "registry:ui", "title": null, "description": "ExpandOnHover vertical" }, { "name": "skiper54", "type": "registry:ui", "title": null, "description": "Shadcn clipPath Carousal" }, { "name": "skiper58", "type": "registry:ui", "title": null, "description": "Text roll navigation" }, { "name": "skiper61", "type": "registry:ui", "title": null, "description": "Mouse follow animations" }, { "name": "skiper62", "type": "registry:ui", "title": null, "description": "Loop animation hook" }, { "name": "skiper63", "type": "registry:ui", "title": null, "description": "Apple squicircle effect" }, { "name": "skiper64", "type": "registry:ui", "title": null, "description": "Gooey Effect" }, { "name": "skiper65", "type": "registry:ui", "title": null, "description": "Breakpoint indicator" }, { "name": "skiper66", "type": "registry:ui", "title": null, "description": "SVG clip path mask" }, { "name": "skiper67", "type": "registry:ui", "title": null, "description": "Video player 001" }, { "name": "skiper87", "type": "registry:ui", "title": null, "description": "Scroll with fade effect" }, { "name": "skiper89", "type": "registry:ui", "title": null, "description": "Scroll progress 001" }, { "name": "skiper99", "type": "registry:ui", "title": null, "description": "Animated icons 002" }, { "name": "skiper101", "type": "registry:ui", "title": null, "description": "Custom tooltip" }, { "name": "skiper102", "type": "registry:ui", "title": null, "description": "Debug Pannel" }, { "name": "skiper106", "type": "registry:ui", "title": null, "description": "Smooth caret input" } ], "component_count": 37, "components_truncated": false, "component_types": { "registry:ui": 37 }, "has_logo": true, "enrichment_errors": [ "github_lookup_failed" ], "featured": true }, { "number": 160, "name": "@slide-cn", "category": "Niche/single-purpose", "tags": [ "components" ], "tagline": "A component library to build slide decks using code.", "short_description": "A component library to build slide decks using code.", "description": "A code-first presentation framework for React that lets developers build slide decks as JSX components installable via the shadcn registry. Provides pre-built slide layouts (title slides, split views, code blocks, progressive reveals), built-in keyboard/swipe navigation, Tailwind CSS and shadcn/ui theming, TypeScript support, and Git-trackable deck source. Install with a single shadcn CLI command. Free and open-source. Use for: building developer-facing presentations or pitch decks directly inside a React/Next.js codebase, with version control and CI/CD integration instead of PowerPoint or Keynote.", "homepage": "https://slide-cn.com", "docs": "https://slide-cn.com/docs", "github": "https://github.com/prithvi-rajan-222/slide-cn", "components_github": "https://github.com/prithvi-rajan-222/slide-cn/tree/main/components", "github_default_branch": "main", "github_stars": 21, "last_commit": "2026-04-19T19:09:46Z", "archived": false, "license": "MIT", "open_issues": 4, "registry_template": "https://slide-cn.com/r/{name}.json", "registry_index": "https://slide-cn.com/r/registry.json", "components": [ "slide-cn-default", "deck", "header-with-content", "slide-nav", "slide-footer", "navigation-toast", "slide", "horizontal-split", "vertical-split", "title-slide", "slide-image", "callout", "code-block", "gradient-linear", "gradient-radial", "reveal", "timeline", "sky-theme", "rose-theme", "earth-theme" ], "component_items": [ { "name": "slide-cn-default", "type": "registry:lib", "title": "Slide-CN Default Preset", "description": "Installs the recommended Slide-CN layouts and components." }, { "name": "deck", "type": "registry:component", "title": "Deck", "description": "A Deck component that is the core of the presentation" }, { "name": "header-with-content", "type": "registry:component", "title": "Header with content", "description": "A layout with a header, and some content space" }, { "name": "slide-nav", "type": "registry:component", "title": "Slide Nav", "description": "Navigation for your slides" }, { "name": "slide-footer", "type": "registry:component", "title": "Slide footer", "description": "Footer for your slides" }, { "name": "navigation-toast", "type": "registry:component", "title": "Navigation Toast", "description": "Toast overlay that shows navigation hints on first load" }, { "name": "slide", "type": "registry:component", "title": "Slide", "description": "Basic slide component" }, { "name": "horizontal-split", "type": "registry:component", "title": "Horizontal split", "description": "A slide layout with two columns split horizontally" }, { "name": "vertical-split", "type": "registry:component", "title": "Vertical split", "description": "A slide layout with two rows split vertically" }, { "name": "title-slide", "type": "registry:component", "title": "Title slide", "description": "Set of components to easily create a title slide" }, { "name": "slide-image", "type": "registry:component", "title": "Slide image", "description": "Set of components to add an image and caption to a slide" }, { "name": "callout", "type": "registry:component", "title": "Callout", "description": "A callout component for highlighting information" }, { "name": "code-block", "type": "registry:component", "title": "Code block", "description": "A code block component with syntax highlighting" }, { "name": "gradient-linear", "type": "registry:component", "title": "Linear Gradient Background", "description": "A full-bleed linear gradient background (top-left to bottom-right) using the slide-cn theme palette tokens." }, { "name": "gradient-radial", "type": "registry:component", "title": "Radial Gradient Background", "description": "A full-bleed radial gradient background emanating from the center using the slide-cn theme palette tokens (background, background-2, background-3)." }, { "name": "reveal", "type": "registry:component", "title": "Reveal", "description": "A component that reveals its content on click" }, { "name": "timeline", "type": "registry:component", "title": "Timeline", "description": "A horizontal or vertical timeline component for displaying ordered events, steps, or milestones" }, { "name": "sky-theme", "type": "registry:theme", "title": "Sky Theme", "description": "A cool blue-purple gradient theme for Slide-CN presentations." }, { "name": "rose-theme", "type": "registry:theme", "title": "Rose Theme", "description": "A warm red-pink gradient theme for Slide-CN presentations." }, { "name": "earth-theme", "type": "registry:theme", "title": "Earth Theme", "description": "A warm green-amber earth tone theme for Slide-CN presentations." } ], "component_count": 20, "components_truncated": false, "component_types": { "registry:lib": 1, "registry:component": 16, "registry:theme": 3 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 161, "name": "@smoothui", "category": "Animated components", "tags": [ "aesthetic" ], "tagline": "A collection of beautifully crafted motion components built with React, Framer Motion, and TailwindCSS. Designed to elevate microinteractions, each component focuses on smooth animations, subtle feedback, and delightful UX. Perfect for designers and developers who want to add refined motion to their interfaces — copy, paste, and make your UI come alive.", "short_description": "A collection of beautifully crafted motion components built with React, Framer Motion, and TailwindCSS. Designed to elevate microinteractions, each component focuses on smooth animations, subtle feedback, and delightful UX. Perfect for designers and developers who want to add refined motion to their interfaces — copy, paste, and make your UI come alive.", "description": "A collection of 50+ animated React UI components and blocks built with Tailwind CSS v4, Motion (Framer Motion), and optionally GSAP. Focuses on microinteractions: smooth transitions, gesture feedback, and delightful hover/reveal effects. Categories include UI Components, Interactive Components, Layout Components, and Utility Components. Compatible with shadcn/ui, installable via shadcn CLI or a dedicated SmoothUI CLI. Supports dark/light mode; fully typed in TypeScript. Free (Vercel OSS). Use for: layering polished motion design onto a shadcn/ui project's interactive elements — buttons, modals, cards, text reveals — without building animations from scratch.", "homepage": "https://smoothui.dev", "docs": "https://smoothui.dev/docs/guides", "github": "https://github.com/educlopez/smoothui", "components_github": null, "github_default_branch": "main", "github_stars": 843, "last_commit": "2026-06-24T14:07:17Z", "archived": false, "license": "MIT", "open_issues": 2, "registry_template": "https://smoothui.dev/r/{name}.json", "registry_index": "https://smoothui.dev/r/registry.json", "components": [ "cta-1", "cta-2", "cta-3", "faq-1", "faq-2", "faq-3", "faq-4", "features-1", "features-2", "features-3", "footer-1", "footer-2", "footer-3", "footer-4", "header-1", "header-2", "header-3", "header-4", "header-5", "header-6", "logo-cloud-1", "logo-cloud-2", "logo-cloud-3", "logo-cloud-4", "pricing-1", "pricing-2", "pricing-3", "shared", "stats-1", "stats-2", "team-1", "team-2", "testimonials-1", "testimonials-2", "testimonials-3", "agent-avatar", "ai-branch", "ai-input", "animated-avatar-group", "animated-file-upload", "animated-input", "animated-o-t-p-input", "animated-progress-bar", "animated-stepper", "animated-tabs", "animated-tags", "animated-toggle", "animated-tooltip", "app-download-stack", "apple-invites", "basic-accordion", "basic-dropdown", "basic-modal", "basic-toast", "book", "breadcrumb", "button-copy", "checkbox", "clip-corners-button", "combobox", "context-menu", "contribution-graph", "cursor-follow", "dialog", "dot-morph-button", "drawer", "dropdown-menu", "dynamic-island", "expandable-cards", "exposure-slider", "figma-comment", "form", "github-stars-animation", "glow-hover-card", "gooey-popover", "grid-loader", "image-metadata-preview", "infinite-slider", "interactive-image-selector", "job-listing-component", "magnetic-button", "notification-badge", "number-flow", "pagination", "phototab", "power-off-slide", "price-flow", "product-card", "radio-group", "reveal-text", "reviews-carousel", "rich-popover", "scramble-hover", "scroll-reveal-paragraph", "scrollable-card-stack", "scrubber", "searchable-dropdown", "select", "siri-orb", "skeleton-loader" ], "component_items": [ { "name": "cta-1", "type": "registry:ui", "title": "cta-1", "description": "Centered CTA block with radial glow background" }, { "name": "cta-2", "type": "registry:ui", "title": "cta-2", "description": "Split layout CTA block with text and illustration" }, { "name": "cta-3", "type": "registry:ui", "title": "cta-3", "description": "Compact banner CTA block" }, { "name": "faq-1", "type": "registry:ui", "title": "faq-1", "description": "FAQ grid block with categorized tabs and icons" }, { "name": "faq-2", "type": "registry:ui", "title": "faq-2", "description": "FAQ accordion block with expandable questions" }, { "name": "faq-3", "type": "registry:ui", "title": "faq-3", "description": "Searchable FAQ section with filter animations" }, { "name": "faq-4", "type": "registry:ui", "title": "faq-4", "description": "Categorized FAQ section with tab navigation" }, { "name": "features-1", "type": "registry:ui", "title": "features-1", "description": "Feature grid block with animated cards" }, { "name": "features-2", "type": "registry:ui", "title": "features-2", "description": "Bento grid features block with asymmetric layout" }, { "name": "features-3", "type": "registry:ui", "title": "features-3", "description": "Alternating features block with side-by-side layout" }, { "name": "footer-1", "type": "registry:ui", "title": "footer-1", "description": "Simple footer block with links and social icons" }, { "name": "footer-2", "type": "registry:ui", "title": "footer-2", "description": "Complex footer block with newsletter and extended links" }, { "name": "footer-3", "type": "registry:ui", "title": "footer-3", "description": "Mega footer with newsletter and social links" }, { "name": "footer-4", "type": "registry:ui", "title": "footer-4", "description": "Minimal single-row footer" }, { "name": "header-1", "type": "registry:ui", "title": "header-1", "description": "Modern header block with navigation and mobile menu" }, { "name": "header-2", "type": "registry:ui", "title": "header-2", "description": "Premium header block with gradient logo and smooth animations" }, { "name": "header-3", "type": "registry:ui", "title": "header-3", "description": "Premium header block with gradient logo and smooth animations" }, { "name": "header-4", "type": "registry:ui", "title": "header-4", "description": "Interactive 3D grid hero header inspired by rauno.me 2024" }, { "name": "header-5", "type": "registry:ui", "title": "header-5", "description": "Spotlight hero block with dark theme and gradient text" }, { "name": "header-6", "type": "registry:ui", "title": "header-6", "description": "Minimal hero block with clean typography" }, { "name": "logo-cloud-1", "type": "registry:ui", "title": "logo-cloud-1", "description": "Simple logo cloud block with grid layout" }, { "name": "logo-cloud-2", "type": "registry:ui", "title": "logo-cloud-2", "description": "Animated logo cloud block with infinite scroll" }, { "name": "logo-cloud-3", "type": "registry:ui", "title": "logo-cloud-3", "description": "Infinite scrolling logo marquee" }, { "name": "logo-cloud-4", "type": "registry:ui", "title": "logo-cloud-4", "description": "Interactive logo grid with hover effects" }, { "name": "pricing-1", "type": "registry:ui", "title": "pricing-1", "description": "Simple pricing block with single plan" }, { "name": "pricing-2", "type": "registry:ui", "title": "pricing-2", "description": "Modern pricing block with three tiers" }, { "name": "pricing-3", "type": "registry:ui", "title": "pricing-3", "description": "Creative pricing block with two plans" }, { "name": "shared", "type": "registry:ui", "title": "shared", "description": "Shared components for SmoothUI blocks" }, { "name": "stats-1", "type": "registry:ui", "title": "stats-1", "description": "Grid stats section block with hover effects" }, { "name": "stats-2", "type": "registry:ui", "title": "stats-2", "description": "Cards stats section block with icons and trends" }, { "name": "team-1", "type": "registry:ui", "title": "team-1", "description": "Grid team section block with hover effects" }, { "name": "team-2", "type": "registry:ui", "title": "team-2", "description": "Carousel team section block with auto-play" }, { "name": "testimonials-1", "type": "registry:ui", "title": "testimonials-1", "description": "Simple testimonials block with auto-rotating cards" }, { "name": "testimonials-2", "type": "registry:ui", "title": "testimonials-2", "description": "Grid testimonials block with navigation arrows" }, { "name": "testimonials-3", "type": "registry:ui", "title": "testimonials-3", "description": "Star testimonials block with grid layout" }, { "name": "agent-avatar", "type": "registry:ui", "title": "agent-avatar", "description": "Canvas-based generative pixel avatar for AI agents, unique per seed." }, { "name": "ai-branch", "type": "registry:ui", "title": "ai-branch", "description": "An interactive AI branch component for displaying conversation flows." }, { "name": "ai-input", "type": "registry:ui", "title": "ai-input", "description": "A AiInput component for SmoothUI." }, { "name": "animated-avatar-group", "type": "registry:ui", "title": "animated-avatar-group", "description": "Stack of overlapping avatars with smooth expand/collapse animation" }, { "name": "animated-file-upload", "type": "registry:ui", "title": "animated-file-upload", "description": "Animated drag-and-drop file upload component" }, { "name": "animated-input", "type": "registry:ui", "title": "animated-input", "description": "A AnimatedInput component for SmoothUI." }, { "name": "animated-o-t-p-input", "type": "registry:ui", "title": "animated-o-t-p-input", "description": "A AnimatedOTPInput component for SmoothUI." }, { "name": "animated-progress-bar", "type": "registry:ui", "title": "animated-progress-bar", "description": "A AnimatedProgressBar component for SmoothUI." }, { "name": "animated-stepper", "type": "registry:ui", "title": "animated-stepper", "description": "Animated stepper/wizard component with step transitions" }, { "name": "animated-tabs", "type": "registry:ui", "title": "animated-tabs", "description": "Animated tabs component with sliding indicator" }, { "name": "animated-tags", "type": "registry:ui", "title": "animated-tags", "description": "A AnimatedTags component for SmoothUI." }, { "name": "animated-toggle", "type": "registry:ui", "title": "animated-toggle", "description": "Animated toggle switch with morph and icon variants" }, { "name": "animated-tooltip", "type": "registry:ui", "title": "animated-tooltip", "description": "Spring-animated tooltip with multiple placement options" }, { "name": "app-download-stack", "type": "registry:ui", "title": "app-download-stack", "description": "A AppDownloadStack component for SmoothUI." }, { "name": "apple-invites", "type": "registry:ui", "title": "apple-invites", "description": "A AppleInvites component for SmoothUI." }, { "name": "basic-accordion", "type": "registry:ui", "title": "basic-accordion", "description": "A BasicAccordion component for SmoothUI." }, { "name": "basic-dropdown", "type": "registry:ui", "title": "basic-dropdown", "description": "A BasicDropdown component for SmoothUI." }, { "name": "basic-modal", "type": "registry:ui", "title": "basic-modal", "description": "A BasicModal component for SmoothUI." }, { "name": "basic-toast", "type": "registry:ui", "title": "basic-toast", "description": "A BasicToast component for SmoothUI." }, { "name": "book", "type": "registry:ui", "title": "book", "description": "A 3D CSS book component with perspective transforms and hover animation" }, { "name": "breadcrumb", "type": "registry:ui", "title": "breadcrumb", "description": "Animated breadcrumb navigation with stagger-in animation" }, { "name": "button-copy", "type": "registry:ui", "title": "button-copy", "description": "A ButtonCopy component for SmoothUI." }, { "name": "checkbox", "type": "registry:ui", "title": "checkbox", "description": "An animated Checkbox component for SmoothUI with checkmark and indeterminate state animations." }, { "name": "clip-corners-button", "type": "registry:ui", "title": "clip-corners-button", "description": "A ClipCornersButton component for SmoothUI." }, { "name": "combobox", "type": "registry:ui", "title": "combobox", "description": "An animated Combobox component for SmoothUI with text filtering, async search, and keyboard navigation." } ], "component_count": 107, "components_truncated": true, "component_types": { "registry:ui": 107 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 162, "name": "@solaceui", "category": "Blocks & sections (marketing/SaaS)", "tags": [ "saas", "aesthetic" ], "tagline": "Production-ready and tastefully crafted sections, animated components, and full-page templates for Next.js, Tailwind CSS & Motion", "short_description": "Production-ready and tastefully crafted sections, animated components, and full-page templates for Next.js, Tailwind CSS & Motion", "description": "A curated set of production-ready marketing sections, animated components, and full-page templates for Next.js, Tailwind CSS, and Motion. Sections include Hero, Testimonials, Bento Grids, Team, Footers, Phone Carousel, Chat Messages, and Hero Video. One-click CLI install per block using the @solaceui namespace. TypeScript-based, responsive, and accessible. Free to use; templates available. Building in public by @harshitlog. Use for: quickly assembling tasteful, animated marketing pages for SaaS products or landing pages where visual polish and Motion-powered transitions are priorities.", "homepage": "https://www.solaceui.com", "docs": "https://www.solaceui.com/docs", "github": "N/A", "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://www.solaceui.com/r/{name}.json", "registry_index": "https://www.solaceui.com/r/registry.json", "components": [ "bento-grid-1", "bento-grid-2", "bento-grid-3", "bento-grid-4", "auth-section-1", "auth-section-2", "auth-section-3", "team-section-1", "team-section-2", "team-section-3", "team-section-4", "team-section-5", "team-section-6", "team-section-7", "testimonial-section-1", "testimonial-section-2", "testimonial-section-3", "testimonial-section-4", "footer-section-1", "footer-section-2", "footer-section-3", "footer-section-4", "footer-section-5", "footer-section-6", "hero-section-1", "hero-section-2", "hero-section-3", "hero-section-4", "hero-section-5", "hero-section-6", "hero-section-7", "hero-section-8", "chat-messages-1", "chat-messages-2", "hero-video-1", "hero-video-2", "phone-mockups-1", "navbar-section-1", "navbar-section-2" ], "component_items": [ { "name": "bento-grid-1", "type": "registry:block", "title": "Bento Grid 1", "description": "Solace UI bento grid block variation 1." }, { "name": "bento-grid-2", "type": "registry:block", "title": "Bento Grid 2", "description": "Solace UI bento grid block variation 2." }, { "name": "bento-grid-3", "type": "registry:block", "title": "Bento Grid 3", "description": "Solace UI bento grid block variation 3." }, { "name": "bento-grid-4", "type": "registry:block", "title": "Bento Grid 4", "description": "Solace UI bento grid block variation 4." }, { "name": "auth-section-1", "type": "registry:block", "title": "Auth Section 1", "description": "Solace UI auth section block variation 1." }, { "name": "auth-section-2", "type": "registry:block", "title": "Auth Section 2", "description": "Solace UI auth section block variation 2." }, { "name": "auth-section-3", "type": "registry:block", "title": "Auth Section 3", "description": "Solace UI auth section block variation 3." }, { "name": "team-section-1", "type": "registry:block", "title": "Team Section 1", "description": "Solace UI team section block variation 1." }, { "name": "team-section-2", "type": "registry:block", "title": "Team Section 2", "description": "Solace UI team section block variation 2." }, { "name": "team-section-3", "type": "registry:block", "title": "Team Section 3", "description": "Solace UI team section block variation 3." }, { "name": "team-section-4", "type": "registry:block", "title": "Team Section 4", "description": "Solace UI team section block variation 4." }, { "name": "team-section-5", "type": "registry:block", "title": "Team Section 5", "description": "Solace UI team section block variation 5." }, { "name": "team-section-6", "type": "registry:block", "title": "Team Section 6", "description": "Solace UI team section block variation 6." }, { "name": "team-section-7", "type": "registry:block", "title": "Team Section 7", "description": "Solace UI team section block variation 7." }, { "name": "testimonial-section-1", "type": "registry:block", "title": "Testimonial Section 1", "description": "Solace UI testimonial section block variation 1." }, { "name": "testimonial-section-2", "type": "registry:block", "title": "Testimonial Section 2", "description": "Solace UI testimonial section block variation 2." }, { "name": "testimonial-section-3", "type": "registry:block", "title": "Testimonial Section 3", "description": "Solace UI testimonial section block variation 3." }, { "name": "testimonial-section-4", "type": "registry:block", "title": "Testimonial Section 4", "description": "Solace UI testimonial section block variation 4." }, { "name": "footer-section-1", "type": "registry:block", "title": "Footer Section 1", "description": "Solace UI footer section block variation 1." }, { "name": "footer-section-2", "type": "registry:block", "title": "Footer Section 2", "description": "Solace UI footer section block variation 2." }, { "name": "footer-section-3", "type": "registry:block", "title": "Footer Section 3", "description": "Solace UI footer section block variation 3." }, { "name": "footer-section-4", "type": "registry:block", "title": "Footer Section 4", "description": "Solace UI footer section block variation 4." }, { "name": "footer-section-5", "type": "registry:block", "title": "Footer Section 5", "description": "Solace UI footer section block variation 5." }, { "name": "footer-section-6", "type": "registry:block", "title": "Footer Section 6", "description": "Solace UI footer section block variation 6." }, { "name": "hero-section-1", "type": "registry:block", "title": "Hero Section 1", "description": "Solace UI hero section block variation 1." }, { "name": "hero-section-2", "type": "registry:block", "title": "Hero Section 2", "description": "Solace UI hero section block variation 2." }, { "name": "hero-section-3", "type": "registry:block", "title": "Hero Section 3", "description": "Solace UI hero section block variation 3." }, { "name": "hero-section-4", "type": "registry:block", "title": "Hero Section 4", "description": "Solace UI hero section block variation 4." }, { "name": "hero-section-5", "type": "registry:block", "title": "Hero Section 5", "description": "Solace UI hero section block variation 5." }, { "name": "hero-section-6", "type": "registry:block", "title": "Hero Section 6", "description": "Solace UI hero section block variation 6." }, { "name": "hero-section-7", "type": "registry:block", "title": "Hero Section 7", "description": "Solace UI hero section block variation 7." }, { "name": "hero-section-8", "type": "registry:block", "title": "Hero Section 8", "description": "Solace UI hero section block variation 8." }, { "name": "chat-messages-1", "type": "registry:component", "title": "Chat Messages 1", "description": "Solace UI chat messages component variation 1." }, { "name": "chat-messages-2", "type": "registry:component", "title": "Chat Messages 2", "description": "Solace UI chat messages component variation 2." }, { "name": "hero-video-1", "type": "registry:component", "title": "Hero Video 1", "description": "Solace UI hero video component variation 1." }, { "name": "hero-video-2", "type": "registry:component", "title": "Hero Video 2", "description": "Solace UI hero video component variation 2." }, { "name": "phone-mockups-1", "type": "registry:component", "title": "Phone Mockups 1", "description": "Solace UI phone mockups component variation 1." }, { "name": "navbar-section-1", "type": "registry:block", "title": "Navbar Section 1", "description": "Solace UI navbar section block variation 1." }, { "name": "navbar-section-2", "type": "registry:block", "title": "Navbar Section 2", "description": "Solace UI navbar section block variation 2 (xAI inspired)." } ], "component_count": 39, "components_truncated": false, "component_types": { "registry:block": 34, "registry:component": 5 }, "has_logo": true, "enrichment_errors": [ "github_lookup_failed" ], "featured": false }, { "number": 163, "name": "@sona-ui", "category": "Animated components", "tags": [ "aesthetic" ], "tagline": "A modern UI component library built with React and TailwindCSS to help you build beautiful and accessible web applications faster.", "short_description": "A modern UI component library built with React and TailwindCSS to help you build beautiful and accessible web applications faster.", "description": "A small but polished React 19 + Tailwind CSS v4 + Motion component library with 10 production-ready animated components across three categories: UI (Accordion, Ripple Button, Vertical Tabs, Expandable Tabs, Link Preview, Bubble Up Button), Text (Spinning Text, Stagger Text), and Effect (Magnetic Button, Marquee). Installable via shadcn CLI per component. Fully typed TypeScript, dark-mode support via next-themes, accessible, tree-shakeable. Open-source MIT on Vercel. Use for: adding carefully crafted animated primitives — especially motion-forward buttons, tabs, and text effects — to a React 19/Next.js project.", "homepage": "https://sona-ui.vercel.app", "docs": "https://sona-ui.vercel.app/docs/installation", "github": "https://github.com/Dinil-Thilakarathne/sona-ui", "components_github": "https://github.com/Dinil-Thilakarathne/sona-ui/tree/master/src/registry", "github_default_branch": "master", "github_stars": 18, "last_commit": "2026-07-06T03:56:55Z", "archived": false, "license": null, "open_issues": 3, "registry_template": "https://sona-ui.vercel.app/r/{name}.json", "registry_index": "https://sona-ui.vercel.app/r/registry.json", "components": [ "accordion", "bubble-up-button", "circular-dock-menu", "dot-orbit-shader", "expandable-tabs", "fan-view", "hold-to-delete-button", "link-preview", "magnetic-button", "marquee", "mesh-gradient-shader", "ripple-button", "spinning-text", "spotlight-card", "stagger-text", "vertical-tab" ], "component_items": [ { "name": "accordion", "type": "registry:ui", "title": "Accordion", "description": "The `Accordion` component allows you to toggle the visibility of content sections. It is useful for FAQs, menus, and more." }, { "name": "bubble-up-button", "type": "registry:ui", "title": "BubbleUpButton", "description": "The `BubbleUpButton` component provides an interactive button with a fluid \"bubble-up\" animation effect when hovered. It creates an engaging user experience wi…" }, { "name": "circular-dock-menu", "type": "registry:ui", "title": "Circular Dock Menu", "description": "A circular trigger button that fans items out in a radial arc with spring animations." }, { "name": "dot-orbit-shader", "type": "registry:ui", "title": "Dot Orbit Shader", "description": "Animated multi-color dots orbiting their cell centers. Supports up to 10 colors with controls for size, spread, and motion. Powered by Paper Design Shaders." }, { "name": "expandable-tabs", "type": "registry:ui", "title": "ExpandableTabs", "description": "The `ExpandableTabs` component is a dynamic and interactive UI element designed for creating horizontal tabbed navigation." }, { "name": "fan-view", "type": "registry:ui", "title": "Fan View", "description": "A trigger button that spreads labeled cards into a fanned arc layout with staggered spring animations." }, { "name": "hold-to-delete-button", "type": "registry:ui", "title": "Hold To Delete Button", "description": "A button that reveals a destructive fill animation while held, triggering a callback only after the full hold duration completes." }, { "name": "link-preview", "type": "registry:ui", "title": "LinkPreview", "description": "The `LinkPreview` component is an interactive UI element that displays a preview of a link when hovered over. It enhances user experience by providing addition…" }, { "name": "magnetic-button", "type": "registry:ui", "title": "Magnetic Button", "description": "Component for magnetic-button" }, { "name": "marquee", "type": "registry:ui", "title": "Marquee", "description": "The `Marquee` component is a versatile UI element that creates a scrolling marquee effect. It is highly customizable and can adapt to various use cases, such a…" }, { "name": "mesh-gradient-shader", "type": "registry:ui", "title": "Mesh Gradient Shader", "description": "A flowing composition of animated color spots shaped by organic distortion and vortex effects. Powered by Paper Design Shaders." }, { "name": "ripple-button", "type": "registry:ui", "title": "RippleButton", "description": "An interactive button with a ripple effect for modern UIs." }, { "name": "spinning-text", "type": "registry:ui", "title": "SpinningText", "description": "The `SpinningText` component is a dynamic and visually engaging UI element that animates text in a circular spinning motion. It is highly customizable, allowin…" }, { "name": "spotlight-card", "type": "registry:ui", "title": "Spotlight Card", "description": "A card with a radial spotlight glow that follows the cursor." }, { "name": "stagger-text", "type": "registry:ui", "title": "StaggerText", "description": "A text component with staggered animation." }, { "name": "vertical-tab", "type": "registry:ui", "title": "VerticalTab", "description": "The `VerticalTab` component is a versatile and interactive UI element designed for creating vertical tabbed navigation. It provides a smooth user experience wi…" } ], "component_count": 16, "components_truncated": false, "component_types": { "registry:ui": 16 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 186, "name": "@soralabs", "category": "Uncategorized", "tags": [], "tagline": "Motion-first React primitives and animated UI components for shadcn/ui. Copy, customize, and ship fluid interfaces.", "short_description": "", "description": "Motion-first React primitives and animated UI components for shadcn/ui. Copy, customize, and ship fluid interfaces.", "homepage": "https://ui.soralabs.io.vn", "docs": "https://ui.soralabs.io.vn/docs/installation", "github": "https://github.com/SoraLabsOSS/sora-ui-community", "components_github": null, "github_default_branch": "main", "github_stars": 1, "last_commit": "2026-06-28T00:36:30Z", "archived": false, "license": null, "open_issues": 0, "registry_template": "https://ui.soralabs.io.vn/r/{name}.json", "registry_index": "https://ui.soralabs.io.vn/r/registry.json", "components": [ "index", "demo-accordion", "demo-border-trail", "demo-border-trail-loading", "demo-border-trail-textarea", "demo-cursor-trail-reveal", "demo-custom-cursor", "demo-dock-nav", "demo-highlight", "demo-highlight-click", "demo-logo-carousel-swapper", "demo-magnetic-cards", "demo-progressive-blur", "demo-scroll-gallery", "demo-skeleton", "demo-sticky-scroll-cards", "demo-bottom-sheet", "demo-draw-underline-link", "demo-number-flow", "demo-text-effect", "demo-text-morph", "demo-text-morph-input", "demo-text-reveal-box", "demo-text-reveal-mask", "demo-text-roll", "hooks-use-auto-height", "hooks-use-controlled-state", "hooks-use-prefers-reduced-motion", "lib-ease", "lib-get-strict-context", "lib-scroll-trigger-utils", "char-stagger-button", "section-cta", "accordion", "border-trail", "cursor-trail-reveal", "custom-cursor", "dock-nav", "highlight", "logo-carousel-swapper", "magnetic-cards", "pixelated-image-reveal", "progressive-blur", "scroll-gallery", "skeleton", "sticky-scroll-cards", "bottom-sheet", "draw-underline-link", "number-flow", "text-effect", "text-morph", "text-reveal-block", "text-reveal-box", "text-reveal-mask", "text-roll", "text-scramble", "text-underline" ], "component_items": [ { "name": "index", "type": "registry:style", "title": null, "description": null }, { "name": "demo-accordion", "type": "registry:ui", "title": "Accordion Demo", "description": "FAQ accordion with animated panels." }, { "name": "demo-border-trail", "type": "registry:ui", "title": "Border Trail Demo", "description": "Card with animated border spotlight." }, { "name": "demo-border-trail-loading", "type": "registry:ui", "title": "Border Trail Loading Card Demo", "description": "Submit-triggered border trail that loops twice then fades." }, { "name": "demo-border-trail-textarea", "type": "registry:ui", "title": "Border Trail Textarea Demo", "description": "Textarea with a continuous gradient border trail." }, { "name": "demo-cursor-trail-reveal", "type": "registry:ui", "title": "Cursor Trail Reveal Demo", "description": "Full-page contact layout with cursor trail image reveals on desktop." }, { "name": "demo-custom-cursor", "type": "registry:ui", "title": "Custom Cursor Demo", "description": "Custom cursor demo with Sora icons and shape variants." }, { "name": "demo-dock-nav", "type": "registry:ui", "title": "Dock Nav Demo", "description": "Apple-style dock navigation demo with app icons." }, { "name": "demo-highlight", "type": "registry:ui", "title": "Highlight Demo", "description": "Shared sliding highlight pill moving between nav items on hover." }, { "name": "demo-highlight-click", "type": "registry:ui", "title": "Highlight Click Demo", "description": "Per-item fade background activated on click — menu list style." }, { "name": "demo-logo-carousel-swapper", "type": "registry:ui", "title": "Logo Carousel Swapper Demo", "description": "Staggered four-column logo swapper with blur and vertical motion." }, { "name": "demo-magnetic-cards", "type": "registry:ui", "title": "Magnetic Cards Demo", "description": "A fanned stack of cards reacting to cursor movement with GSAP-driven spring physics." }, { "name": "demo-progressive-blur", "type": "registry:ui", "title": "Progressive Blur Demo", "description": "A scrollable panel with progressive blur fading content under the top and bottom edges." }, { "name": "demo-scroll-gallery", "type": "registry:ui", "title": "Scroll Gallery Demo", "description": "Sticky scroll slider with 4 slides, strip-mask transitions, and animated title swaps." }, { "name": "demo-skeleton", "type": "registry:ui", "title": "Skeleton Demo", "description": "A profile card loading, then crossfading into content once ready." }, { "name": "demo-sticky-scroll-cards", "type": "registry:ui", "title": "Sticky Scroll Cards Demo", "description": "Front card flips to reveal 4 stacked back cards that dismiss one at a time as you scroll." }, { "name": "demo-bottom-sheet", "type": "registry:ui", "title": "Bottom Sheet Demo", "description": "A settings panel reproduced with the Bottom Sheet primitive: a trigger, a hidden title, and a row list toggling a few mock settings." }, { "name": "demo-draw-underline-link", "type": "registry:ui", "title": "Draw Underline Link Demo", "description": "Scrollable catalog preview with two centered link instances." }, { "name": "demo-number-flow", "type": "registry:ui", "title": "Number Flow Demo", "description": "Number Flow demo with currency, input overlay, and countdown examples." }, { "name": "demo-text-effect", "type": "registry:ui", "title": "Text Effect Demo", "description": "Scroll-triggered text reveal with blur, fade, slide, and scale presets." }, { "name": "demo-text-morph", "type": "registry:ui", "title": "Text Morph Demo", "description": "Continue / Confirm pill button with per-character layout morph." }, { "name": "demo-text-morph-input", "type": "registry:ui", "title": "Text Morph Input Demo", "description": "Live text morph driven by a controlled input." }, { "name": "demo-text-reveal-box", "type": "registry:ui", "title": "Text Reveal Box Demo", "description": "Scroll-pinned manifesto copy with word-by-word highlight reveal." }, { "name": "demo-text-reveal-mask", "type": "registry:ui", "title": "Text Reveal (Mask) Demo", "description": "Scroll-triggered masked text reveal with rich text emphasis." }, { "name": "demo-text-roll", "type": "registry:ui", "title": "Text Roll Demo", "description": "Interactive copy button with chromatic text roll feedback." }, { "name": "hooks-use-auto-height", "type": "registry:hook", "title": "useAutoHeight", "description": "A hook that allows you to automatically adjust the height of an element based on its content." }, { "name": "hooks-use-controlled-state", "type": "registry:hook", "title": "useControlledState", "description": "A hook that allows you to control a state." }, { "name": "hooks-use-prefers-reduced-motion", "type": "registry:hook", "title": "usePrefersReducedMotion", "description": "A hook that tracks the OS-level Reduced Motion setting live, so GSAP-driven primitives can skip or shortcut their animations." }, { "name": "lib-ease", "type": "registry:lib", "title": "Ease & Spring Tokens", "description": "Shared cubic-bezier eases and Motion spring presets (press, swap, panel, layout, mouse) used across primitives to keep motion consistent." }, { "name": "lib-get-strict-context", "type": "registry:lib", "title": "getStrictContext", "description": "A hook that allows you to create a strict context." }, { "name": "lib-scroll-trigger-utils", "type": "registry:lib", "title": "Scroll Trigger Utils", "description": "Shared GSAP ScrollTrigger helpers (window/scroller detection, ready/resize waiting) used by scroll-driven primitives." }, { "name": "char-stagger-button", "type": "registry:ui", "title": "Char Stagger Button", "description": "A button with per-character stagger animation on hover." }, { "name": "section-cta", "type": "registry:ui", "title": "Section CTA", "description": "A chip-style call-to-action link with a Motion-powered sliding label and rotating icon chips on hover." }, { "name": "accordion", "type": "registry:ui", "title": "Accordion", "description": "An animated FAQ accordion with expandable panels, powered by Motion." }, { "name": "border-trail", "type": "registry:ui", "title": "Border Trail", "description": "Animated border spotlight that travels around a rounded container, powered by Motion." }, { "name": "cursor-trail-reveal", "type": "registry:ui", "title": "Cursor Trail Reveal", "description": "Desktop cursor trail that reveals staggered image strips with clip-path wipes as the pointer moves." }, { "name": "custom-cursor", "type": "registry:ui", "title": "Custom Cursor", "description": "A smooth custom cursor that morphs when hovering interactive targets, powered by Motion." }, { "name": "dock-nav", "type": "registry:ui", "title": "Dock Nav", "description": "An Apple-style dock navigation bar with Motion-powered expanding icons and tooltips on hover." }, { "name": "highlight", "type": "registry:ui", "title": "Highlight", "description": "A Motion-powered highlight effect that allows you to highlight elements on hover, click or with a controlled value." }, { "name": "logo-carousel-swapper", "type": "registry:ui", "title": "Logo Carousel Swapper", "description": "Staggered logo column swapper with fade, vertical shift, and motion blur powered by Motion." }, { "name": "magnetic-cards", "type": "registry:ui", "title": "Magnetic Cards", "description": "A fanned stack of cards that spring away from the cursor with GSAP-driven, velocity-based physics." }, { "name": "pixelated-image-reveal", "type": "registry:ui", "title": "Pixelated Image Reveal", "description": "An image card that reveals a second image through a randomized pixel grid on hover, powered by Motion." }, { "name": "progressive-blur", "type": "registry:ui", "title": "Progressive Blur", "description": "A stacked-layer blur that ramps smoothly from sharp to fully blurred toward an edge, for fading content under a fixed header or above a scroll boundary." }, { "name": "scroll-gallery", "type": "registry:ui", "title": "Scroll Gallery", "description": "A full-viewport sticky scroll slider with strip-mask image transitions and animated title swaps, driven by GSAP ScrollTrigger." }, { "name": "skeleton", "type": "registry:ui", "title": "Skeleton", "description": "A loading placeholder with shimmer or fade variants, plus a transition that crossfades into real content once loading finishes." }, { "name": "sticky-scroll-cards", "type": "registry:ui", "title": "Sticky Scroll Cards", "description": "Scroll-pinned hero where a front card flips to reveal a stack of back cards, dismissed one at a time as you keep scrolling." }, { "name": "bottom-sheet", "type": "registry:ui", "title": "Bottom Sheet", "description": "A draggable, snap-point bottom sheet built on Radix Dialog for accessibility, with Motion driving the drag gesture and glide." }, { "name": "draw-underline-link", "type": "registry:ui", "title": "Draw Underline Link", "description": "A link with a hand-drawn SVG underline that animates on hover, powered by Motion." }, { "name": "number-flow", "type": "registry:ui", "title": "Number Flow", "description": "An animated, digit-by-digit number counter with a smooth rolling odometer effect, powered by Motion." }, { "name": "text-effect", "type": "registry:ui", "title": "Text Effect", "description": "Preset-driven staggered text reveals with blur, fade, slide, and scale animations, powered by Motion." }, { "name": "text-morph", "type": "registry:ui", "title": "Text Morph", "description": "Per-character layout morphing for labels, counters, and live text swaps, powered by Motion." }, { "name": "text-reveal-block", "type": "registry:ui", "title": "Text Reveal (Block)", "description": "Line-by-line text reveal with a colored block wipe, powered by GSAP SplitText." }, { "name": "text-reveal-box", "type": "registry:ui", "title": "Text Reveal Box", "description": "Scroll-pinned word-by-word text reveal with a highlight flash, powered by GSAP ScrollTrigger." }, { "name": "text-reveal-mask", "type": "registry:ui", "title": "Text Reveal (Mask)", "description": "A scroll-triggered masked slide-up text reveal animation, powered by Motion." }, { "name": "text-roll", "type": "registry:ui", "title": "Text Roll", "description": "A per-character vertical text roll animation for label swaps and micro-interactions, powered by Motion." }, { "name": "text-scramble", "type": "registry:ui", "title": "Text Scramble", "description": "A text scramble reveal animation that decodes characters on mount or when re-triggered, powered by Motion." }, { "name": "text-underline", "type": "registry:ui", "title": "Text Underline", "description": "A CSS-only link underline that slides through on hover." } ], "component_count": 57, "components_truncated": false, "component_types": { "registry:style": 1, "registry:ui": 50, "registry:hook": 3, "registry:lib": 3 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 164, "name": "@soundcn", "category": "Niche/single-purpose", "tags": [ "aesthetic" ], "tagline": "Large collection of game, interface, retro, and voice sound effects for web applications", "short_description": "Large collection of game, interface, retro, and voice sound effects for web applications", "description": "An open-source registry of 700+ short UI sound effects (game sounds, interface clicks, notifications, transitions, retro bleeps) installable via the shadcn CLI. Each sound is a self-contained TypeScript module with an inline base64 data URI and a useSound hook backed by the Web Audio API — zero external files, no runtime fetching, no CORS issues. Also includes a World of Warcraft sound collection (non-commercial). Most sounds are CC0-licensed (Kenney). Use for: adding subtle audio feedback to interactive React elements (buttons, toasts, drag-and-drop) without any dependency on external audio-hosting services or heavy audio libraries.", "homepage": "https://soundcn.xyz", "docs": "N/A", "github": "https://github.com/kapishdima/soundcn", "components_github": "https://github.com/kapishdima/soundcn/tree/main/registry", "github_default_branch": "main", "github_stars": 691, "last_commit": "2026-06-09T08:33:10Z", "archived": false, "license": "MIT", "open_issues": 1, "registry_template": "https://soundcn.xyz/r/{name}.json", "registry_index": "https://soundcn.xyz/r/registry.json", "components": [ "sound-types", "use-sound", "sound-engine", "click-8bit", "click-soft", "switch-on", "switch-off", "notification-pop", "success-chime", "error-buzz", "hover-tick", "jump-8bit", "coin-collect", "arcade-mode", "back-001", "back-002", "back-003", "back-004", "battle-mode", "begin", "belt-handle-1", "belt-handle-2", "bong-001", "book-close", "book-flip-1", "book-flip-2", "book-flip-3", "book-open", "book-place-1", "book-place-2", "book-place-3", "card-fan-1", "card-fan-2", "card-place-1", "card-place-2", "card-place-3", "card-place-4", "card-shove-1", "card-shove-2", "card-shove-3", "card-shove-4", "card-shuffle", "card-slide-1", "card-slide-2", "card-slide-3", "card-slide-4", "card-slide-5", "card-slide-6", "card-slide-7", "card-slide-8", "cards-pack-open-1", "cards-pack-open-2", "cards-pack-take-out-1", "cards-pack-take-out-2", "championship-mode", "chip-lay-1", "chip-lay-2", "chip-lay-3", "chips-collide-1", "chips-collide-2", "chips-collide-3", "chips-collide-4", "chips-handle-1", "chips-handle-2", "chips-handle-3", "chips-handle-4", "chips-handle-5", "chips-handle-6", "chips-stack-1", "chips-stack-2", "chips-stack-3", "chips-stack-4", "chips-stack-5", "chips-stack-6", "choose-your-character", "chop", "click-001", "click-002", "click-003", "click-004", "click-005", "close-001", "close-002", "close-003", "close-004", "cloth-1", "cloth-2", "cloth-3", "cloth-4", "cloth-belt", "cloth-belt-2", "combo", "combo-breaker", "computer-noise-000", "computer-noise-001", "computer-noise-002", "computer-noise-003", "confirmation-001", "confirmation-002", "confirmation-003" ], "component_items": [ { "name": "sound-types", "type": "registry:lib", "title": "Sound Types", "description": "TypeScript type definitions for soundcn sound assets." }, { "name": "use-sound", "type": "registry:hook", "title": "useSound", "description": "A lightweight React hook for playing sound effects using the Web Audio API. Zero dependencies." }, { "name": "sound-engine", "type": "registry:lib", "title": "Sound Engine", "description": "Framework-agnostic audio engine using Web Audio API. Zero dependencies." }, { "name": "click-8bit", "type": "registry:block", "title": "Click 8-Bit", "description": "A short, retro-style digital click sound, perfect for actions in a vintage game or pixel-art UI." }, { "name": "click-soft", "type": "registry:block", "title": "Click Soft", "description": "A very subtle and gentle click, suitable for minimal UI interactions where a quiet confirmation is desired." }, { "name": "switch-on", "type": "registry:block", "title": "Switch On", "description": "A distinct, upward-moving sound indicating a toggle or switch has been activated, ideal for turning on a setting or feature." }, { "name": "switch-off", "type": "registry:block", "title": "Switch Off", "description": "A distinct, downward-moving sound indicating a toggle or switch has been deactivated, perfect for turning off a setting or feature." }, { "name": "notification-pop", "type": "registry:block", "title": "Notification Pop", "description": "A friendly, short popping sound that signals a new notification or a subtle alert, suitable for toast messages or incoming pings." }, { "name": "success-chime", "type": "registry:block", "title": "Success Chime", "description": "A clear, positive chime sound indicating a successful action or completion, ideal for form submissions or task achievements." }, { "name": "error-buzz", "type": "registry:block", "title": "Error Buzz", "description": "A short, slightly harsh buzz indicating an error or invalid action, perfect for form validation failures or incorrect inputs." }, { "name": "hover-tick", "type": "registry:block", "title": "Hover Tick", "description": "A very subtle, quick tick sound, best used to provide discreet auditory feedback when a user hovers over an interactive element or focuses on it." }, { "name": "jump-8bit", "type": "registry:block", "title": "Jump 8-Bit", "description": "A classic 8-bit upward 'boing' sound effect, ideal for character jumps or upward movements in a retro-style game." }, { "name": "coin-collect", "type": "registry:block", "title": "Coin Collect", "description": "A cheerful, distinct sound of a coin being collected, perfect for rewarding players in a game or marking a successful item pickup." }, { "name": "arcade-mode", "type": "registry:block", "title": "Arcade Mode", "description": "A short, energetic fanfare announcing the start of an arcade game mode, often featuring retro elements." }, { "name": "back-001", "type": "registry:block", "title": "Back 001", "description": "A very quick, subtle sound effect suitable for navigating back in a UI or undoing a simple action." }, { "name": "back-002", "type": "registry:block", "title": "Back 002", "description": "A slightly more pronounced but still short sound for navigating back or cancelling an action in a UI." }, { "name": "back-003", "type": "registry:block", "title": "Back 003", "description": "A brief, crisp sound indicating a backward navigation or an action reversal within an application." }, { "name": "back-004", "type": "registry:block", "title": "Back 004", "description": "A concise sound effect for going back in a sequence or returning to a prior state in an interface." }, { "name": "battle-mode", "type": "registry:block", "title": "Battle Mode", "description": "An impactful, intense sound effect signifying the initiation of a battle sequence or a competitive game mode." }, { "name": "begin", "type": "registry:block", "title": "Begin", "description": "An inspiring and clear sound effect marking the start of a game, level, or significant activity." }, { "name": "belt-handle-1", "type": "registry:block", "title": "Belt Handle 1", "description": "A subtle, mechanical click or adjustment sound, suitable for interacting with a virtual belt or strap handle." }, { "name": "belt-handle-2", "type": "registry:block", "title": "Belt Handle 2", "description": "A distinct, slightly more prominent mechanical sound for operating a belt or strap handle, suggesting a firm action." }, { "name": "bong-001", "type": "registry:block", "title": "Bong 001", "description": "A short, resonant 'bong' sound, useful for a clear, attention-grabbing notification or an important alert." }, { "name": "book-close", "type": "registry:block", "title": "Book Close", "description": "A soft, conclusive thud indicating the closing of a virtual book or document within an interface." }, { "name": "book-flip-1", "type": "registry:block", "title": "Book Flip 1", "description": "A gentle, quick page-turning sound, ideal for navigating through virtual book pages or scrolling content." }, { "name": "book-flip-2", "type": "registry:block", "title": "Book Flip 2", "description": "A distinct, medium-paced sound of a page being flipped, suggesting a deliberate action in a digital book or catalog." }, { "name": "book-flip-3", "type": "registry:block", "title": "Book Flip 3", "description": "A quick, crisp page-turning sound, suitable for rapid page navigation or content scrolling in a virtual book." }, { "name": "book-open", "type": "registry:block", "title": "Book Open", "description": "A soft, inviting sound indicating the opening of a virtual book or accessing new content." }, { "name": "book-place-1", "type": "registry:block", "title": "Book Place 1", "description": "A soft thud or gentle drop sound, perfect for placing a virtual book or item onto a surface." }, { "name": "book-place-2", "type": "registry:block", "title": "Book Place 2", "description": "A slightly more pronounced impact sound for placing a virtual book or object, conveying a definite placement." }, { "name": "book-place-3", "type": "registry:block", "title": "Book Place 3", "description": "A concise sound effect for placing a virtual book, indicating a quick and secure positioning of an item." }, { "name": "card-fan-1", "type": "registry:block", "title": "Card Fan 1", "description": "A gentle, quick fanning sound of virtual cards, suitable for showing a hand of cards or quick selection." }, { "name": "card-fan-2", "type": "registry:block", "title": "Card Fan 2", "description": "A more extended and distinct fanning sound of multiple cards, ideal for presenting a full hand or larger card collection." }, { "name": "card-place-1", "type": "registry:block", "title": "Card Place 1", "description": "A subtle thud as a single virtual card is placed onto a surface, ideal for casual card games." }, { "name": "card-place-2", "type": "registry:block", "title": "Card Place 2", "description": "A clear, short sound of a virtual card being placed, suggesting a deliberate and firm action in a card game." }, { "name": "card-place-3", "type": "registry:block", "title": "Card Place 3", "description": "A distinct, medium-length sound of a virtual card being positioned, indicating a considered placement." }, { "name": "card-place-4", "type": "registry:block", "title": "Card Place 4", "description": "An extended, subtle sound of a virtual card being placed, useful for a smooth, unhurried placement animation." }, { "name": "card-shove-1", "type": "registry:block", "title": "Card Shove 1", "description": "A quick, decisive sound of a virtual card being shoved or pushed, suitable for repositioning or discarding." }, { "name": "card-shove-2", "type": "registry:block", "title": "Card Shove 2", "description": "A distinct, firm sound of a virtual card being shoved, implying a more forceful or confident action." }, { "name": "card-shove-3", "type": "registry:block", "title": "Card Shove 3", "description": "A short, clear sound of a card being briskly shoved, useful for rapid card manipulation actions." }, { "name": "card-shove-4", "type": "registry:block", "title": "Card Shove 4", "description": "A slightly extended and crisp sound of a card being shoved, perfect for a deliberate and audible card movement." }, { "name": "card-shuffle", "type": "registry:block", "title": "Card Shuffle", "description": "The sound of virtual cards being shuffled, creating an authentic atmosphere for card games or randomizing elements." }, { "name": "card-slide-1", "type": "registry:block", "title": "Card Slide 1", "description": "A quick, subtle slide sound for a single virtual card, ideal for minor adjustments or moving cards gently." }, { "name": "card-slide-2", "type": "registry:block", "title": "Card Slide 2", "description": "A distinct, short sliding sound for a virtual card, suggesting a deliberate movement or placement." }, { "name": "card-slide-3", "type": "registry:block", "title": "Card Slide 3", "description": "A smooth, medium-length sliding sound for a virtual card, suitable for an unhurried, controlled movement." }, { "name": "card-slide-4", "type": "registry:block", "title": "Card Slide 4", "description": "A quick, soft slide sound for a virtual card, perfect for swift and quiet card movements." }, { "name": "card-slide-5", "type": "registry:block", "title": "Card Slide 5", "description": "A clear, concise sliding sound for a virtual card, indicating a decisive and efficient movement." }, { "name": "card-slide-6", "type": "registry:block", "title": "Card Slide 6", "description": "A smooth, distinct sliding sound for a virtual card, suitable for a controlled and audible repositioning." }, { "name": "card-slide-7", "type": "registry:block", "title": "Card Slide 7", "description": "A slightly extended, gentle sliding sound for a virtual card, suggesting a deliberate but unforced movement." }, { "name": "card-slide-8", "type": "registry:block", "title": "Card Slide 8", "description": "A prolonged, smooth sliding sound for a virtual card, ideal for long-distance card movements or sweeping actions." }, { "name": "cards-pack-open-1", "type": "registry:block", "title": "Cards Pack Open 1", "description": "A distinct ripping or tearing sound indicating the opening of a virtual card pack, often used for revealing new items." }, { "name": "cards-pack-open-2", "type": "registry:block", "title": "Cards Pack Open 2", "description": "A slightly softer, more subtle sound for opening a virtual card pack, for a less dramatic reveal of content." }, { "name": "cards-pack-take-out-1", "type": "registry:block", "title": "Cards Pack Take Out 1", "description": "A subtle rustling sound as virtual cards are taken out of a pack, ideal for confirming card retrieval." }, { "name": "cards-pack-take-out-2", "type": "registry:block", "title": "Cards Pack Take Out 2", "description": "A crisp, short sound of cards being taken out of a pack, ideal for a UI action confirming selection or removal of an item from a collection." }, { "name": "championship-mode", "type": "registry:block", "title": "Championship Mode", "description": "An impactful, declarative sound announcing a \"championship mode,\" perfect for the start of a special game event or activation of a premium feature." }, { "name": "chip-lay-1", "type": "registry:block", "title": "Chip Lay 1", "description": "A subtle, quick sound of a single chip being laid down, suitable for placing an item, confirming a small selection, or a subtle UI interaction in a game." }, { "name": "chip-lay-2", "type": "registry:block", "title": "Chip Lay 2", "description": "A clear, distinct sound of a single chip being laid down, ideal for confirming a selection, placing a token, or a moderate UI interaction." }, { "name": "chip-lay-3", "type": "registry:block", "title": "Chip Lay 3", "description": "A slightly more prominent sound of a single chip being laid down, suitable for a game action like placing a bet or confirming an important choice." }, { "name": "chips-collide-1", "type": "registry:block", "title": "Chips Collide 1", "description": "A brief, light sound of chips colliding, useful for subtle feedback when items briefly touch or for a minor physics interaction in a UI." }, { "name": "chips-collide-2", "type": "registry:block", "title": "Chips Collide 2", "description": "A quick, clear sound of chips colliding, appropriate for a short interaction where items bump or for a distinct feedback in a game inventory." } ], "component_count": 816, "components_truncated": true, "component_types": { "registry:lib": 2, "registry:hook": 1, "registry:block": 813 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 165, "name": "@spectrumui", "category": "Component library (general)", "tags": [ "ai", "dashboard", "aesthetic", "components" ], "tagline": "A modern component library built with shadcn/ui and Tailwind CSS. Spectrum UI offers elegant, responsive components and smooth animations designed for high-quality interfaces.", "short_description": "A modern component library built with shadcn/ui and Tailwind CSS. Spectrum UI offers elegant, responsive components and smooth animations designed for high-quality interfaces.", "description": "An open-source React/Next.js component library with 250+ free components built on shadcn/ui and Tailwind CSS, featuring smooth animations and responsive design. Components span common UI patterns: Login forms, Payment forms, Settings panels, Data visualization (bar, line, radar charts), AI assistant chat UI, and standard shadcn component variants. A Spectrum Pro tier ($49-$79 launch price) adds premium blocks. Vercel OSS-backed. TypeScript throughout. Use for: projects that need a large free set of pre-built, animated Next.js components that extend shadcn/ui with richer variants and more categories than the default library.", "homepage": "https://ui.spectrumhq.in", "docs": "https://ui.spectrumhq.in/docs", "github": "https://github.com/arihantcodes/spectrum-ui", "components_github": "https://github.com/arihantcodes/spectrum-ui/tree/main/components", "github_default_branch": "main", "github_stars": 1003, "last_commit": "2026-07-06T20:02:20Z", "archived": false, "license": "Apache-2.0", "open_issues": 3, "registry_template": "https://ui.spectrumhq.in/r/{name}.json", "registry_index": "https://ui.spectrumhq.in/r/registry.json", "components": [ "alert-1", "alert-2", "alert-3", "alert-4", "animated-card", "animated-SVG-chart", "animated-testimonials", "autosize-textarea-dependecies", "autosize-textarea-demo", "autosize-textarea-max-height", "autosize-textarea-ref", "autosize-textarea-form", "autosize-textarea-customize", "datetime-picker-demo", "datetime-picker-hour-cycle", "datetime-picker-and-time-input", "datetime-picker-year-range", "datetime-picker-locale", "datetime-picker-calendar-settings", "datetime-picker-display-format", "datetime-picker-placeholder", "datetime-picker-granularity", "datetime-picker-disabled", "datetime-picker-ref", "datetime-picker-form", "dual-range-slider-dependecies", "dual-range-slider-demo", "dual-range-slider-custom-label", "dual-range-slider-label-position", "dual-range-slider-single", "event-badge-3d", "event-calendar", "feedback-demo", "floating-label-input", "floating-label-input-demo", "floating-label-customize", "floating-label-form", "footers-demo", "animated-wave-footer", "stackedcircular-footer", "floatingparticle-footer", "footer", "http-status-code", "image-preview", "image-preview", "infinite-scroll-dependecies", "infinite-scroll-demo", "loading-button-dependencies", "loading-button-demo", "loading-button-usage", "loading-button-as-child", "multiple-selector-dependencies", "inline-code", "input-model", "multiple-selector-demo", "multiple-selector-with-disable-options", "multiple-selector-disabled", "multiple-selector-no-default-select", "multiple-selector-controlled", "multiple-selector-hide-clear-all", "multiple-selector-creatable", "multiple-selector-with-async-search", "multiple-selector-with-async-search-and-onfocus", "multiple-selector-with-async-search-and-creatable", "multiple-selector-with-async-search-and-creatable-and-group", "heading-with-anchor", "multiple-selector-with-sync-search", "multiple-selector-manually-controlled", "multiple-selector-with-group", "use-toast", "multiple-selector-max-selected", "multiple-selector-max-text-length", "multiple-selector-no-placeholder-when-selected", "multiple-selector-fixed-option", "multiple-selector-ref", "multiple-selector-commandprops", "multiple-selector-with-form", "multiple-step-form-demo", "navbar-demo", "circular-navbar", "tab-navbar", "floating-navbar", "sidebar-navbar", "login-card", "kanbanboard", "profile-dropdown", "product-card", "progress-with-value-dependencies", "progress-with-value", "value-position", "custom-label", "responsive-modal-dependencies", "responsive-modal", "responsive-modal-side", "accordion", "skeleton", "skeleton-card", "spinner-dependencies", "spinner-demo", "spinner-size" ], "component_items": [ { "name": "alert-1", "type": "registry:component", "title": "Alert demo", "description": "component for the alert-demo" }, { "name": "alert-2", "type": "registry:component", "title": "Alert 2", "description": "component for the alert-2" }, { "name": "alert-3", "type": "registry:component", "title": "Alert 3", "description": "component for the alert-3" }, { "name": "alert-4", "type": "registry:component", "title": "Alert 4", "description": "component for the alert-4" }, { "name": "animated-card", "type": "registry:component", "title": "Animated Card", "description": "component for the Animated Card" }, { "name": "animated-SVG-chart", "type": "registry:component", "title": "Animated SVG Chart", "description": "component for the Animated SVG Chart" }, { "name": "animated-testimonials", "type": "registry:component", "title": "Animated Testimonials", "description": "component for the Animated Testimonials" }, { "name": "autosize-textarea-dependecies", "type": "registry:component", "title": "Autosize Textarea Dependencies", "description": "component for the Autosize Textarea Dependencies" }, { "name": "autosize-textarea-demo", "type": "registry:component", "title": "Autosize Textarea Demo", "description": "component for the Autosize Textarea" }, { "name": "autosize-textarea-max-height", "type": "registry:component", "title": "Autosize Textarea Max Height", "description": "component for the Autosize Textarea Max Height" }, { "name": "autosize-textarea-ref", "type": "registry:component", "title": "Autosize Textarea Ref", "description": "component for the Autosize Textarea Ref" }, { "name": "autosize-textarea-form", "type": "registry:component", "title": "Autosize Textarea Form", "description": "component for the Autosize Textarea Form" }, { "name": "autosize-textarea-customize", "type": "registry:component", "title": "Autosize Textarea Customize", "description": "component for the Autosize Textarea Customize" }, { "name": "datetime-picker-demo", "type": "registry:component", "title": "Datetime Picker Demo", "description": "component for the Datetime Picker Demo" }, { "name": "datetime-picker-hour-cycle", "type": "registry:component", "title": "Datetime Picker Hour", "description": "component for the Datetime Picker Hour" }, { "name": "datetime-picker-and-time-input", "type": "registry:component", "title": "Datetime Picker and Time Input", "description": "component for the Datetime Picker and Time Input" }, { "name": "datetime-picker-year-range", "type": "registry:component", "title": "Datetime Year Range", "description": "component for the Datetime Year Range" }, { "name": "datetime-picker-locale", "type": "registry:component", "title": "Datetime Picker Locale", "description": "component for the Datetime Picker Locale" }, { "name": "datetime-picker-calendar-settings", "type": "registry:component", "title": "Datetime Picker Calendar Settings", "description": "component for the Datetime Picker Calendar Settings" }, { "name": "datetime-picker-display-format", "type": "registry:component", "title": "Datetime Picker Display Format", "description": "component for the Datetime Picker Display Format" }, { "name": "datetime-picker-placeholder", "type": "registry:component", "title": "Datetime Picker Placeholder", "description": "component for the Datetime Picker Placeholder" }, { "name": "datetime-picker-granularity", "type": "registry:component", "title": "Datetime Picker Granularity", "description": "component for the Datetime Picker Granularity" }, { "name": "datetime-picker-disabled", "type": "registry:component", "title": "Datetime Picker Disabled", "description": "component for the Datetime Picker Disabled" }, { "name": "datetime-picker-ref", "type": "registry:component", "title": "Datetime Picker Ref", "description": "component for the Datetime Picker Ref" }, { "name": "datetime-picker-form", "type": "registry:component", "title": "Datetime Picker Form", "description": "component for the Datetime Picker Form" }, { "name": "dual-range-slider-dependecies", "type": "registry:component", "title": "Dual Range Slider Dependencies", "description": "component for the Dual Range Slider Dependencies" }, { "name": "dual-range-slider-demo", "type": "registry:component", "title": "Dual Range Slider Demo", "description": "component for the Dual Range Slider Demo" }, { "name": "dual-range-slider-custom-label", "type": "registry:component", "title": "Dual Range Slider Custom Label", "description": "component for the Dual Range Slider Custom Label" }, { "name": "dual-range-slider-label-position", "type": "registry:component", "title": "Dual Range Slider Label Position", "description": "component for the Dual Range Slider Label Position" }, { "name": "dual-range-slider-single", "type": "registry:component", "title": "Dual Range Slider Single", "description": "component for the Dual Range Slider Single" }, { "name": "event-badge-3d", "type": "registry:component", "title": "Event Badge 3D", "description": "component for the Event Badge 3D" }, { "name": "event-calendar", "type": "registry:component", "title": "Event Calendar", "description": "component for the Event Calendar" }, { "name": "feedback-demo", "type": "registry:component", "title": "Feedback Demo", "description": "component for the Feedback Demo" }, { "name": "floating-label-input", "type": "registry:component", "title": "Floating Label Input", "description": "component for the Floating Label Input" }, { "name": "floating-label-input-demo", "type": "registry:component", "title": "Floating Label Input Demo", "description": "component for the Floating Label Input Demo" }, { "name": "floating-label-customize", "type": "registry:component", "title": "Floating Label Customize", "description": "component for the Floating Label Customize" }, { "name": "floating-label-form", "type": "registry:component", "title": "Floating Label Form", "description": "component for the Floating Label Form" }, { "name": "footers-demo", "type": "registry:component", "title": "Footers Demo", "description": "component for the Footers Demo" }, { "name": "animated-wave-footer", "type": "registry:component", "title": "Animated Wave Footer", "description": "component for the Animated Wave Footer" }, { "name": "stackedcircular-footer", "type": "registry:component", "title": "Stacked Circular Footer", "description": "component for the Stacked Circular Footer" }, { "name": "floatingparticle-footer", "type": "registry:component", "title": "Floating Particle Footer", "description": "component for the Floating Particle Footer" }, { "name": "footer", "type": "registry:component", "title": "Footer", "description": "component for the Footer" }, { "name": "http-status-code", "type": "registry:component", "title": "HTTP Status Code", "description": "component for the HTTP Status Code" }, { "name": "image-preview", "type": "registry:component", "title": "Image Preview", "description": "component for the Image Preview Dependencies" }, { "name": "image-preview", "type": "registry:component", "title": "Image Preview", "description": "component for the Image Preview" }, { "name": "infinite-scroll-dependecies", "type": "registry:component", "title": "Infinite Scroll Dependencies", "description": "component for the Infinite Scroll Dependencies" }, { "name": "infinite-scroll-demo", "type": "registry:component", "title": "Infinite Scroll Demo", "description": "component for the Infinite Scroll Demo" }, { "name": "loading-button-dependencies", "type": "registry:component", "title": "Loading Button Dependencies", "description": "component for the Loading Button Dependencies" }, { "name": "loading-button-demo", "type": "registry:component", "title": "Loading Button Demo", "description": "component for the Loading Button Demo" }, { "name": "loading-button-usage", "type": "registry:component", "title": "Loading Button Usage", "description": "component for the Loading Button Usage" }, { "name": "loading-button-as-child", "type": "registry:component", "title": "Loading Button As Child", "description": "component for the Loading Button As Child" }, { "name": "multiple-selector-dependencies", "type": "registry:component", "title": "Multiple Selector Dependencies", "description": "component for the Multiple Selector Dependencies" }, { "name": "inline-code", "type": "registry:component", "title": "Inline Code", "description": "component for the Inline Code" }, { "name": "input-model", "type": "registry:component", "title": "Input Model", "description": "component for the Input Model Demo" }, { "name": "multiple-selector-demo", "type": "registry:component", "title": "Multiple Selector Demo", "description": "component for the Multiple Selector Demo" }, { "name": "multiple-selector-with-disable-options", "type": "registry:component", "title": "Multiple Selector With Disable Options", "description": "component for the Multiple Selector With Disable Options" }, { "name": "multiple-selector-disabled", "type": "registry:component", "title": "Multiple Selector Disabled", "description": "component for the Multiple Selector Disabled" }, { "name": "multiple-selector-no-default-select", "type": "registry:component", "title": "Multiple Selector No Default Select", "description": "component for the Multiple Selector No Default Select" }, { "name": "multiple-selector-controlled", "type": "registry:component", "title": "Multiple Selector Controlled", "description": "component for the Multiple Selector Controlled" }, { "name": "multiple-selector-hide-clear-all", "type": "registry:component", "title": "Multiple Selector Hide Clear All", "description": "component for the Multiple Selector Hide Clear All" } ], "component_count": 116, "components_truncated": true, "component_types": { "registry:component": 116 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 166, "name": "@spell", "category": "Animated components", "tags": [ "aesthetic" ], "tagline": "Beautiful, sophisticated UI components designed for modern React and Tailwind CSS applications.", "short_description": "Beautiful, sophisticated UI components designed for modern React and Tailwind CSS applications.", "description": "A growing collection of high-quality animated React UI components for design engineers, built with Tailwind CSS and distributed via the shadcn registry. Notable components seen include Light Rays, Perspective Book, Exploding Input, Spotify Card, Pop Button, Signature, Animated Gradient, and Button variants. Targets design-engineer aesthetic with sophisticated visual effects. Open-source (MIT) with a Discord community. Use for: incorporating distinctive, visually sophisticated interaction patterns — animated inputs, layered card effects, gradient animations — into a React/Next.js project where design quality is a differentiator.", "homepage": "https://spell.sh", "docs": "https://spell.sh/docs/introduction", "github": "https://github.com/xxtomm/spell-ui", "components_github": "https://github.com/xxtomm/spell-ui/tree/main/registry", "github_default_branch": "main", "github_stars": 1022, "last_commit": "2026-06-19T14:03:09Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://spell.sh/r/{name}.json", "registry_index": "https://spell.sh/r/registry.json", "components": [ "chart", "blur-reveal", "perspective-book", "badge", "color-selector", "special-text", "shimmer-text", "highlighted-text", "rich-button", "kbd", "label-input", "spinner", "bars-spinner", "flow-button", "slide-up-text", "copy-button", "text-marquee", "words-stagger", "tilt-card", "marquee", "signature", "randomized-text", "pop-button", "tweet", "spotify-card", "light-rays", "animated-gradient", "animated-checkbox", "exploding-input", "gradient-wave-text", "logos-carousel", "qr-code", "fallback-avatar" ], "component_items": [ { "name": "chart", "type": "registry:component", "title": "Chart", "description": "Interactive line chart with a cursor-tracked tooltip card, snap-to-point hover, and built-in X-axis labels." }, { "name": "blur-reveal", "type": "registry:component", "title": "Blur Reveal", "description": "Animated text reveal with blur effect." }, { "name": "perspective-book", "type": "registry:component", "title": "Perspective Book", "description": "A 3D book component with hover animation and customizable appearance." }, { "name": "badge", "type": "registry:component", "title": "Badge", "description": "A badge component with multiple color variants and sizes." }, { "name": "color-selector", "type": "registry:component", "title": "Color Selector", "description": "Interactive color picker component." }, { "name": "special-text", "type": "registry:component", "title": "Special Text", "description": "Animated text with scramble effect." }, { "name": "shimmer-text", "type": "registry:component", "title": "Shimmer Text", "description": "Text with animated shimmer highlight effect." }, { "name": "highlighted-text", "type": "registry:component", "title": "Highlighted Text", "description": "Text with sliding background highlight animation using mix-blend-mode." }, { "name": "rich-button", "type": "registry:component", "title": "Rich Button", "description": "A button component with rich styling and color variants." }, { "name": "kbd", "type": "registry:component", "title": "Keyboard Shortcuts", "description": "Display keyboard shortcuts with proper key symbols." }, { "name": "label-input", "type": "registry:component", "title": "Label Input", "description": "Input field with floating label and password visibility toggle." }, { "name": "spinner", "type": "registry:component", "title": "Spinner", "description": "A loading spinner component with customizable size and color." }, { "name": "bars-spinner", "type": "registry:component", "title": "Bars Spinner", "description": "A loading spinner with rotating bars animation." }, { "name": "flow-button", "type": "registry:component", "title": "Flow Button", "description": "A button with animated flowing dashed border on hover." }, { "name": "slide-up-text", "type": "registry:component", "title": "Slide Up Text", "description": "Text animation that slides up from bottom with stagger effect." }, { "name": "copy-button", "type": "registry:component", "title": "Copy Button", "description": "A copy-to-clipboard button with blur transition effect." }, { "name": "text-marquee", "type": "registry:component", "title": "Text Marquee", "description": "Animated text marquee component with vertical scrolling." }, { "name": "words-stagger", "type": "registry:component", "title": "Words Stagger", "description": "Word-by-word text animation with blur, transform, and opacity effects." }, { "name": "tilt-card", "type": "registry:component", "title": "Tilt Card", "description": "Interactive 3D tilt card with perspective hover effect and spotlight." }, { "name": "marquee", "type": "registry:component", "title": "Marquee", "description": "Infinite scrolling marquee component with customizable speed and direction." }, { "name": "signature", "type": "registry:component", "title": "Signature", "description": "Animated signature component with handwriting effect using custom fonts." }, { "name": "randomized-text", "type": "registry:component", "title": "Randomized Text", "description": "Text component with randomized character reveal animation." }, { "name": "pop-button", "type": "registry:component", "title": "Pop Button", "description": "A playful 3D-style button with push-down animation effect." }, { "name": "tweet", "type": "registry:component", "title": "Tweet", "description": "Embed Twitter/X posts with custom styling." }, { "name": "spotify-card", "type": "registry:component", "title": "Spotify Card", "description": "Display Spotify tracks with album art and blurred background." }, { "name": "light-rays", "type": "registry:component", "title": "Light Rays", "description": "Animated light rays effect using WebGL shaders." }, { "name": "animated-gradient", "type": "registry:component", "title": "Animated Gradient", "description": "Animated gradient background with presets and customizable swirl effects using WebGL." }, { "name": "animated-checkbox", "type": "registry:component", "title": "Animated Checkbox", "description": "Animated checkbox with spring transitions and strike-through text effect." }, { "name": "exploding-input", "type": "registry:component", "title": "Exploding Input", "description": "Input component that spawns particle effects when typing." }, { "name": "gradient-wave-text", "type": "registry:component", "title": "Gradient Wave Text", "description": "Apple-style animated gradient text with wave effect." }, { "name": "logos-carousel", "type": "registry:component", "title": "Logos Carousel", "description": "Animated carousel component that cycles through sets of logos with staggered animations." }, { "name": "qr-code", "type": "registry:component", "title": "QR Code", "description": "QR code generator with rounded finder patterns and dot-style data modules." }, { "name": "fallback-avatar", "type": "registry:component", "title": "Fallback Avatar", "description": "A unique gradient avatar generated from a name string." } ], "component_count": 33, "components_truncated": false, "component_types": { "registry:component": 33 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 167, "name": "@square-ui", "category": "Dashboard/admin templates", "tags": [ "dashboard" ], "tagline": "Collection of beautifully crafted open-source layouts UI built with shadcn/ui.", "short_description": "Collection of beautifully crafted open-source layouts UI built with shadcn/ui.", "description": "A collection of 16 open-source full-layout application templates built with Next.js, TypeScript, Tailwind CSS, and shadcn/ui. Templates cover: Habit Tracker, Marketing Dashboard, Finance Tracker, Contacts, Inventory, Cookbook, Vault, Rentals, Bookmarks, Chat, Emails, Calendar, and more. Each ships in both Radix UI and Base UI variants. 14 of the 16 templates are paywalled under Square UI Pro ($169); 2 are free on GitHub. Use for: getting a complete, polished application shell — with charts, data tables, navigation, and domain-specific layouts — rather than building page structure from individual blocks.", "homepage": "https://square.lndev.me", "docs": "N/A", "github": "https://github.com/ln-dev7/square-ui", "components_github": null, "github_default_branch": "master", "github_stars": 5931, "last_commit": "2026-06-14T11:49:48Z", "archived": false, "license": null, "open_issues": 0, "registry_template": "https://square.lndev.me/registry/{name}.json", "registry_index": null, "components": [], "component_items": [], "component_count": null, "components_truncated": false, "component_types": {}, "has_logo": true, "enrichment_errors": [ "registry_index_unresolved" ], "featured": true }, { "number": 168, "name": "@stepper", "category": "Niche/single-purpose", "tags": [ "components" ], "tagline": "A modern, accessible and composable Stepper component for React and Tailwind CSS. Built for shadcn/ui-style workflows with registry-first distribution.", "short_description": "A modern, accessible and composable Stepper component for React and Tailwind CSS. Built for shadcn/ui-style workflows with registry-first distribution.", "description": "A single, focused shadcn/ui-style registry primitive for multi-step flows in React, Next.js, and Tailwind CSS projects. Headless and stateful: provides typed, value-safe step primitives (Stepper, StepperContent, StepperItem, StepperIndicator, StepperLabel, StepperList, StepperTrigger) with built-in ARIA attributes, guard support, and a predictable state machine. Does not own form state, routing, or validation — your app drives the flow. Installed as owned source via shadcn CLI. Currently in beta; open-source MIT. Use for: building accessible, typed multi-step wizards or onboarding flows in a shadcn/ui project without coupling to a heavyweight form-wizard library.", "homepage": "https://francozeta-stepper.vercel.app", "docs": "https://francozeta-stepper.vercel.app/docs", "github": "https://github.com/francozeta/stepper", "components_github": "https://github.com/francozeta/stepper/tree/main/registry", "github_default_branch": "main", "github_stars": 6, "last_commit": "2026-07-06T15:11:42Z", "archived": false, "license": "MIT", "open_issues": 5, "registry_template": "https://francozeta-stepper.vercel.app/{name}.json", "registry_index": "https://francozeta-stepper.vercel.app/registry.json", "components": [ "stepper", "stepper-demo", "stepper-intent-onboarding" ], "component_items": [ { "name": "stepper", "type": "registry:ui", "title": "Stepper", "description": "A lightweight, composable stepper primitive for shadcn/ui-style multi-step flows." }, { "name": "stepper-demo", "type": "registry:block", "title": "Stepper Demo", "description": "A styled Stepper demo with a default export and the Stepper source primitive." }, { "name": "stepper-intent-onboarding", "type": "registry:block", "title": "Stepper Intent Onboarding", "description": "An intent-driven onboarding block with hidden Stepper state, intent routing, profile validation, interests, async setup, and a signed-in completion state." } ], "component_count": 3, "components_truncated": false, "component_types": { "registry:ui": 1, "registry:block": 2 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 169, "name": "@supabase", "category": "Component library (general)", "tags": [ "components" ], "tagline": "A collection of React components and blocks built on the shadcn/ui library that connect your front-end to your Supabase back-end via a single command.", "short_description": "A collection of React components and blocks built on the shadcn/ui library that connect your front-end to your Supabase back-end via a single command.", "description": "Official Supabase UI registry — shadcn/ui-compatible components that wire your Next.js front-end directly to Supabase services. Includes password-based auth (sign-in/sign-up), social auth, current-user avatar, realtime avatar stack, realtime chat, realtime cursor, realtime Monaco editor, realtime flow, dropzone for Storage uploads, and an infinite-query helper. Built with React, Next.js (App Router), Tailwind CSS, and the Supabase JS client. Fully free and open source. Use for: any Next.js + Supabase project that needs pre-wired auth flows, realtime collaboration widgets, or Storage upload components without writing the Supabase client integration from scratch.", "homepage": "https://supabase.com/ui", "docs": "https://supabase.com/ui/docs/getting-started/introduction", "github": "https://github.com/supabase/supabase", "components_github": null, "github_default_branch": "master", "github_stars": 105895, "last_commit": "2026-07-08T08:40:58Z", "archived": false, "license": "Apache-2.0", "open_issues": 1076, "registry_template": "https://supabase.com/ui/r/{name}.json", "registry_index": "https://supabase.com/ui/r/registry.json", "components": [ "password-based-auth-nextjs", "password-based-auth-react", "password-based-auth-react-router", "password-based-auth-tanstack", "social-auth-nextjs", "social-auth-react", "social-auth-react-router", "social-auth-tanstack", "dropzone-nextjs", "dropzone-react", "dropzone-react-router", "dropzone-tanstack", "realtime-cursor-nextjs", "realtime-cursor-react", "realtime-cursor-react-router", "realtime-cursor-tanstack", "current-user-avatar-nextjs", "current-user-avatar-react", "current-user-avatar-react-router", "current-user-avatar-tanstack", "realtime-avatar-stack-nextjs", "realtime-avatar-stack-react", "realtime-avatar-stack-react-router", "realtime-avatar-stack-tanstack", "realtime-chat-nextjs", "realtime-chat-react", "realtime-chat-react-router", "realtime-chat-tanstack", "realtime-flow-nextjs", "realtime-flow-react", "realtime-flow-react-router", "realtime-flow-tanstack", "realtime-monaco-nextjs", "realtime-monaco-react", "realtime-monaco-react-router", "realtime-monaco-tanstack", "infinite-query-hook", "tanstack-db-nextjs", "supabase-client-nextjs", "supabase-client-react", "supabase-client-react-router", "supabase-client-tanstack", "platform-kit-nextjs", "supabase-client-nuxtjs", "supabase-client-vue", "password-based-auth-nuxtjs", "password-based-auth-vue", "social-auth-vue", "social-auth-nuxtjs", "dropzone-nuxtjs", "dropzone-vue", "realtime-cursor-nuxtjs", "realtime-cursor-vue", "current-user-avatar-nuxtjs", "current-user-avatar-vue", "realtime-avatar-stack-nuxtjs", "realtime-avatar-stack-vue", "realtime-chat-nuxtjs", "realtime-chat-vue", "infinite-query-composable", "ai-editor-rules" ], "component_items": [ { "name": "password-based-auth-nextjs", "type": "registry:block", "title": "Password Based Auth flow for Nextjs and Supabase", "description": "Password Based Auth flow for Nextjs and Supabase" }, { "name": "password-based-auth-react", "type": "registry:block", "title": "Password Based Auth flow for React and Supabase", "description": "Password Based Auth flow for React and Supabase" }, { "name": "password-based-auth-react-router", "type": "registry:block", "title": "Password Based Auth flow for React Router and Supabase", "description": "Password Based Auth flow for React Router and Supabase" }, { "name": "password-based-auth-tanstack", "type": "registry:block", "title": "Password Based Auth flow for tanstack and Supabase", "description": "Password Based Auth flow for tanstack and Supabase" }, { "name": "social-auth-nextjs", "type": "registry:block", "title": "Social Auth flow for Nextjs and Supabase", "description": "Social Auth flow for Nextjs and Supabase" }, { "name": "social-auth-react", "type": "registry:block", "title": "Social Auth flow for React and Supabase", "description": "Social Auth flow for React and Supabase" }, { "name": "social-auth-react-router", "type": "registry:block", "title": "Social Auth flow for React Router and Supabase", "description": "Social Auth flow for React Router and Supabase" }, { "name": "social-auth-tanstack", "type": "registry:block", "title": "Social Auth flow for TanStack and Supabase", "description": "Social Auth flow for TanStack and Supabase" }, { "name": "dropzone-nextjs", "type": "registry:component", "title": "Dropzone (File Upload)", "description": "Displays a control for easier uploading of files directly to Supabase Storage." }, { "name": "dropzone-react", "type": "registry:component", "title": "Dropzone (File Upload)", "description": "Displays a control for easier uploading of files directly to Supabase Storage." }, { "name": "dropzone-react-router", "type": "registry:component", "title": "Dropzone (File Upload)", "description": "Displays a control for easier uploading of files directly to Supabase Storage." }, { "name": "dropzone-tanstack", "type": "registry:component", "title": "Dropzone (File Upload)", "description": "Displays a control for easier uploading of files directly to Supabase Storage." }, { "name": "realtime-cursor-nextjs", "type": "registry:component", "title": "Realtime Cursor", "description": "Component which renders realtime cursors from other users in a room." }, { "name": "realtime-cursor-react", "type": "registry:component", "title": "Realtime Cursor", "description": "Component which renders realtime cursors from other users in a room." }, { "name": "realtime-cursor-react-router", "type": "registry:component", "title": "Realtime Cursor", "description": "Component which renders realtime cursors from other users in a room." }, { "name": "realtime-cursor-tanstack", "type": "registry:component", "title": "Realtime Cursor", "description": "Component which renders realtime cursors from other users in a room." }, { "name": "current-user-avatar-nextjs", "type": "registry:component", "title": "Current User Avatar", "description": "Component which renders the current user's avatar." }, { "name": "current-user-avatar-react", "type": "registry:component", "title": "Current User Avatar", "description": "Component which renders the current user's avatar." }, { "name": "current-user-avatar-react-router", "type": "registry:component", "title": "Current User Avatar", "description": "Component which renders the current user's avatar." }, { "name": "current-user-avatar-tanstack", "type": "registry:component", "title": "Current User Avatar", "description": "Component which renders the current user's avatar." }, { "name": "realtime-avatar-stack-nextjs", "type": "registry:component", "title": "Avatar Stack with Realtime Presence", "description": "Component which stack of avatars, tracked by realtime presence." }, { "name": "realtime-avatar-stack-react", "type": "registry:component", "title": "Avatar Stack with Realtime Presence", "description": "Component which stack of avatars, tracked by realtime presence." }, { "name": "realtime-avatar-stack-react-router", "type": "registry:component", "title": "Avatar Stack with Realtime Presence", "description": "Component which stack of avatars, tracked by realtime presence." }, { "name": "realtime-avatar-stack-tanstack", "type": "registry:component", "title": "Avatar Stack with Realtime Presence", "description": "Component which stack of avatars, tracked by realtime presence." }, { "name": "realtime-chat-nextjs", "type": "registry:component", "title": "Realtime Chat", "description": "Component which renders realtime chat messages from other users in a room." }, { "name": "realtime-chat-react", "type": "registry:component", "title": "Realtime Chat", "description": "Component which renders realtime chat messages from other users in a room." }, { "name": "realtime-chat-react-router", "type": "registry:component", "title": "Realtime Chat", "description": "Component which renders realtime chat messages from other users in a room." }, { "name": "realtime-chat-tanstack", "type": "registry:component", "title": "Realtime Chat", "description": "Component which renders realtime chat messages from other users in a room." }, { "name": "realtime-flow-nextjs", "type": "registry:component", "title": "Realtime Flow", "description": "Real-time flow diagram editor for collaborative applications." }, { "name": "realtime-flow-react", "type": "registry:component", "title": "Realtime Flow", "description": "Real-time flow diagram editor for collaborative applications." }, { "name": "realtime-flow-react-router", "type": "registry:component", "title": "Realtime Flow", "description": "Real-time flow diagram editor for collaborative applications." }, { "name": "realtime-flow-tanstack", "type": "registry:component", "title": "Realtime Flow", "description": "Real-time flow diagram editor for collaborative applications." }, { "name": "realtime-monaco-nextjs", "type": "registry:component", "title": "Realtime Monaco", "description": "Real-time Monaco editor for collaborative applications." }, { "name": "realtime-monaco-react", "type": "registry:component", "title": "Realtime Monaco", "description": "Real-time Monaco editor for collaborative applications." }, { "name": "realtime-monaco-react-router", "type": "registry:component", "title": "Realtime Monaco", "description": "Real-time Monaco editor for collaborative applications." }, { "name": "realtime-monaco-tanstack", "type": "registry:component", "title": "Realtime Monaco", "description": "Real-time Monaco editor for collaborative applications." }, { "name": "infinite-query-hook", "type": "registry:block", "title": "Infinite Query Hook", "description": "React hook for infinite lists, fetching data from Supabase." }, { "name": "tanstack-db-nextjs", "type": "registry:block", "title": "TanStack DB for Next.js and Supabase", "description": "TanStack DB integration with Supabase collections for type-safe database operations" }, { "name": "supabase-client-nextjs", "type": "registry:lib", "title": "Supabase Client for Next.js", "description": null }, { "name": "supabase-client-react", "type": "registry:lib", "title": "Supabase Client for React", "description": null }, { "name": "supabase-client-react-router", "type": "registry:lib", "title": "Supabase Client for React Router", "description": null }, { "name": "supabase-client-tanstack", "type": "registry:lib", "title": "Supabase Client for TanStack Start", "description": null }, { "name": "platform-kit-nextjs", "type": "registry:block", "title": "Platform Kit for Nextjs and Supabase", "description": "Platform Kit for Nextjs and Supabase" }, { "name": "supabase-client-nuxtjs", "type": "registry:lib", "title": "Supabase Client for Nuxt.js", "description": null }, { "name": "supabase-client-vue", "type": "registry:lib", "title": "Supabase Client for Vue", "description": null }, { "name": "password-based-auth-nuxtjs", "type": "registry:block", "title": "Password Based Auth flow for Nuxt.js and Supabase", "description": "Password Based Auth flow for Nuxt.js and Supabase" }, { "name": "password-based-auth-vue", "type": "registry:block", "title": "Password Based Auth flow for Vue and Supabase", "description": "Password Based Auth flow for Vue and Supabase" }, { "name": "social-auth-vue", "type": "registry:block", "title": "Social Auth flow for Vue and Supabase", "description": "Social Auth flow for Vue and Supabase" }, { "name": "social-auth-nuxtjs", "type": "registry:block", "title": "Social Auth flow for Nuxt and Supabase", "description": "Social Auth flow for Nuxt and Supabase" }, { "name": "dropzone-nuxtjs", "type": "registry:block", "title": "Dropzone (File Upload) for Nuxt and Supabase", "description": "Displays a control for easier uploading of files directly to Supabase Storage." }, { "name": "dropzone-vue", "type": "registry:block", "title": "Dropzone (File Upload) for Vue and Supabase", "description": "Displays a control for easier uploading of files directly to Supabase Storage." }, { "name": "realtime-cursor-nuxtjs", "type": "registry:component", "title": "Realtime Cursor for Nuxt and Supabase", "description": "Component which renders realtime cursors from other users in a room." }, { "name": "realtime-cursor-vue", "type": "registry:component", "title": "Realtime Cursor for Vue and Supabase", "description": "Component which renders realtime cursors from other users in a room." }, { "name": "current-user-avatar-nuxtjs", "type": "registry:block", "title": "Current User Avatar", "description": "Component which renders the current user's avatar." }, { "name": "current-user-avatar-vue", "type": "registry:block", "title": "Current User Avatar", "description": "Component which renders the current user's avatar." }, { "name": "realtime-avatar-stack-nuxtjs", "type": "registry:block", "title": "Realtime Avatar Stack", "description": "Component which stack of avatars, tracked by realtime presence." }, { "name": "realtime-avatar-stack-vue", "type": "registry:block", "title": "Realtime Avatar Stack", "description": "Component which stack of avatars, tracked by realtime presence." }, { "name": "realtime-chat-nuxtjs", "type": "registry:block", "title": "Realtime Chat", "description": "Component which provides a realtime chat interface." }, { "name": "realtime-chat-vue", "type": "registry:block", "title": "Realtime Chat", "description": "Component which provides a realtime chat interface." }, { "name": "infinite-query-composable", "type": "registry:component", "title": "Infinite Query for Vue and Supabase", "description": "Vue Composable for infinite lists, fetching data from Supabase." } ], "component_count": 61, "components_truncated": false, "component_types": { "registry:block": 23, "registry:component": 31, "registry:lib": 6, "registry:file": 1 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 170, "name": "@svgl", "category": "Icons/logos", "tags": [ "components" ], "tagline": "A beautiful library with SVG logos.", "short_description": "A beautiful library with SVG logos.", "description": "A searchable library of high-quality, web-optimized SVG brand logos served via a public REST API and shadcn/ui-compatible registry. Houses hundreds of tech, framework, cloud, and company logos (React, Vercel, AWS, etc.) organized by category. Built with SvelteKit + Svelte 5, Hono, Tailwind CSS, and Upstash Redis for rate-limiting. Extensions available for VS Code, Raycast, Figma, PowerToys, and CLI. Free and open source. Use for: dropping brand/tech logos into any project without hunting down individual SVG files or worrying about licensing and optimization.", "homepage": "https://svgl.app", "docs": "https://svgl.app/docs/api", "github": "https://github.com/pheralb/svgl", "components_github": "https://github.com/pheralb/svgl/tree/main/src/components", "github_default_branch": "main", "github_stars": 6173, "last_commit": "2026-07-05T22:32:12Z", "archived": false, "license": "MIT", "open_issues": 294, "registry_template": "https://svgl.app/r/{name}.json", "registry_index": "https://svgl.app/r/registry.json", "components": [ "plausible-analytics", "ivy-framework", "zaia-endless", "langchain", "granola", "nvidia", "proton-mail", "proton-vpn", "google-classroom", "google-antigravity", "kimi", "zyft", "perspective", "windsurf", "mattermost", "inngest", "daisyui", "paypal", "google-drive", "amazon-q", "mulesoft", "uv", "milanote", "together-ai", "suno", "groq", "cohere", "ollama", "cisco", "animate", "apolloio", "blender", "lua", "mercado-libre", "mercado-pago", "basewell", "ahooks", "discord", "aliexpress", "preact", "react", "svelte", "vue", "vuetify", "nuxt", "nuxt-ui", "nuxt-content", "nuxt-studio", "nuxthub", "docus", "visual-studio-code", "ton", "locofy", "runway", "yarn", "jwt", "strapi", "figma", "spotify", "workos", "whop", "postman", "discordjs", "opensea", "algolia", "bootstrap", "facebook", "twitter", "esbuild", "deno", "gatsby", "npm", "nuget", "homebrew", "sublime-text", "turborepo", "tailwind-css", "wakatime", "styled-components", "angular", "blitz", "lit", "atom", "youtube", "astro", "google", "google-play", "framer", "netflix", "firefox", "linkedin", "telegram", "matrix", "whatsapp", "headless-ui", "kotlin", "storybook", "netlify", "solidjs", "mongodb" ], "component_items": [ { "name": "plausible-analytics", "type": "registry:component", "title": "plausible-analytics", "description": null }, { "name": "ivy-framework", "type": "registry:component", "title": "ivy-framework", "description": null }, { "name": "zaia-endless", "type": "registry:component", "title": "zaia-endless", "description": null }, { "name": "langchain", "type": "registry:component", "title": "langchain", "description": null }, { "name": "granola", "type": "registry:component", "title": "granola", "description": null }, { "name": "nvidia", "type": "registry:component", "title": "nvidia", "description": null }, { "name": "proton-mail", "type": "registry:component", "title": "proton-mail", "description": null }, { "name": "proton-vpn", "type": "registry:component", "title": "proton-vpn", "description": null }, { "name": "google-classroom", "type": "registry:component", "title": "google-classroom", "description": null }, { "name": "google-antigravity", "type": "registry:component", "title": "google-antigravity", "description": null }, { "name": "kimi", "type": "registry:component", "title": "kimi", "description": null }, { "name": "zyft", "type": "registry:component", "title": "zyft", "description": null }, { "name": "perspective", "type": "registry:component", "title": "perspective", "description": null }, { "name": "windsurf", "type": "registry:component", "title": "windsurf", "description": null }, { "name": "mattermost", "type": "registry:component", "title": "mattermost", "description": null }, { "name": "inngest", "type": "registry:component", "title": "inngest", "description": null }, { "name": "daisyui", "type": "registry:component", "title": "daisyui", "description": null }, { "name": "paypal", "type": "registry:component", "title": "paypal", "description": null }, { "name": "google-drive", "type": "registry:component", "title": "google-drive", "description": null }, { "name": "amazon-q", "type": "registry:component", "title": "amazon-q", "description": null }, { "name": "mulesoft", "type": "registry:component", "title": "mulesoft", "description": null }, { "name": "uv", "type": "registry:component", "title": "uv", "description": null }, { "name": "milanote", "type": "registry:component", "title": "milanote", "description": null }, { "name": "together-ai", "type": "registry:component", "title": "together-ai", "description": null }, { "name": "suno", "type": "registry:component", "title": "suno", "description": null }, { "name": "groq", "type": "registry:component", "title": "groq", "description": null }, { "name": "cohere", "type": "registry:component", "title": "cohere", "description": null }, { "name": "ollama", "type": "registry:component", "title": "ollama", "description": null }, { "name": "cisco", "type": "registry:component", "title": "cisco", "description": null }, { "name": "animate", "type": "registry:component", "title": "animate", "description": null }, { "name": "apolloio", "type": "registry:component", "title": "apolloio", "description": null }, { "name": "blender", "type": "registry:component", "title": "blender", "description": null }, { "name": "lua", "type": "registry:component", "title": "lua", "description": null }, { "name": "mercado-libre", "type": "registry:component", "title": "mercado-libre", "description": null }, { "name": "mercado-pago", "type": "registry:component", "title": "mercado-pago", "description": null }, { "name": "basewell", "type": "registry:component", "title": "basewell", "description": null }, { "name": "ahooks", "type": "registry:component", "title": "ahooks", "description": null }, { "name": "discord", "type": "registry:component", "title": "discord", "description": null }, { "name": "aliexpress", "type": "registry:component", "title": "aliexpress", "description": null }, { "name": "preact", "type": "registry:component", "title": "preact", "description": null }, { "name": "react", "type": "registry:component", "title": "react", "description": null }, { "name": "svelte", "type": "registry:component", "title": "svelte", "description": null }, { "name": "vue", "type": "registry:component", "title": "vue", "description": null }, { "name": "vuetify", "type": "registry:component", "title": "vuetify", "description": null }, { "name": "nuxt", "type": "registry:component", "title": "nuxt", "description": null }, { "name": "nuxt-ui", "type": "registry:component", "title": "nuxt-ui", "description": null }, { "name": "nuxt-content", "type": "registry:component", "title": "nuxt-content", "description": null }, { "name": "nuxt-studio", "type": "registry:component", "title": "nuxt-studio", "description": null }, { "name": "nuxthub", "type": "registry:component", "title": "nuxthub", "description": null }, { "name": "docus", "type": "registry:component", "title": "docus", "description": null }, { "name": "visual-studio-code", "type": "registry:component", "title": "visual-studio-code", "description": null }, { "name": "ton", "type": "registry:component", "title": "ton", "description": null }, { "name": "locofy", "type": "registry:component", "title": "locofy", "description": null }, { "name": "runway", "type": "registry:component", "title": "runway", "description": null }, { "name": "yarn", "type": "registry:component", "title": "yarn", "description": null }, { "name": "jwt", "type": "registry:component", "title": "jwt", "description": null }, { "name": "strapi", "type": "registry:component", "title": "strapi", "description": null }, { "name": "figma", "type": "registry:component", "title": "figma", "description": null }, { "name": "spotify", "type": "registry:component", "title": "spotify", "description": null }, { "name": "workos", "type": "registry:component", "title": "workos", "description": null } ], "component_count": 665, "components_truncated": true, "component_types": { "registry:component": 665 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 171, "name": "@systaliko-ui", "category": "Animated components", "tags": [ "aesthetic" ], "tagline": "UI component library, Designed for flexibility, built for customization, and crafted to scale across variants and use cases.", "short_description": "UI component library, Designed for flexibility, built for customization, and crafted to scale across variants and use cases.", "description": "A beta shadcn/ui registry offering UI components, layout blocks, and utilities built for flexibility and multi-variant scaling. Categories observed include cards (curtain reveal, flip, hover reveal, testimonial, stack), full-screen navigation menus, globes, grid bentos, image players, shaders, slideshows, timelines, spotlight lists, custom cursors, rating stars, and reveal masks. Built with React, Next.js, and Tailwind CSS. Open source under MIT; currently in beta. Use for: projects that need creative, heavily-animated page sections and cards beyond the standard shadcn/ui component set.", "homepage": "https://systaliko-ui.vercel.app", "docs": "https://systaliko-ui.vercel.app/docs", "github": "https://github.com/YoucefBnm/systaliko-ui", "components_github": "https://github.com/YoucefBnm/systaliko-ui/tree/main/registry", "github_default_branch": "main", "github_stars": 23, "last_commit": "2026-05-13T20:34:18Z", "archived": false, "license": "MIT", "open_issues": 1, "registry_template": "https://systaliko-ui.vercel.app/r/{name}.json", "registry_index": "https://systaliko-ui.vercel.app/r/registry.json", "components": [ "index", "animated-menu", "container-stagger", "full-screen-navigation-menu", "globe", "grid-bento", "header", "image-player", "shader", "slideshow", "story", "timeline", "card", "card-curtain-reveal", "card-flip", "card-hover-reveal", "card-testimonial", "cards-stack", "cards-stack-rotated", "checkbox-field", "custom-cursor", "pulse", "rating-stars", "reveal-mask", "spotlight-list", "animated-menu-demo", "animated-menu-2-demo", "animated-menu-full-screen-demo", "container-stagger-demo", "container-stagger-2-demo", "full-screen-navigation-menu-demo", "globe-demo", "grid-bento-demo", "grid-bento-four-cells-demo", "grid-bento-three-cells-demo", "header-demo", "image-player-demo", "shader-demo", "shader-hurricane-demo", "slideshow-demo", "story-demo", "timeline-demo", "card-curtain-reveal-demo", "card-flip-demo", "card-hover-reveal-demo", "card-hover-reveal-full-demo", "card-testimonial-demo", "card-testimonial-2-demo", "cards-stack-demo", "cards-stack-achievements-demo", "cards-stack-rotated-demo", "cards-stack-rotated-recognitions-demo", "cards-stack-full-demo", "hover-preview-demo", "checkbox-field-demo", "custom-cursor-demo", "custom-cursor-2-demo", "rating-stars-demo", "reveal-mask-demo", "spotlight-list-demo", "spotlight-list-2-demo", "custom-pricing-design-demo", "expandable-grid-demo", "image-zoom-demo", "infinite-scroll-demo", "price-demo", "pricing-demo", "pricing-2-demo", "product-carousel-demo", "product-carousel-2-demo", "product-carousel-3-demo", "quantity-demo", "toggle-layout-demo", "circle-cards-demo", "distributed-cards-demo", "distributed-cards-2-demo", "parallax-demo", "scroll-animation-combo-demo", "scroll-animation-inset-demo", "scroll-animation-inset-x-demo", "scroll-animation-inset-y-demo", "scroll-animation-radius-demo", "scroll-animation-rotate-demo", "scroll-animation-rotate-x-demo", "scroll-animation-rotate-y-demo", "scroll-animation-scale-demo", "scroll-animation-translate-x-demo", "scroll-autoplay-demo", "scroll-reverse-scale-animation-demo", "scroll-x-carousel-demo", "scroll-x-carousel-reverse-demo", "team-demo", "wavy-block-demo", "wavy-block-y-demo", "sliding-number-demo", "text-scroll-read-demo", "text-stagger-hover-demo", "text-stagger-interval-demo", "text-stagger-inview-demo", "text-stagger-inview-waves-demo" ], "component_items": [ { "name": "index", "type": "registry:style", "title": null, "description": null }, { "name": "animated-menu", "type": "registry:block", "title": "Animated Menu", "description": "Animated menu, with orchestrated children animation, fully customizable." }, { "name": "container-stagger", "type": "registry:block", "title": "Stagger Animations", "description": "Animated Block with orchestrated stagger animations, for your motion components, the animations are triggered by view." }, { "name": "full-screen-navigation-menu", "type": "registry:block", "title": "Full screen navigation menu", "description": "Transforming Shadcn navigation menu into a full screen menu." }, { "name": "globe", "type": "registry:block", "title": "Globe", "description": "Globe map with optional map pins." }, { "name": "grid-bento", "type": "registry:block", "title": "Grid Bento", "description": "Bento Grid, layout with multiple variants and displays." }, { "name": "header", "type": "registry:block", "title": "Header", "description": "Responsive Header, with a logo and navigation links, supporting both desktop and mobile layouts, and toggles on scroll." }, { "name": "image-player", "type": "registry:block", "title": "Image Player", "description": "Create your own image player GIF/video, with image player component." }, { "name": "shader", "type": "registry:block", "title": "Shader", "description": "Shader component with two variants for gradient and hurricane both can be configured." }, { "name": "slideshow", "type": "registry:block", "title": "Slideshow", "description": "Display the active image and activate the next image with hovering the text indicator." }, { "name": "story", "type": "registry:block", "title": "Story", "description": "Simillar to IG story, Story is a component that allows you to display a collection of components in a single view." }, { "name": "timeline", "type": "registry:block", "title": "Timeline", "description": "Timeline, where you can showcase history (like your work) or a process (like a project)." }, { "name": "card", "type": "registry:ui", "title": "Card", "description": "Card component with variants." }, { "name": "card-curtain-reveal", "type": "registry:ui", "title": "Curtain Reveal Card", "description": "Interactive card component with open curtain to see content on hover gesture." }, { "name": "card-flip", "type": "registry:ui", "title": "3d Flip Card", "description": "An interactive card component that flips on hover with smooth 3D transitions." }, { "name": "card-hover-reveal", "type": "registry:ui", "title": "Hover Reveal Details Card", "description": "Animated card with gesture animations, Reveals hidden content and scale main image on hover." }, { "name": "card-testimonial", "type": "registry:ui", "title": "Card Testimonial", "description": "Card Testimonial, with rating, block quote, and author's informations." }, { "name": "cards-stack", "type": "registry:block", "title": "Cards Stack", "description": "Stack of cards to showcase a related set of element, like your services, your work, features, process of work, timeline, etc." }, { "name": "cards-stack-rotated", "type": "registry:block", "title": "Cards Stack Rotated", "description": "Stack of cards rotated by a defined index value to rotate in sequence, it show one card at a time depending on the scroll position." }, { "name": "checkbox-field", "type": "registry:ui", "title": "checkbox-field", "description": "Checkbox field with label." }, { "name": "custom-cursor", "type": "registry:ui", "title": "Custom Cursor", "description": "Turn your cursor into any element your want, text, image, video, or a shape." }, { "name": "pulse", "type": "registry:ui", "title": "Pulse", "description": "Pulse effect for attracting user attention." }, { "name": "rating-stars", "type": "registry:ui", "title": "Rating Stars", "description": "Stars rating component with customizable color, depending on average rating." }, { "name": "reveal-mask", "type": "registry:ui", "title": "reveal mask", "description": "reveal mask animation effect." }, { "name": "spotlight-list", "type": "registry:ui", "title": "spotlight-list", "description": "Spotlight list, when hovering an item it will highlight it by decreasing the visiblity of the other items." }, { "name": "animated-menu-demo", "type": "registry:block", "title": "Animated Menu Demo", "description": "Demo showing animated menu component." }, { "name": "animated-menu-2-demo", "type": "registry:block", "title": "Animated Menu 2 Demo", "description": "another demo showing animated menu component." }, { "name": "animated-menu-full-screen-demo", "type": "registry:block", "title": "Animated Menu Demo", "description": "another demo showing animated menu component in full screen mode." }, { "name": "container-stagger-demo", "type": "registry:block", "title": "Stagger Container Demo", "description": "Demo showing stagger container component." }, { "name": "container-stagger-2-demo", "type": "registry:block", "title": "Container Stagger Demo", "description": "Demo showing another use case for container stagger with your motion components." }, { "name": "full-screen-navigation-menu-demo", "type": "registry:block", "title": "Full screen navigation Demo", "description": "Demo showing Full screen navigation component." }, { "name": "globe-demo", "type": "registry:block", "title": "Globe Demo", "description": "Demo showing Globe component." }, { "name": "grid-bento-demo", "type": "registry:block", "title": "Grid Bento Demos", "description": "Grid Bento Demo with multiple variants." }, { "name": "grid-bento-four-cells-demo", "type": "registry:block", "title": "Grid Bento Demos", "description": "Grid Bento Demo with multiple variants." }, { "name": "grid-bento-three-cells-demo", "type": "registry:block", "title": "Grid Bento Three Cells Demo", "description": "Demo showing another variant of grid bento component." }, { "name": "header-demo", "type": "registry:block", "title": "Header Demo", "description": "Demo showing Header component." }, { "name": "image-player-demo", "type": "registry:block", "title": "Image Player Demo", "description": "Demo showing how to use image player component." }, { "name": "shader-demo", "type": "registry:block", "title": "Shader Demo", "description": "Demo showing shader component." }, { "name": "shader-hurricane-demo", "type": "registry:block", "title": "Shader Hurricane Demo", "description": "Demo showing hurricane shader component." }, { "name": "slideshow-demo", "type": "registry:block", "title": "Slideshow Demo", "description": "Demo showing how to use slideshow component." }, { "name": "story-demo", "type": "registry:block", "title": "Story Demo", "description": "Demo showing how to use story component." }, { "name": "timeline-demo", "type": "registry:block", "title": "Timeline Demo", "description": "Demo showing timeline component." }, { "name": "card-curtain-reveal-demo", "type": "registry:ui", "title": "Card Curtain Reveal Demo", "description": "Demo showing Card Curtain Reveal Component." }, { "name": "card-flip-demo", "type": "registry:ui", "title": "Flip Card Demo", "description": "Demo showing Flip Card Component." }, { "name": "card-hover-reveal-demo", "type": "registry:ui", "title": "Card Hover Reveal Demo", "description": "Demo showing Card Hover Reveal Component." }, { "name": "card-hover-reveal-full-demo", "type": "registry:ui", "title": "Card Hover Reveal Full Demo", "description": "Demo showing another usecase of Card Hover Reveal Component." }, { "name": "card-testimonial-demo", "type": "registry:ui", "title": "Card Testimonial Demo", "description": "Demo showing Card Testimonial Component." }, { "name": "card-testimonial-2-demo", "type": "registry:ui", "title": "Card Testimonial Demo", "description": "Demo showing Card Testimonial Component." }, { "name": "cards-stack-demo", "type": "registry:block", "title": "Sticky Cards stack Demo", "description": "Demo of sticky cards stack." }, { "name": "cards-stack-achievements-demo", "type": "registry:block", "title": "Stack small cards Demo", "description": "Demo showing different usecase of Cards Stack component with smaller cards." }, { "name": "cards-stack-rotated-demo", "type": "registry:block", "title": "Cards Stack Rotated Demo", "description": "Demo showing Cards Stack Rotated component." }, { "name": "cards-stack-rotated-recognitions-demo", "type": "registry:block", "title": "Stack small cards Demo", "description": "Demo showing different usecase of Cards Rotated Stack component." }, { "name": "cards-stack-full-demo", "type": "registry:block", "title": "Cards stack full screen Demo", "description": "Demo showing different usecase of Cards Stack component." }, { "name": "hover-preview-demo", "type": "registry:ui", "title": "Hover Preview Demo", "description": "Demo showing usage of hover preview component." }, { "name": "checkbox-field-demo", "type": "registry:ui", "title": "Input Field Demo", "description": "Demo showing Input field component." }, { "name": "custom-cursor-demo", "type": "registry:ui", "title": "Custom Cursor Demo", "description": "Demo showing Custom Cursor component." }, { "name": "custom-cursor-2-demo", "type": "registry:ui", "title": "Custom Cursor 2 Demo", "description": "Demo showing another usecase of Custom Cursor component." }, { "name": "rating-stars-demo", "type": "registry:ui", "title": "Rating stars Demo", "description": "Demo showing Rating stars component." }, { "name": "reveal-mask-demo", "type": "registry:ui", "title": "Reveal Mask Demo", "description": "Demo showing Reveal mask component." }, { "name": "spotlight-list-demo", "type": "registry:ui", "title": "Spotlight List Demo", "description": "Demo showing Spotlight list component." } ], "component_count": 155, "components_truncated": true, "component_types": { "registry:style": 1, "registry:block": 85, "registry:ui": 57, "registry:hook": 6, "registry:item": 4, "registry:lib": 2 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 172, "name": "@tailark", "category": "Blocks & sections (marketing/SaaS)", "tags": [ "saas" ], "tagline": "Shadcn blocks designed for building modern marketing websites.", "short_description": "Shadcn blocks designed for building modern marketing websites.", "description": "A production-ready block library for modern marketing websites, shipping two distinct style kits: Dusk (dark-mode-first, elegant) and Mist (light-mode, Notion-like). Blocks are built with shadcn/ui, Tailwind CSS, Next.js, and TypeScript, covering hero sections, features, pricing, footers, and page-level compositions. All blocks are fully open source (MIT) with no proprietary design system lock-in — raw TSX you paste into your codebase. Use for: founders and teams who need polished, theme-consistent marketing page sections for dark or light sites without writing layout code from scratch.", "homepage": "https://tailark.com", "docs": "https://tailark.com/docs", "github": "https://github.com/tailark/blocks", "components_github": null, "github_default_branch": "main", "github_stars": 2248, "last_commit": "2026-05-14T20:42:19Z", "archived": false, "license": "MIT", "open_issues": 13, "registry_template": "https://tailark.com/r/{name}.json", "registry_index": "https://tailark.com/r/registry.json", "components": [ "call-to-action-1", "call-to-action-2", "call-to-action-3", "comparator-1", "content-1", "content-2", "content-3", "content-4", "content-5", "content-6", "content-7", "faqs-1", "faqs-2", "faqs-3", "faqs-4", "features-1", "features-2", "features-3", "features-4", "features-5", "features-6", "features-7", "features-8", "features-9", "features-10", "features-11", "features-12", "footer-1", "footer-2", "footer-3", "footer-4", "footer-5", "hero-section-1", "hero-section-2", "hero-section-3", "hero-section-4", "hero-section-5", "hero-section-6", "hero-section-7", "hero-section-8", "hero-section-9", "login-1", "login-2", "login-3", "sign-up-1", "sign-up-2", "sign-up-3", "forgot-password-1", "forgot-password-2", "stats-1", "stats-2", "stats-3", "stats-4", "team-1", "team-2", "testimonials-1", "testimonials-2", "testimonials-3", "testimonials-4", "testimonials-5", "testimonials-6", "logo-cloud-1", "logo-cloud-2", "logo-cloud-3", "pricing-1", "pricing-1", "pricing-2", "pricing-3", "pricing-4", "pricing-5", "contact-1", "contact-2", "integrations-1", "integrations-2", "integrations-3", "integrations-4", "integrations-5", "integrations-6", "integrations-7", "integrations-8", "mist-call-to-action-1", "mist-call-to-action-2", "mist-call-to-action-3", "mist-comparator-1", "mist-contact-1", "mist-content-1", "mist-content-2", "mist-content-3", "mist-content-4", "mist-faqs-1", "mist-faqs-2", "mist-faqs-3", "mist-features-1", "mist-features-2", "mist-features-3", "mist-features-4", "mist-features-5", "mist-features-6", "mist-features-7", "mist-features-8" ], "component_items": [ { "name": "call-to-action-1", "type": "registry:block", "title": "Call To Action 1", "description": "Shadcn/ui call to action block" }, { "name": "call-to-action-2", "type": "registry:block", "title": "Call To Action 2", "description": "Shadcn/ui call to action block" }, { "name": "call-to-action-3", "type": "registry:block", "title": "Call To Action 3", "description": "Shadcn/ui call to action block" }, { "name": "comparator-1", "type": "registry:block", "title": "Pricing Comparator 1", "description": "Shadcn/ui pricing comparator table block" }, { "name": "content-1", "type": "registry:block", "title": "Content Block 1", "description": "Shadcn/ui website content block" }, { "name": "content-2", "type": "registry:block", "title": "Content Block 2", "description": "Shadcn/ui website content block" }, { "name": "content-3", "type": "registry:block", "title": "Content Block 3", "description": "Shadcn/ui website content block" }, { "name": "content-4", "type": "registry:block", "title": "Content Block 4", "description": "Shadcn/ui website content block" }, { "name": "content-5", "type": "registry:block", "title": "Content Block 5", "description": "Shadcn/ui website content block" }, { "name": "content-6", "type": "registry:block", "title": "Content Block 6", "description": "Shadcn/ui website content block" }, { "name": "content-7", "type": "registry:block", "title": "Content Block 7", "description": "Shadcn/ui website content block" }, { "name": "faqs-1", "type": "registry:block", "title": "FAQs Block 1", "description": "Shadcn/ui Frequently Asqued Questions block" }, { "name": "faqs-2", "type": "registry:block", "title": "FAQs Block 2", "description": "Shadcn/ui FAQs block with accordion component" }, { "name": "faqs-3", "type": "registry:block", "title": "FAQs Block 3", "description": "Shadcn/ui FAQs block with accordion component and icons" }, { "name": "faqs-4", "type": "registry:block", "title": "FAQs Block 4", "description": "Shadcn/ui FAQs block with accordion component and icons" }, { "name": "features-1", "type": "registry:block", "title": "Features Block 1", "description": "Shadcn/ui website features block" }, { "name": "features-2", "type": "registry:block", "title": "Features Block 2", "description": "Shadcn/ui website features block" }, { "name": "features-3", "type": "registry:block", "title": "Features Block 3", "description": "Shadcn/ui website features block" }, { "name": "features-4", "type": "registry:block", "title": "Features Block 4", "description": "Shadcn/ui website features block" }, { "name": "features-5", "type": "registry:block", "title": "Features Block 5", "description": "Shadcn/ui website features block" }, { "name": "features-6", "type": "registry:block", "title": "Features Block 6", "description": "Shadcn/ui website features block" }, { "name": "features-7", "type": "registry:block", "title": "Features Block 7", "description": "Shadcn/ui website features block" }, { "name": "features-8", "type": "registry:block", "title": "Features Block 8", "description": "Shadcn/ui website features block" }, { "name": "features-9", "type": "registry:block", "title": "Features Block 9", "description": "Shadcn/ui website features block" }, { "name": "features-10", "type": "registry:block", "title": "Features Block 10", "description": "Shadcn/ui website features block with cards and circular UI elements" }, { "name": "features-11", "type": "registry:block", "title": "Features Block 11", "description": "Shadcn/ui website features block with grid layout and images" }, { "name": "features-12", "type": "registry:block", "title": "Features Block 12", "description": "Shadcn/ui website features block with accordion and animated images" }, { "name": "footer-1", "type": "registry:block", "title": "Footer Block 1", "description": "Shadcn/ui website footer block" }, { "name": "footer-2", "type": "registry:block", "title": "Footer Block 2", "description": "Shadcn/ui website footer block" }, { "name": "footer-3", "type": "registry:block", "title": "Footer Block 3", "description": "Shadcn/ui website footer block" }, { "name": "footer-4", "type": "registry:block", "title": "Footer Block 4", "description": "Shadcn/ui website footer block" }, { "name": "footer-5", "type": "registry:block", "title": "Footer Block 5", "description": "Shadcn/ui website footer block" }, { "name": "hero-section-1", "type": "registry:block", "title": "Hero Section 1", "description": "Shadcn/ui website Hero Section" }, { "name": "hero-section-2", "type": "registry:block", "title": "Hero Section 2", "description": "Shadcn/ui website Hero Section" }, { "name": "hero-section-3", "type": "registry:block", "title": "Hero Section 3", "description": "Shadcn/ui website Hero Section" }, { "name": "hero-section-4", "type": "registry:block", "title": "Hero Section 4", "description": "Shadcn/ui website Hero Section" }, { "name": "hero-section-5", "type": "registry:block", "title": "Hero Section 5", "description": "Shadcn/ui website Hero Section" }, { "name": "hero-section-6", "type": "registry:block", "title": "Hero Section 6", "description": "Shadcn/ui website Hero Section" }, { "name": "hero-section-7", "type": "registry:block", "title": "Hero Section 7", "description": "Shadcn/ui website Hero Section" }, { "name": "hero-section-8", "type": "registry:block", "title": "Hero Section 8", "description": "Shadcn/ui website Hero Section" }, { "name": "hero-section-9", "type": "registry:block", "title": "Hero Section 9", "description": "Shadcn/ui website Hero Section" }, { "name": "login-1", "type": "registry:block", "title": "Login Page 1", "description": "Shadcn/ui Login Page" }, { "name": "login-2", "type": "registry:block", "title": "Login Page 2", "description": "Shadcn/ui Login Page" }, { "name": "login-3", "type": "registry:block", "title": "Login Page 3", "description": "Shadcn/ui Login Page" }, { "name": "sign-up-1", "type": "registry:block", "title": "Sign Up Page 1", "description": "Shadcn/ui Sign Up Page" }, { "name": "sign-up-2", "type": "registry:block", "title": "Sign Up Page 2", "description": "Shadcn/ui Sign Up Page" }, { "name": "sign-up-3", "type": "registry:block", "title": "Sign Up Page 3", "description": "Shadcn/ui Sign Up Page" }, { "name": "forgot-password-1", "type": "registry:block", "title": "Forgot Password Page 1", "description": "Shadcn/ui Forgot Password Page" }, { "name": "forgot-password-2", "type": "registry:block", "title": "Forgot Password Page 2", "description": "Shadcn/ui Forgot Password Page" }, { "name": "stats-1", "type": "registry:block", "title": "Stats Block 1", "description": "Shadcn/ui website stats block" }, { "name": "stats-2", "type": "registry:block", "title": "Stats Block 2", "description": "Shadcn/ui website stats block" }, { "name": "stats-3", "type": "registry:block", "title": "Stats Block 3", "description": "Shadcn/ui website stats block" }, { "name": "stats-4", "type": "registry:block", "title": "Stats Block 4", "description": "Shadcn/ui website stats block" }, { "name": "team-1", "type": "registry:block", "title": "Team Section 1", "description": "Shadcn/ui website team section" }, { "name": "team-2", "type": "registry:block", "title": "Team Section 2", "description": "Shadcn/ui website team section" }, { "name": "testimonials-1", "type": "registry:block", "title": "Testimonials Section 1", "description": "Shadcn/ui website testimonials section" }, { "name": "testimonials-2", "type": "registry:block", "title": "Testimonials Section 2", "description": "Shadcn/ui website testimonials section" }, { "name": "testimonials-3", "type": "registry:block", "title": "Testimonials Section 3", "description": "Shadcn/ui website testimonials section" }, { "name": "testimonials-4", "type": "registry:block", "title": "Testimonials Section 4", "description": "Shadcn/ui website testimonials section" }, { "name": "testimonials-5", "type": "registry:block", "title": "Testimonials Section 5", "description": "Shadcn/ui website testimonials section" } ], "component_count": 210, "components_truncated": true, "component_types": { "registry:block": 191, "registry:ui": 19 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 173, "name": "@tailgrids", "category": "Component library (general)", "tags": [ "ai", "dashboard", "components" ], "tagline": "React UI Components, Powered by Tailwind CSS", "short_description": "React UI Components, Powered by Tailwind CSS", "description": "A large open-source React component library powered by Tailwind CSS, shipping 100+ free copy-paste components and 500+ premium UI blocks. The free tier covers Accordion, Alert, Avatar, Badge, Button, Card, Carousel, Chart, Checkbox, Combobox, Command, Context Menu, Date Picker, Dialog, Drawer, Dropdown, Input, Menubar, Navigation Menu, OTP Input, Pagination, Popover, and more. Premium blocks cover marketing, dashboards, e-commerce, and AI sections. Uses a custom CLI (npx @tailgrids/cli). Freemium. Use for: React/Next.js/Vite projects needing a broad, Tailwind-native component set with a complementary block library for full-page layouts.", "homepage": "https://tailgrids.com", "docs": "https://tailgrids.com/docs", "github": "https://github.com/Tailgrids/tailgrids", "components_github": null, "github_default_branch": "main", "github_stars": 1607, "last_commit": "2026-07-01T09:52:52Z", "archived": false, "license": "MIT", "open_issues": 4, "registry_template": "https://tailgrids.com/docs/r/{name}.json", "registry_index": "https://tailgrids.com/docs/r/registry.json", "components": [ "accordion", "alert", "alert-dialog", "aspect-ratio", "avatar", "badge", "breadcrumbs", "button", "button-group", "calendar", "card", "carousel", "chart", "checkbox", "collapsible", "context-menu", "combobox", "command", "date-field", "date-picker", "description", "dialog", "drawer", "dropdown", "field", "hover-card", "input", "input-group", "label", "link", "list", "menubar", "native-select", "navigation-menu", "number-field", "otp-input", "overlay", "pagination", "popover", "progress", "radio-input", "range-calendar", "resizable", "scroll-area", "select", "separator", "sheet", "sidebar", "skeleton", "slider", "social-button", "spinner", "table", "tabs", "text-area", "text-field", "time-field", "time-picker", "toast", "toggle", "tooltip" ], "component_items": [ { "name": "accordion", "type": "registry:ui", "title": null, "description": "Fully accessible accordion component with multiple style variants" }, { "name": "alert", "type": "registry:ui", "title": null, "description": "A component to display important messages to the user, with support for different variants." }, { "name": "alert-dialog", "type": "registry:ui", "title": null, "description": "A modal dialog that interrupts the user with important content and expects a response." }, { "name": "aspect-ratio", "type": "registry:ui", "title": null, "description": "Aspect ratio component to maintain the aspect ratio of an element." }, { "name": "avatar", "type": "registry:ui", "title": null, "description": "An image element with a fallback for representing a user." }, { "name": "badge", "type": "registry:ui", "title": null, "description": "Badge component with multiple colors, sizes, and support for prefix/suffix icons." }, { "name": "breadcrumbs", "type": "registry:ui", "title": null, "description": "Breadcrumbs component with multiple variants and support for icons." }, { "name": "button", "type": "registry:ui", "title": null, "description": "Button component with multiple variants, sizes, and support for icons." }, { "name": "button-group", "type": "registry:ui", "title": null, "description": "A component with multiple buttons grouped together." }, { "name": "calendar", "type": "registry:ui", "title": null, "description": "A calendar component with internationalization support." }, { "name": "card", "type": "registry:ui", "title": null, "description": "A card component with ultimate flexibility and customization." }, { "name": "carousel", "type": "registry:ui", "title": null, "description": "A powerful, flexible carousel component built with Embla Carousel." }, { "name": "chart", "type": "registry:ui", "title": null, "description": "A chart component with multiple variants." }, { "name": "checkbox", "type": "registry:ui", "title": null, "description": "A checkbox component with label and multiple states." }, { "name": "collapsible", "type": "registry:ui", "title": null, "description": "A high-performance context menu component that appears when triggered by a right-click or long-press." }, { "name": "context-menu", "type": "registry:ui", "title": null, "description": "A context menu component with multiple variants." }, { "name": "combobox", "type": "registry:ui", "title": null, "description": "A combobox component with multiple variants." }, { "name": "command", "type": "registry:ui", "title": null, "description": "A command menu component with multiple variants." }, { "name": "date-field", "type": "registry:ui", "title": null, "description": "A React date field component that lets users input a date." }, { "name": "date-picker", "type": "registry:ui", "title": null, "description": "A component to select a date." }, { "name": "description", "type": "registry:ui", "title": null, "description": "A description component that provides additional context or instructions for form fields." }, { "name": "dialog", "type": "registry:ui", "title": null, "description": "A dialog component that display a modal overlay above the main page content." }, { "name": "drawer", "type": "registry:ui", "title": null, "description": "A drawer component that slides in from the edge of the screen, typically used for navigation or displaying additional content." }, { "name": "dropdown", "type": "registry:ui", "title": null, "description": "A dropdown component with multiple variants and support for icons." }, { "name": "field", "type": "registry:ui", "title": null, "description": "A collection of components for building accessible and flexible form fields." }, { "name": "hover-card", "type": "registry:ui", "title": null, "description": "A hover card component that displays information when the user hovers over an element." }, { "name": "input", "type": "registry:ui", "title": null, "description": "An input component with multiple variants and support for icons." }, { "name": "input-group", "type": "registry:ui", "title": null, "description": "A flexible and accessible input group component that allows you to combine multiple input elements, such as text inputs, buttons, and icons, into a single cohe…" }, { "name": "label", "type": "registry:ui", "title": null, "description": "A label component for form fields." }, { "name": "link", "type": "registry:ui", "title": null, "description": "A link component with multiple variants." }, { "name": "list", "type": "registry:ui", "title": null, "description": "A list component with multiple variants." }, { "name": "menubar", "type": "registry:ui", "title": null, "description": "A responsive menu bar component that provides a horizontal row of menu triggers, each opening a dropdown menu." }, { "name": "native-select", "type": "registry:ui", "title": null, "description": "A native select component with multiple variants." }, { "name": "navigation-menu", "type": "registry:ui", "title": null, "description": "A navigation menu component that provides a clear visual structure for the primary links of a website or application." }, { "name": "number-field", "type": "registry:ui", "title": null, "description": "A component for entering numeric values with increment and decrement buttons." }, { "name": "otp-input", "type": "registry:ui", "title": null, "description": "A component for entering one-time passwords." }, { "name": "overlay", "type": "registry:ui", "title": null, "description": "A component for displaying content in a floating container." }, { "name": "pagination", "type": "registry:ui", "title": null, "description": "A component for navigating between pages." }, { "name": "popover", "type": "registry:ui", "title": null, "description": "A popover component that displays content in a floating container." }, { "name": "progress", "type": "registry:ui", "title": null, "description": "A progress bar component with multiple variants." }, { "name": "radio-input", "type": "registry:ui", "title": null, "description": "A radio button component with label and multiple states." }, { "name": "range-calendar", "type": "registry:ui", "title": null, "description": "A calendar component for selecting a range of dates." }, { "name": "resizable", "type": "registry:ui", "title": null, "description": "Accessible resizable panel groups and layouts with keyboard support." }, { "name": "scroll-area", "type": "registry:ui", "title": null, "description": "A scroll area component to add scrollbars to an element." }, { "name": "select", "type": "registry:ui", "title": null, "description": "A select component with multiple variants." }, { "name": "separator", "type": "registry:ui", "title": null, "description": "A separator component to separate content." }, { "name": "sheet", "type": "registry:ui", "title": null, "description": "A sheet component that slides in from the edge of the screen, typically used for navigation or displaying additional content." }, { "name": "sidebar", "type": "registry:ui", "title": null, "description": "A reusable, responsive, and accessible sidebar component." }, { "name": "skeleton", "type": "registry:ui", "title": null, "description": "A component to indicate a loading state." }, { "name": "slider", "type": "registry:ui", "title": null, "description": "A slider component to select a value from a range." }, { "name": "social-button", "type": "registry:ui", "title": null, "description": "A button component for social media actions." }, { "name": "spinner", "type": "registry:ui", "title": null, "description": "A spinner component to indicate a loading state." }, { "name": "table", "type": "registry:ui", "title": null, "description": "A table component with multiple variants." }, { "name": "tabs", "type": "registry:ui", "title": null, "description": "A tabs component with multiple variants." }, { "name": "text-area", "type": "registry:ui", "title": null, "description": "A multiline text input component." }, { "name": "text-field", "type": "registry:ui", "title": null, "description": "A wrapper for text inputs." }, { "name": "time-field", "type": "registry:ui", "title": null, "description": "A segment-based time input component." }, { "name": "time-picker", "type": "registry:ui", "title": null, "description": "A component to select a time." }, { "name": "toast", "type": "registry:ui", "title": null, "description": "A toast component for displaying notifications." }, { "name": "toggle", "type": "registry:ui", "title": null, "description": "A toggle switch component." } ], "component_count": 61, "components_truncated": false, "component_types": { "registry:ui": 61 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 174, "name": "@tailwind-admin", "category": "Dashboard/admin templates", "tags": [ "saas", "dashboard" ], "tagline": "Tailwind Builder provides free tailwind admin dashboard templates, components and ui-blocks built with React, Next.js, Tailwind CSS, and shadcn/ui to help you build admin panels quickly and efficiently.", "short_description": "Tailwind Builder provides free tailwind admin dashboard templates, components and ui-blocks built with React, Next.js, Tailwind CSS, and shadcn/ui to help you build admin panels quickly and efficiently.", "description": "Free, open-source admin dashboard template built with Tailwind CSS, shadcn/ui, and Radix primitives. Supports Next.js, React, Vue, Angular 21, and TanStack Start. Pre-designed pages include Dashboard, Login, Register, User Profile, Tables, Charts (via ApexCharts), and Error pages. Offers sidebar, topbar, and responsive layouts with dark mode. Iconify icons included. MIT license. Use for: bootstrapping SaaS dashboards, CRM panels, internal admin tools, or analytics interfaces across multiple frontend frameworks without starting from a blank page.", "homepage": "https://tailwind-admin.com/", "docs": "https://tailwind-admin.com/docs", "github": "https://github.com/Tailwind-Admin/free-tailwind-admin-dashboard-template", "components_github": null, "github_default_branch": "main", "github_stars": 230, "last_commit": "2026-05-26T11:49:14Z", "archived": false, "license": "MIT", "open_issues": 1, "registry_template": "https://tailwind-admin.com/r/{name}.json", "registry_index": "https://tailwind-admin.com/r/registry.json", "components": [ "download-banner", "empty-banner", "error-banner", "greeting-banner", "mutual-banner", "notification-banner", "welcome-banner", "best-selling-product", "top-cards", "blog-cards", "feed-cards", "gift-cards", "music-cards", "payment-gateways", "poll-of-week", "poll-result", "products-cards", "profile-cards", "recent-comments", "recent-messages", "recent-transaction", "review-cards", "settings-card", "social-card", "social-cards", "social-post", "task-list", "upcomming-activities", "user-cards", "user-info-card", "user-profile-card", "login-1", "login-2", "login-3", "login-4", "signup-1", "signup-2", "signup-3", "signup-4", "otp-1", "otp-2", "otp-3", "current-value-chart", "current-year-chart", "customers-chart", "earned-chart", "expnace-chart", "followers-chart", "income-chart", "monthly-earning-chart", "most-visited-chart", "page-impression-chart", "projects-chart", "revenue-updates-chart", "sales-overview-chart", "total-earnigs-chart", "views-chart", "weekly-stats-chart", "yarly-breakup-chart", "yearly-sales-chart", "bell-notify-button", "glitch-button", "glow-link-button", "heart-like-button", "hover-lift-button", "liquid-fill-button", "ripple-effect-button", "shine-effect-button", "magnetic-button", "heartbeat-effect-button", "matrix-rain-button", "playful-wiggle-button", "shiny-button", "star-favourite-button", "tap-pop-button", "action-tracking-motion", "alert-card-motion", "animate-border-card-motion", "card-circle-motion", "card-lift-motion", "expandable-card-motion", "flip-card-motion", "image-comparison-motion", "insight-card-motion", "message-card-motion", "three-d-card-motion", "file-upload-motion", "input-form-motion", "input-placeholder-motion", "link-preview", "animated-list-motion", "dot-loader-motion", "elastic-slider-motion", "animated-text-background-motion", "text-roller-motion", "shiny-text-motion", "text-shimmer-motion", "typing-animation-motion", "animate-table-motion", "animated-tab-motion" ], "component_items": [ { "name": "download-banner", "type": "registry:component", "title": null, "description": "A banner component with optional code display for UI blocks." }, { "name": "empty-banner", "type": "registry:component", "title": null, "description": "A banner component with optional code display for UI blocks." }, { "name": "error-banner", "type": "registry:component", "title": null, "description": "A banner component with optional code display for UI blocks." }, { "name": "greeting-banner", "type": "registry:component", "title": null, "description": "A banner component with optional code display for UI blocks." }, { "name": "mutual-banner", "type": "registry:component", "title": null, "description": "A banner component with optional code display for UI blocks." }, { "name": "notification-banner", "type": "registry:component", "title": null, "description": "A banner component with optional code display for UI blocks." }, { "name": "welcome-banner", "type": "registry:component", "title": null, "description": "A banner component with optional code display for UI blocks." }, { "name": "best-selling-product", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "top-cards", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "blog-cards", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "feed-cards", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "gift-cards", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "music-cards", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "payment-gateways", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "poll-of-week", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "poll-result", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "products-cards", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "profile-cards", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "recent-comments", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "recent-messages", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "recent-transaction", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "review-cards", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "settings-card", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "social-card", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "social-cards", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "social-post", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "task-list", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "upcomming-activities", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "user-cards", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "user-info-card", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "user-profile-card", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "login-1", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "login-2", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "login-3", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "login-4", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "signup-1", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "signup-2", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "signup-3", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "signup-4", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "otp-1", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "otp-2", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "otp-3", "type": "registry:component", "title": null, "description": "A Card component with optional code display for UI blocks." }, { "name": "current-value-chart", "type": "registry:component", "title": null, "description": "A Chart component with optional code display for UI blocks." }, { "name": "current-year-chart", "type": "registry:component", "title": null, "description": "A Chart component with optional code display for UI blocks." }, { "name": "customers-chart", "type": "registry:component", "title": null, "description": "A Chart component with optional code display for UI blocks." }, { "name": "earned-chart", "type": "registry:component", "title": null, "description": "A Chart component with optional code display for UI blocks." }, { "name": "expnace-chart", "type": "registry:component", "title": null, "description": "A Chart component with optional code display for UI blocks." }, { "name": "followers-chart", "type": "registry:component", "title": null, "description": "A Chart component with optional code display for UI blocks." }, { "name": "income-chart", "type": "registry:component", "title": null, "description": "A Chart component with optional code display for UI blocks." }, { "name": "monthly-earning-chart", "type": "registry:component", "title": null, "description": "A Chart component with optional code display for UI blocks." }, { "name": "most-visited-chart", "type": "registry:component", "title": null, "description": "A Chart component with optional code display for UI blocks." }, { "name": "page-impression-chart", "type": "registry:component", "title": null, "description": "A Chart component with optional code display for UI blocks." }, { "name": "projects-chart", "type": "registry:component", "title": null, "description": "A Chart component with optional code display for UI blocks." }, { "name": "revenue-updates-chart", "type": "registry:component", "title": null, "description": "A Chart component with optional code display for UI blocks." }, { "name": "sales-overview-chart", "type": "registry:component", "title": null, "description": "A Chart component with optional code display for UI blocks." }, { "name": "total-earnigs-chart", "type": "registry:component", "title": null, "description": "A Chart component with optional code display for UI blocks." }, { "name": "views-chart", "type": "registry:component", "title": null, "description": "A Chart component with optional code display for UI blocks." }, { "name": "weekly-stats-chart", "type": "registry:component", "title": null, "description": "A Chart component with optional code display for UI blocks." }, { "name": "yarly-breakup-chart", "type": "registry:component", "title": null, "description": "A Chart component with optional code display for UI blocks." }, { "name": "yearly-sales-chart", "type": "registry:component", "title": null, "description": "A Chart component with optional code display for UI blocks." } ], "component_count": 102, "components_truncated": true, "component_types": { "registry:component": 102 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 175, "name": "@tailwind-builder", "category": "Dashboard/admin templates", "tags": [ "ai", "dashboard", "aesthetic" ], "tagline": "Tailwind Builder is a collection of free ui blocks and components and provide ai tools to generate production-ready forms, tables, and charts in seconds. Built with React, Next.js, Tailwind & ShadCN.", "short_description": "Tailwind Builder is a collection of free ui blocks and components and provide ai tools to generate production-ready forms, tables, and charts in seconds. Built with React, Next.js, Tailwind & ShadCN.", "description": "Tailwind Builder (tailwindbuilder.ai) is a collection of free UI blocks and components paired with AI generation tools for producing production-ready forms, tables, and charts on demand. Built with React, Next.js, Tailwind CSS, and shadcn/ui. The site offers a visual AI builder for admin dashboard sections alongside a conventional block library. Maintained under the WraPixel brand. Use for: quickly scaffolding admin dashboard UI — especially form-heavy, table-heavy, or chart-heavy sections — using AI generation to reduce manual component assembly.", "homepage": "https://tailwindbuilder.ai/", "docs": "https://tailwindbuilder.ai/docs", "github": "https://github.com/wrappixel", "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://tailwindbuilder.ai/r/{name}.json", "registry_index": null, "components": [], "component_items": [], "component_count": null, "components_truncated": false, "component_types": {}, "has_logo": true, "enrichment_errors": [ "registry_index_unresolved", "github_lookup_failed" ], "featured": false }, { "number": 176, "name": "@taki", "category": "Component library (general)", "tags": [ "aesthetic", "components" ], "tagline": "Beautifully designed, accessible components that you can copy and paste into your apps. Made with React Aria Components and Shadcn tokens.", "short_description": "Beautifully designed, accessible components that you can copy and paste into your apps. Made with React Aria Components and Shadcn tokens.", "description": "A shadcn/ui-compatible component library that swaps Radix UI primitives for Adobe React Aria Components while retaining shadcn/ui's design tokens and Tailwind styling. Provides the full familiar shadcn component set (Button, Input, Select, Dialog, Combobox, Calendar, DatePicker, Slider, Switch, Checkbox, RadioGroup, Tabs, Accordion, and more) re-implemented on React Aria's accessibility layer. Drop-in replacement aesthetic, deeper built-in ARIA pattern compliance. Free and open source. Use for: teams that need WAI-ARIA-correct components backed by React Aria's accessibility primitives while keeping the shadcn/ui visual language and Tailwind customization workflow.", "homepage": "https://taki-ui.com", "docs": "https://taki-ui.com/docs/installation", "github": "https://github.com/jsartisan/taki-ui", "components_github": null, "github_default_branch": "main", "github_stars": 26, "last_commit": "2026-04-05T18:13:24Z", "archived": false, "license": "MIT", "open_issues": 5, "registry_template": "https://taki-ui.com/r/{name}.json", "registry_index": "https://taki-ui.com/r/registry.json", "components": [ "index", "style", "alert", "avatar", "badge", "breadcrumb", "button", "button-group", "calendar", "card", "carousel", "chart", "checkbox", "combobox", "command", "date-field", "date-picker", "date-range-picker", "description", "dialog", "modal", "disclosure", "drawer", "empty", "field", "file-trigger", "grid-list", "hover-card", "input", "input-group", "input-otp", "item", "label", "link-button", "list-box", "menu", "number-field", "pagination", "popover", "progress-bar", "radio-group", "range-calendar", "resizable", "search-field", "select", "separator", "sheet", "sidebar", "skeleton", "slider", "sonner", "spinner", "switch", "table", "tag-group", "tabs", "textarea", "text-field", "time-field", "toggle-button", "toggle-button-group", "tooltip", "tree", "kbd", "actions", "artifact", "branch", "canvas", "chain-of-thought", "code-block", "connection", "context", "controls", "conversation", "edge", "image", "inline-citation", "loader", "message", "node", "open-in-chat", "panel", "plan", "prompt-input", "queue", "reasoning", "response", "shimmer", "sources", "suggestion", "task", "toolbar", "tool", "web-preview", "chart-area-axes", "chart-area-default", "chart-area-gradient", "chart-area-icons", "chart-area-interactive", "chart-area-legend" ], "component_items": [ { "name": "index", "type": "registry:style", "title": null, "description": null }, { "name": "style", "type": "registry:style", "title": null, "description": null }, { "name": "alert", "type": "registry:ui", "title": null, "description": null }, { "name": "avatar", "type": "registry:ui", "title": null, "description": null }, { "name": "badge", "type": "registry:ui", "title": null, "description": null }, { "name": "breadcrumb", "type": "registry:ui", "title": null, "description": null }, { "name": "button", "type": "registry:ui", "title": null, "description": null }, { "name": "button-group", "type": "registry:ui", "title": null, "description": null }, { "name": "calendar", "type": "registry:ui", "title": null, "description": null }, { "name": "card", "type": "registry:ui", "title": null, "description": null }, { "name": "carousel", "type": "registry:ui", "title": null, "description": null }, { "name": "chart", "type": "registry:ui", "title": null, "description": null }, { "name": "checkbox", "type": "registry:ui", "title": null, "description": null }, { "name": "combobox", "type": "registry:ui", "title": null, "description": null }, { "name": "command", "type": "registry:ui", "title": null, "description": null }, { "name": "date-field", "type": "registry:ui", "title": null, "description": null }, { "name": "date-picker", "type": "registry:ui", "title": null, "description": null }, { "name": "date-range-picker", "type": "registry:ui", "title": null, "description": null }, { "name": "description", "type": "registry:ui", "title": null, "description": null }, { "name": "dialog", "type": "registry:ui", "title": null, "description": null }, { "name": "modal", "type": "registry:ui", "title": null, "description": null }, { "name": "disclosure", "type": "registry:ui", "title": null, "description": null }, { "name": "drawer", "type": "registry:ui", "title": null, "description": null }, { "name": "empty", "type": "registry:ui", "title": null, "description": null }, { "name": "field", "type": "registry:ui", "title": null, "description": null }, { "name": "file-trigger", "type": "registry:ui", "title": null, "description": null }, { "name": "grid-list", "type": "registry:ui", "title": null, "description": null }, { "name": "hover-card", "type": "registry:ui", "title": null, "description": null }, { "name": "input", "type": "registry:ui", "title": null, "description": null }, { "name": "input-group", "type": "registry:ui", "title": null, "description": null }, { "name": "input-otp", "type": "registry:ui", "title": null, "description": null }, { "name": "item", "type": "registry:ui", "title": null, "description": null }, { "name": "label", "type": "registry:ui", "title": null, "description": null }, { "name": "link-button", "type": "registry:ui", "title": null, "description": null }, { "name": "list-box", "type": "registry:ui", "title": null, "description": null }, { "name": "menu", "type": "registry:ui", "title": null, "description": null }, { "name": "number-field", "type": "registry:ui", "title": null, "description": null }, { "name": "pagination", "type": "registry:ui", "title": null, "description": null }, { "name": "popover", "type": "registry:ui", "title": null, "description": null }, { "name": "progress-bar", "type": "registry:ui", "title": null, "description": null }, { "name": "radio-group", "type": "registry:ui", "title": null, "description": null }, { "name": "range-calendar", "type": "registry:ui", "title": null, "description": null }, { "name": "resizable", "type": "registry:ui", "title": null, "description": null }, { "name": "search-field", "type": "registry:ui", "title": null, "description": null }, { "name": "select", "type": "registry:ui", "title": null, "description": null }, { "name": "separator", "type": "registry:ui", "title": null, "description": null }, { "name": "sheet", "type": "registry:ui", "title": null, "description": null }, { "name": "sidebar", "type": "registry:ui", "title": null, "description": null }, { "name": "skeleton", "type": "registry:ui", "title": null, "description": null }, { "name": "slider", "type": "registry:ui", "title": null, "description": null }, { "name": "sonner", "type": "registry:ui", "title": null, "description": null }, { "name": "spinner", "type": "registry:ui", "title": null, "description": null }, { "name": "switch", "type": "registry:ui", "title": null, "description": null }, { "name": "table", "type": "registry:ui", "title": null, "description": null }, { "name": "tag-group", "type": "registry:ui", "title": null, "description": null }, { "name": "tabs", "type": "registry:ui", "title": null, "description": null }, { "name": "textarea", "type": "registry:ui", "title": null, "description": null }, { "name": "text-field", "type": "registry:ui", "title": null, "description": null }, { "name": "time-field", "type": "registry:ui", "title": null, "description": null }, { "name": "toggle-button", "type": "registry:ui", "title": null, "description": null } ], "component_count": 540, "components_truncated": true, "component_types": { "registry:style": 2, "registry:ui": 92, "registry:block": 70, "registry:lib": 1, "registry:hook": 2, "registry:theme": 5, "registry:example": 355, "registry:internal": 13 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 177, "name": "@termcn", "category": "Niche/single-purpose", "tags": [ "ai", "dashboard", "aesthetic" ], "tagline": "Beautiful terminal UIs, made simple. Ready to use, customizable terminal UI components for React.", "short_description": "Beautiful terminal UIs, made simple. Ready to use, customizable terminal UI components for React.", "description": "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.", "homepage": "https://termcn.vercel.app", "docs": "https://termcn.vercel.app/docs", "github": "https://github.com/Aniket-508/termcn", "components_github": "https://github.com/Aniket-508/termcn/tree/main/registry", "github_default_branch": "main", "github_stars": 652, "last_commit": "2026-07-05T20:14:50Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://termcn.vercel.app/r/{name}.json", "registry_index": "https://termcn.vercel.app/r/registry.json", "components": [ "ink/types", "ink/alert", "ink/app-shell", "ink/aspect-ratio", "ink/badge", "ink/banner", "ink/bar-chart", "ink/big-text", "ink/box", "ink/breadcrumb", "ink/bullet-list", "ink/card", "ink/center", "ink/chat-message", "ink/chat-thread", "ink/checkbox", "ink/checkbox-group", "ink/clipboard", "ink/clock", "ink/code", "ink/color-picker", "ink/columns", "ink/command-palette", "ink/confirm", "ink/conversation-history", "ink/data-grid", "ink/date-picker", "ink/definition", "ink/dialog", "ink/diff-view", "ink/digits", "ink/directory-tree", "ink/divider", "ink/drawer", "ink/email-input", "ink/embedded-terminal", "ink/error-boundary", "ink/error-retry", "ink/file-change", "ink/file-picker", "ink/form", "ink/form-field", "ink/gauge", "ink/git-status", "ink/gradient", "ink/grid", "ink/heading", "ink/heat-map", "ink/help", "ink/help-screen", "ink/image", "ink/info-box", "ink/json", "ink/key-value", "ink/keyboard-shortcuts", "ink/line-chart", "ink/link", "ink/list", "ink/log", "ink/login-flow", "ink/markdown", "ink/masked-input", "ink/menu", "ink/modal", "ink/model-selector", "ink/multi-progress", "ink/multi-select", "ink/notification-center", "ink/number-input", "opentui/types", "opentui/alert", "opentui/app-shell", "opentui/aspect-ratio", "opentui/badge", "opentui/banner", "opentui/bar-chart", "opentui/big-text", "opentui/box", "opentui/breadcrumb", "opentui/bullet-list", "opentui/card", "opentui/center", "opentui/chat-message", "opentui/chat-thread", "opentui/checkbox", "opentui/checkbox-group", "opentui/clipboard", "opentui/clock", "opentui/code", "opentui/color-picker", "opentui/columns", "opentui/command-palette", "opentui/confirm", "opentui/data-grid", "opentui/date-picker", "opentui/definition", "opentui/dialog", "opentui/diff-view", "opentui/digits", "opentui/directory-tree" ], "component_items": [ { "name": "ink/types", "type": "registry:file", "title": "Types", "description": "Shared terminal theme and provider types." }, { "name": "ink/alert", "type": "registry:ui", "title": "Alert", "description": "Alert box with success/error/warning/info variants" }, { "name": "ink/app-shell", "type": "registry:ui", "title": "App Shell", "description": "Full-screen TUI layout with header, tip bar, full-width input, scrollable content, and hints footer" }, { "name": "ink/aspect-ratio", "type": "registry:ui", "title": "Aspect Ratio", "description": "Constrains children to a given aspect ratio" }, { "name": "ink/badge", "type": "registry:ui", "title": "Badge", "description": "Semantic status indicator badge (success/error/warning/info)" }, { "name": "ink/banner", "type": "registry:ui", "title": "Banner", "description": "Full-width announcement banner" }, { "name": "ink/bar-chart", "type": "registry:ui", "title": "Bar Chart", "description": "Horizontal and vertical bar chart with labels" }, { "name": "ink/big-text", "type": "registry:ui", "title": "Big Text", "description": "Figlet-style large ASCII art text" }, { "name": "ink/box", "type": "registry:ui", "title": "Box", "description": "Enhanced flexbox container with theme-aware borders" }, { "name": "ink/breadcrumb", "type": "registry:ui", "title": "Breadcrumb", "description": "Breadcrumb navigation trail" }, { "name": "ink/bullet-list", "type": "registry:ui", "title": "Bullet List", "description": "Nested structured content with ●/└/□ bullet prefixes" }, { "name": "ink/card", "type": "registry:ui", "title": "Card", "description": "Card with header, body, and footer slots" }, { "name": "ink/center", "type": "registry:ui", "title": "Center", "description": "Centers children horizontally and vertically" }, { "name": "ink/chat-message", "type": "registry:ui", "title": "Chat Message", "description": "Chat message bubble with role label, streaming indicator, and collapsible content" }, { "name": "ink/chat-thread", "type": "registry:ui", "title": "Chat Thread", "description": "Scrollable container for stacking ChatMessage components in a conversation thread" }, { "name": "ink/checkbox", "type": "registry:ui", "title": "Checkbox", "description": "Checkbox with indeterminate state" }, { "name": "ink/checkbox-group", "type": "registry:ui", "title": "Checkbox Group", "description": "Checkbox group with min/max selection" }, { "name": "ink/clipboard", "type": "registry:ui", "title": "Clipboard", "description": "Copy-to-clipboard button with success feedback" }, { "name": "ink/clock", "type": "registry:ui", "title": "Clock", "description": "Real-time clock display with 12h/24h and date" }, { "name": "ink/code", "type": "registry:ui", "title": "Code", "description": "Syntax-highlighted code block (50+ languages)" }, { "name": "ink/color-picker", "type": "registry:ui", "title": "Color Picker", "description": "Color picker with palette, hex, and RGB input" }, { "name": "ink/columns", "type": "registry:ui", "title": "Columns", "description": "Multi-column layout with configurable widths" }, { "name": "ink/command-palette", "type": "registry:ui", "title": "Command Palette", "description": "VS Code–style command palette with fuzzy search" }, { "name": "ink/confirm", "type": "registry:ui", "title": "Confirm", "description": "Yes/No confirmation prompt" }, { "name": "ink/conversation-history", "type": "registry:ui", "title": "Conversation History", "description": "Arrow-key scrollable stack for long assistant threads with optional hint" }, { "name": "ink/data-grid", "type": "registry:ui", "title": "Data Grid", "description": "Advanced data grid with sorting, filtering, pagination, and cell editing" }, { "name": "ink/date-picker", "type": "registry:ui", "title": "Date Picker", "description": "Calendar date picker with keyboard navigation" }, { "name": "ink/definition", "type": "registry:ui", "title": "Definition", "description": "Term–description definition list" }, { "name": "ink/dialog", "type": "registry:ui", "title": "Dialog", "description": "Confirmation dialog with OK/Cancel actions" }, { "name": "ink/diff-view", "type": "registry:ui", "title": "Diff View", "description": "Unified, split, and inline diff viewer with LCS-based diff algorithm and line numbers" }, { "name": "ink/digits", "type": "registry:ui", "title": "Digits", "description": "Box-drawing character numerals" }, { "name": "ink/directory-tree", "type": "registry:ui", "title": "Directory Tree", "description": "Filesystem browser with expand/collapse" }, { "name": "ink/divider", "type": "registry:ui", "title": "Divider", "description": "Horizontal or vertical divider / rule" }, { "name": "ink/drawer", "type": "registry:ui", "title": "Drawer", "description": "Slide-in panel from any edge" }, { "name": "ink/email-input", "type": "registry:ui", "title": "Email Input", "description": "Email input with validation and domain suggestions" }, { "name": "ink/embedded-terminal", "type": "registry:ui", "title": "Embedded Terminal", "description": "Embedded PTY terminal panel (requires node-pty peer)" }, { "name": "ink/error-boundary", "type": "registry:ui", "title": "Error Boundary", "description": "React error boundary with graceful terminal display" }, { "name": "ink/error-retry", "type": "registry:ui", "title": "Error Retry", "description": "Inline error panel with retry, dismiss, and max-retry guard" }, { "name": "ink/file-change", "type": "registry:ui", "title": "File Change", "description": "Interactive file-change review list with diff expansion, per-file accept/reject actions, and accept-all shortcut" }, { "name": "ink/file-picker", "type": "registry:ui", "title": "File Picker", "description": "Interactive file browser and picker" }, { "name": "ink/form", "type": "registry:ui", "title": "Form", "description": "Form container with validation, Ctrl+S submit, and dirty tracking" }, { "name": "ink/form-field", "type": "registry:ui", "title": "Form Field", "description": "Form field wrapper with label, hint, and error" }, { "name": "ink/gauge", "type": "registry:ui", "title": "Gauge", "description": "Arc/speedometer gauge meter" }, { "name": "ink/git-status", "type": "registry:ui", "title": "Git Status", "description": "Git status display (branch, staged, modified, ahead/behind)" }, { "name": "ink/gradient", "type": "registry:ui", "title": "Gradient", "description": "Color gradient text" }, { "name": "ink/grid", "type": "registry:ui", "title": "Grid", "description": "Rows × columns grid layout" }, { "name": "ink/heading", "type": "registry:ui", "title": "Heading", "description": "h1–h4 styled headings with optional figlet ASCII art" }, { "name": "ink/heat-map", "type": "registry:ui", "title": "Heat Map", "description": "Grid heatmap with color intensity scale" }, { "name": "ink/help", "type": "registry:ui", "title": "Help", "description": "Auto-generated help panel from a keymap" }, { "name": "ink/help-screen", "type": "registry:ui", "title": "Help Screen", "description": "Figlet banner + tagline + aligned Options/Commands help sections" }, { "name": "ink/image", "type": "registry:ui", "title": "Image", "description": "Image renderer with iTerm2/Kitty protocol and ASCII fallback" }, { "name": "ink/info-box", "type": "registry:ui", "title": "Info Box", "description": "Bordered info panel with header, key-value rows, and tree-prefix rows" }, { "name": "ink/json", "type": "registry:ui", "title": "JSON", "description": "Pretty-printed JSON with collapsible nodes" }, { "name": "ink/key-value", "type": "registry:ui", "title": "Key Value", "description": "Aligned key–value pairs" }, { "name": "ink/keyboard-shortcuts", "type": "registry:ui", "title": "Keyboard Shortcuts", "description": "Formatted keyboard shortcut reference table" }, { "name": "ink/line-chart", "type": "registry:ui", "title": "Line Chart", "description": "ASCII line chart with axes and multi-series support" }, { "name": "ink/link", "type": "registry:ui", "title": "Link", "description": "OSC 8 clickable hyperlink" }, { "name": "ink/list", "type": "registry:ui", "title": "List", "description": "Navigable list with optional filtering" }, { "name": "ink/log", "type": "registry:ui", "title": "Log", "description": "Scrolling log viewer with severity levels and filtering" }, { "name": "ink/login-flow", "type": "registry:ui", "title": "Login Flow", "description": "Full-page onboarding/login screen with announcement banner, big ASCII title, description, and numbered select" } ], "component_count": 317, "components_truncated": true, "component_types": { "registry:file": 82, "registry:ui": 227, "registry:block": 2, "registry:hook": 6 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 178, "name": "@terrae", "category": "Maps", "tags": [ "aesthetic" ], "tagline": "Composable, animated map components for React. Built with TypeScript, Tailwind CSS, Mapbox GL JS, and MapLibre GL. Perfect companion for shadcn/ui.", "short_description": "Composable, animated map components for React. Built with TypeScript, Tailwind CSS, Mapbox GL JS, and MapLibre GL. Perfect companion for shadcn/ui.", "description": "A shadcn/ui companion library of composable, animated map components for React built on Mapbox GL JS and MapLibre GL, TypeScript, and Tailwind CSS. Components cover basic-map, markers, animated markers, circles, circle clusters, polygons, lines, animated lines, radial lines, heatmaps, popups, radar, choropleth, compare/comparison, minimap, compass, controls, camera-follow, raster video, and dramatic particle effects (fire, lightning, rain, explosion, cyclone, meteor). Offers hooks and an API reference. Free and open source (MIT). Use for: any React/Next.js app that needs declarative, shadcn-integrated interactive maps with rich visual effects and animated data layers.", "homepage": "https://www.terrae.dev", "docs": "https://www.terrae.dev/docs", "github": "https://github.com/alamenai/terrae", "components_github": "https://github.com/alamenai/terrae/tree/main/src/registry", "github_default_branch": "main", "github_stars": 242, "last_commit": "2026-04-06T16:43:28Z", "archived": false, "license": "MIT", "open_issues": 2, "registry_template": "https://www.terrae.dev/{name}.json", "registry_index": "https://www.terrae.dev/registry.json", "components": [ "map", "marker", "popup", "controls", "circle-cluster", "marker-animated", "line", "line-animated", "animated-pulse", "rain", "raster-video", "image", "mini-map", "compare", "sync", "arc-animated", "camera-follow", "circle", "animated-circle", "blur-area", "targeting-reticle", "radar", "watermark", "compass", "line-radial", "polygon", "animated-polygon", "choropleth", "animated-footprint", "fire", "explosion", "cyclone", "music-disc", "steam", "tsunami", "sandstorm", "snow", "meteor", "lightning", "grid" ], "component_items": [ { "name": "map", "type": "registry:ui", "title": "Map", "description": "Core map component with Mapbox GL and MapLibre GL support." }, { "name": "marker", "type": "registry:ui", "title": "Map Marker", "description": "Customizable map markers with popup support." }, { "name": "popup", "type": "registry:ui", "title": "Map Popup", "description": "Info popups and tooltips for map locations." }, { "name": "controls", "type": "registry:ui", "title": "Map Controls", "description": "Interactive map controls (zoom, fullscreen, etc)." }, { "name": "circle-cluster", "type": "registry:ui", "title": "Map Circle Cluster", "description": "Marker clustering with circle visualization." }, { "name": "marker-animated", "type": "registry:ui", "title": "Map Marker Animated", "description": "Animated marker that moves along a path with trail visualization." }, { "name": "line", "type": "registry:ui", "title": "Map Line", "description": "Static routes and paths on the map." }, { "name": "line-animated", "type": "registry:ui", "title": "Map Line Animated", "description": "Animated path and route animations on the map." }, { "name": "animated-pulse", "type": "registry:ui", "title": "Map Animated Pulse", "description": "Pulsing dot animation for map markers." }, { "name": "rain", "type": "registry:ui", "title": "Map Rain", "description": "Animated rain effect layer." }, { "name": "raster-video", "type": "registry:ui", "title": "Map Raster Video", "description": "Video overlay layers on the map." }, { "name": "image", "type": "registry:ui", "title": "Map Image", "description": "Image overlay layers on the map." }, { "name": "mini-map", "type": "registry:ui", "title": "Map Mini Map", "description": "Minimap overview navigation component." }, { "name": "compare", "type": "registry:ui", "title": "Map Compare", "description": "Side-by-side map comparison component." }, { "name": "sync", "type": "registry:ui", "title": "Map Sync", "description": "Synchronized multi-map component with bidirectional movement sync." }, { "name": "arc-animated", "type": "registry:ui", "title": "Map Arc Animated", "description": "Animated curved arc between two points for flights, deliveries, and connections." }, { "name": "camera-follow", "type": "registry:ui", "title": "Map Camera Follow", "description": "Animate camera along a path for immersive fly-through experiences." }, { "name": "circle", "type": "registry:ui", "title": "Map Circle", "description": "Draggable geographic circle with customizable fill and stroke." }, { "name": "animated-circle", "type": "registry:ui", "title": "Map Animated Circle", "description": "Animated circle with drawing and fill effects." }, { "name": "blur-area", "type": "registry:ui", "title": "Map Blur Area", "description": "Blur sensitive areas on the map with customizable styling." }, { "name": "targeting-reticle", "type": "registry:ui", "title": "Map Targeting Reticle", "description": "Military-style targeting brackets with tracking and lock-on capabilities." }, { "name": "radar", "type": "registry:ui", "title": "Map Radar", "description": "Animated radar sweep signal overlay on map coordinates." }, { "name": "watermark", "type": "registry:ui", "title": "Map Watermark", "description": "Text watermark overlay for maps with configurable position and styling." }, { "name": "compass", "type": "registry:ui", "title": "Map Compass", "description": "Interactive compass overlay with bearing display and click-to-reset." }, { "name": "line-radial", "type": "registry:ui", "title": "Map Line Radial", "description": "Radial lines from a center point to multiple destinations with optional markers." }, { "name": "polygon", "type": "registry:ui", "title": "Map Polygon", "description": "Geographic polygon with customizable fill and stroke styling." }, { "name": "animated-polygon", "type": "registry:ui", "title": "Map Animated Polygon", "description": "Animated polygon with draw, fill, and draw-then-fill effects." }, { "name": "choropleth", "type": "registry:ui", "title": "Map Choropleth", "description": "Thematic choropleth map with color-coded regions based on data values." }, { "name": "animated-footprint", "type": "registry:ui", "title": "Map Animated Footprint", "description": "Animated footprint steps that walk along a path on the map." }, { "name": "fire", "type": "registry:ui", "title": "Map Fire", "description": "Realistic animated fire effect with particle simulation." }, { "name": "explosion", "type": "registry:ui", "title": "Map Explosion", "description": "Animated explosion burst effect with radial particles and flash." }, { "name": "cyclone", "type": "registry:ui", "title": "Map Cyclone", "description": "Animated cyclone funnel with swirling particles and debris." }, { "name": "music-disc", "type": "registry:ui", "title": "Map Music Disc", "description": "Rotating music disc with floating notes animation." }, { "name": "steam", "type": "registry:ui", "title": "Map Steam", "description": "Rising steam effect with wispy particle animation." }, { "name": "tsunami", "type": "registry:ui", "title": "Map Tsunami", "description": "Animated tsunami wave effect with incoming wave, crashing foam, and debris." }, { "name": "sandstorm", "type": "registry:ui", "title": "Map Sandstorm", "description": "Atmospheric sandstorm effect with horizontal particle movement and reduced visibility." }, { "name": "snow", "type": "registry:ui", "title": "Map Snow", "description": "Falling snowflakes effect with gentle drift and wind." }, { "name": "meteor", "type": "registry:ui", "title": "Map Meteor", "description": "Animated meteor falling from sky with fiery trail and impact effect." }, { "name": "lightning", "type": "registry:ui", "title": "Map Lightning", "description": "Animated lightning bolt strikes with branching and flash effects." }, { "name": "grid", "type": "registry:ui", "title": "Map Grid", "description": "Coordinate grid overlay with latitude/longitude lines and labels." } ], "component_count": 40, "components_truncated": false, "component_types": { "registry:ui": 40 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 202, "name": "@tetra-ui", "category": "Uncategorized", "tags": [], "tagline": "Delightful components for a clean, accessible and modern component library for React Native.", "short_description": "", "description": "Delightful components for a clean, accessible and modern component library for React Native.", "homepage": "https://tetra-ui.com", "docs": "https://tetra-ui.com/docs", "github": "https://github.com/Liamandrew/tetra-ui", "components_github": null, "github_default_branch": "main", "github_stars": 4, "last_commit": "2026-07-08T07:40:08Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://tetra-ui.com/r/{name}.json", "registry_index": "https://tetra-ui.com/r/registry.json", "components": [ "accordion", "action-input", "badge", "button", "card", "checkbox", "choicebox", "chip", "empty", "form", "heading", "icons", "inline-list", "input", "label", "menu", "bottom-sheet", "native-sheet", "otp-input", "password-input", "popover", "progress", "radio", "portal", "search-input", "select", "separator", "skeleton", "slider", "slot", "stack", "switch", "text", "text-input", "textarea-input", "toast" ], "component_items": [ { "name": "accordion", "type": "registry:ui", "title": "Accordion", "description": "A vertically stacked set of interactive headings that reveal associated content sections." }, { "name": "action-input", "type": "registry:ui", "title": "Action Input", "description": "A component that allows a user to trigger an action and displays a value attached to the action." }, { "name": "badge", "type": "registry:ui", "title": "Badge", "description": "Displays a badge." }, { "name": "button", "type": "registry:ui", "title": "Button", "description": "A component to display a button and allows a user to trigger an action." }, { "name": "card", "type": "registry:ui", "title": "Card", "description": "Displays a card with a header, content, and footer." }, { "name": "checkbox", "type": "registry:ui", "title": "Checkbox", "description": "A control that allows users to toggle between checked and unchecked states." }, { "name": "choicebox", "type": "registry:ui", "title": "Choicebox", "description": "A group of selectable cards for single or multiple choice." }, { "name": "chip", "type": "registry:ui", "title": "Chip", "description": "Displays a compact, rounded chip element." }, { "name": "empty", "type": "registry:ui", "title": "Empty", "description": "Displays an empty state." }, { "name": "form", "type": "registry:ui", "title": "Form", "description": "Components and utilities that help you compose forms with react-hook-form." }, { "name": "heading", "type": "registry:ui", "title": "Heading", "description": "A component to display headings." }, { "name": "icons", "type": "registry:ui", "title": "Icons", "description": "Icon components styled with Tailwind classes for React Native." }, { "name": "inline-list", "type": "registry:ui", "title": "Inline List", "description": "A grouped list section for settings-style rows with flexible leading and trailing addons." }, { "name": "input", "type": "registry:ui", "title": "Input", "description": "A core component that allows users to enter text." }, { "name": "label", "type": "registry:ui", "title": "Label", "description": "A label component used to accompany form inputs." }, { "name": "menu", "type": "registry:ui", "title": "Menu", "description": "A composable native menu built on Expo UI, with support for groups, separators, and nested submenus." }, { "name": "bottom-sheet", "type": "registry:ui", "title": "Bottom Sheet", "description": "Interactive bottom sheet built on Expo UI with native snap points, gestures, and keyboard support." }, { "name": "native-sheet", "type": "registry:ui", "title": "Native Sheet", "description": "A sheet component that can be used to display content in a modal." }, { "name": "otp-input", "type": "registry:ui", "title": "OTP Input", "description": "A component for entering one-time passwords with individual character slots." }, { "name": "password-input", "type": "registry:ui", "title": "Password Input", "description": "An input component that allows users to enter a password." }, { "name": "popover", "type": "registry:ui", "title": "Popover", "description": "Displays content in a portal relative to the triggering button element." }, { "name": "progress", "type": "registry:ui", "title": "Progress", "description": "Displays an indicator showing the completion progress of a task." }, { "name": "radio", "type": "registry:ui", "title": "Radio", "description": "A control that indicates a selected option within a group." }, { "name": "portal", "type": "registry:ui", "title": "Portal", "description": "Renders children into a different part of the app." }, { "name": "search-input", "type": "registry:ui", "title": "Search Input", "description": "An input component that allows users to search for content." }, { "name": "select", "type": "registry:ui", "title": "Select", "description": "A component that allows users to select a value from a list of options." }, { "name": "separator", "type": "registry:ui", "title": "Separator", "description": "Divides content with a horizontal or vertical line." }, { "name": "skeleton", "type": "registry:ui", "title": "Skeleton", "description": "A component to display placeholder content while in a loading state." }, { "name": "slider", "type": "registry:ui", "title": "Slider", "description": "A control for selecting a value from a continuous or stepped range." }, { "name": "slot", "type": "registry:ui", "title": "Slot", "description": "A utility component that allows merging props onto an optional child component." }, { "name": "stack", "type": "registry:ui", "title": "Stack", "description": "A layout component that stacks children horizontally or vertically with consistent spacing." }, { "name": "switch", "type": "registry:ui", "title": "Switch", "description": "A control that allows users to toggle between checked and unchecked states." }, { "name": "text", "type": "registry:ui", "title": "Text", "description": "A lightweight wrapper around the React Native Text component to provide default styles." }, { "name": "text-input", "type": "registry:ui", "title": "TextInput", "description": "A component that allows users to enter text." }, { "name": "textarea-input", "type": "registry:ui", "title": "Textarea Input", "description": "A component that allows users to enter larger text." }, { "name": "toast", "type": "registry:ui", "title": "Toast", "description": "An opinionated toast component for React Native." } ], "component_count": 36, "components_truncated": false, "component_types": { "registry:ui": 36 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 179, "name": "@text-ui", "category": "Niche/single-purpose", "tags": [ "saas", "aesthetic" ], "tagline": "A shadcn/ui registry with EchoText (`echo-text`): layered stroke text that follows the pointer—minimal setup, drop-in component.", "short_description": "A shadcn/ui registry with EchoText (`echo-text`): layered stroke text that follows the pointer—minimal setup, drop-in component.", "description": "A minimal single-component shadcn/ui registry containing EchoText — a layered, multi-stroke text element where each letter's stroke layers follow the user's pointer in real time. Built with React and Tailwind CSS. The registry exposes one component (echo-text) installable via npx shadcn add @text-ui/echo-text. Fully free and open source. Use for: creating interactive hero text, animated logo wordmarks, or any pointer-reactive typographic accent when building marketing pages or creative portfolio sections.", "homepage": "https://joelachance.github.io/text-ui/docs", "docs": "https://joelachance.github.io/text-ui/docs", "github": "https://github.com/joelachance/text-ui", "components_github": "https://github.com/joelachance/text-ui/tree/main/registry", "github_default_branch": "main", "github_stars": 4, "last_commit": "2026-05-14T19:22:53Z", "archived": false, "license": null, "open_issues": 0, "registry_template": "https://joelachance.github.io/text-ui/r/{name}.json", "registry_index": "https://joelachance.github.io/text-ui/r/registry.json", "components": [ "echo-text" ], "component_items": [ { "name": "echo-text", "type": "registry:component", "title": "EchoText", "description": "Layered stroke text that follows the pointer for a simple motion trail effect." } ], "component_count": 1, "components_truncated": false, "component_types": { "registry:component": 1 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 180, "name": "@thegridcn", "category": "Theming/styling", "tags": [ "dashboard", "aesthetic" ], "tagline": "A Tron-inspired shadcn/ui theme system with Greek god color schemes, glow intensity levels, and sci-fi components like DataCard, HUD, Radar, and more.", "short_description": "A Tron-inspired shadcn/ui theme system with Greek god color schemes, glow intensity levels, and sci-fi components like DataCard, HUD, Radar, and more.", "description": "A Tron: Ares-inspired sci-fi design system and component registry for shadcn/ui. Ships 55+ base UI components plus 90+ Tron-flavored components including HUDs, Radars, Timers, 3D Grids, and Tunnel effects via Three.js, with six Greek-god color themes (Ares, Tron, Clu, Athena, Aphrodite, Poseidon) expressed as oklch() CSS variables. Components use React 19, Next.js, and Tailwind v4. Token export outputs per-theme CSS and JSON. Everything is raw TSX — no package lock-in. Free and open source (MIT). Use for: games, developer tools, cyberpunk-aesthetic dashboards, or any project needing a cohesive sci-fi/neon visual system with Three.js 3D effects.", "homepage": "https://thegridcn.com", "docs": "https://thegridcn.com/docs/install", "github": "https://github.com/educlopez/thegridcn-ui", "components_github": "https://github.com/educlopez/thegridcn-ui/tree/main/src/registry", "github_default_branch": "main", "github_stars": 366, "last_commit": "2026-06-12T07:06:09Z", "archived": false, "license": null, "open_issues": 0, "registry_template": "https://thegridcn.com/r/{name}.json", "registry_index": "https://thegridcn.com/r/registry.json", "components": [ "accordion", "alert", "alert", "alert-dialog", "anomaly-banner", "arrival-panel", "aspect-ratio", "avatar", "badge", "beam-marker", "breadcrumb", "button", "button-group", "calendar", "card", "carousel", "chart", "checkbox", "circuit-background", "collapsible", "command", "context-menu", "crt-effect", "data-card", "dialog", "drawer", "dropdown-menu", "empty", "field", "floating-panel", "form", "glow-container", "grid", "grid-floor", "grid-scan-overlay", "hover-card", "hud", "hud-corner-frame", "input", "input-group", "input-otp", "item", "kbd", "label", "location-display", "map", "menubar", "navigation-menu", "pagination", "popover", "progress", "radio-group", "scroll-area", "select", "separator", "sheet", "sidebar", "skeleton", "slider", "sonner", "spinner", "status-bar", "switch", "table", "tabs", "textarea", "timeline-bar", "timer", "toggle", "toggle-group", "tooltip", "tunnel", "uplink-header", "video-player", "video-progress", "terminal", "energy-meter", "progress-ring", "diagnostics-panel", "identity-disc", "gauge", "waveform", "data-stream", "boot-sequence", "signal-indicator", "notification", "stepper", "tag", "stat-card", "sparkline", "feature-card", "pricing-card", "testimonial-card", "stats-counter", "cta-banner", "heatmap", "logo-cloud", "comparison-table", "changelog", "progress-bar" ], "component_items": [ { "name": "accordion", "type": "registry:component", "title": "Accordion", "description": null }, { "name": "alert", "type": "registry:component", "title": "Alert", "description": null }, { "name": "alert", "type": "registry:component", "title": "Alert", "description": null }, { "name": "alert-dialog", "type": "registry:component", "title": "Alert Dialog", "description": null }, { "name": "anomaly-banner", "type": "registry:component", "title": "Anomaly Banner", "description": null }, { "name": "arrival-panel", "type": "registry:component", "title": "Arrival Panel", "description": null }, { "name": "aspect-ratio", "type": "registry:component", "title": "Aspect Ratio", "description": null }, { "name": "avatar", "type": "registry:component", "title": "Avatar", "description": null }, { "name": "badge", "type": "registry:component", "title": "Badge", "description": null }, { "name": "beam-marker", "type": "registry:component", "title": "Beam Marker", "description": null }, { "name": "breadcrumb", "type": "registry:component", "title": "Breadcrumb", "description": null }, { "name": "button", "type": "registry:component", "title": "Button", "description": null }, { "name": "button-group", "type": "registry:component", "title": "Button Group", "description": null }, { "name": "calendar", "type": "registry:component", "title": "Calendar", "description": null }, { "name": "card", "type": "registry:component", "title": "Card", "description": null }, { "name": "carousel", "type": "registry:component", "title": "Carousel", "description": null }, { "name": "chart", "type": "registry:component", "title": "Chart", "description": "Helper to extract item config from a payload." }, { "name": "checkbox", "type": "registry:component", "title": "Checkbox", "description": null }, { "name": "circuit-background", "type": "registry:component", "title": "Circuit Background", "description": null }, { "name": "collapsible", "type": "registry:component", "title": "Collapsible", "description": null }, { "name": "command", "type": "registry:component", "title": "Command", "description": null }, { "name": "context-menu", "type": "registry:component", "title": "Context Menu", "description": null }, { "name": "crt-effect", "type": "registry:component", "title": "Crt Effect", "description": "CRT monitor effect with scanlines, vignette, flicker, and scan sweep animation. * Wrap any content to give it a retro CRT monitor appearance." }, { "name": "data-card", "type": "registry:component", "title": "Data Card", "description": null }, { "name": "dialog", "type": "registry:component", "title": "Dialog", "description": null }, { "name": "drawer", "type": "registry:component", "title": "Drawer", "description": null }, { "name": "dropdown-menu", "type": "registry:component", "title": "Dropdown Menu", "description": null }, { "name": "empty", "type": "registry:component", "title": "Empty", "description": null }, { "name": "field", "type": "registry:component", "title": "Field", "description": null }, { "name": "floating-panel", "type": "registry:component", "title": "Floating Panel", "description": null }, { "name": "form", "type": "registry:component", "title": "Form", "description": null }, { "name": "glow-container", "type": "registry:component", "title": "Glow Container", "description": null }, { "name": "grid", "type": "registry:component", "title": "Grid", "description": "Convert hex to THREE.Color" }, { "name": "grid-floor", "type": "registry:component", "title": "Grid Floor", "description": null }, { "name": "grid-scan-overlay", "type": "registry:component", "title": "Grid Scan Overlay", "description": null }, { "name": "hover-card", "type": "registry:component", "title": "Hover Card", "description": null }, { "name": "hud", "type": "registry:component", "title": "Hud", "description": null }, { "name": "hud-corner-frame", "type": "registry:component", "title": "Hud Corner Frame", "description": null }, { "name": "input", "type": "registry:component", "title": "Input", "description": null }, { "name": "input-group", "type": "registry:component", "title": "Input Group", "description": null }, { "name": "input-otp", "type": "registry:component", "title": "Input Otp", "description": null }, { "name": "item", "type": "registry:component", "title": "Item", "description": null }, { "name": "kbd", "type": "registry:component", "title": "Kbd", "description": null }, { "name": "label", "type": "registry:component", "title": "Label", "description": null }, { "name": "location-display", "type": "registry:component", "title": "Location Display", "description": null }, { "name": "map", "type": "registry:component", "title": "Map", "description": null }, { "name": "menubar", "type": "registry:component", "title": "Menubar", "description": null }, { "name": "navigation-menu", "type": "registry:component", "title": "Navigation Menu", "description": null }, { "name": "pagination", "type": "registry:component", "title": "Pagination", "description": null }, { "name": "popover", "type": "registry:component", "title": "Popover", "description": null }, { "name": "progress", "type": "registry:component", "title": "Progress", "description": null }, { "name": "radio-group", "type": "registry:component", "title": "Radio Group", "description": null }, { "name": "scroll-area", "type": "registry:component", "title": "Scroll Area", "description": null }, { "name": "select", "type": "registry:component", "title": "Select", "description": null }, { "name": "separator", "type": "registry:component", "title": "Separator", "description": null }, { "name": "sheet", "type": "registry:component", "title": "Sheet", "description": null }, { "name": "sidebar", "type": "registry:component", "title": "Sidebar", "description": null }, { "name": "skeleton", "type": "registry:component", "title": "Skeleton", "description": null }, { "name": "slider", "type": "registry:component", "title": "Slider", "description": null }, { "name": "sonner", "type": "registry:component", "title": "Sonner", "description": null } ], "component_count": 140, "components_truncated": true, "component_types": { "registry:component": 140 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 181, "name": "@toc-cn", "category": "Niche/single-purpose", "tags": [ "mobile", "aesthetic" ], "tagline": "Documentation-style in-page table of contents with scroll spy, animated SVG tree indicator, and mobile sticky collapsible.", "short_description": "Documentation-style in-page table of contents with scroll spy, animated SVG tree indicator, and mobile sticky collapsible.", "description": "A single-component shadcn/ui registry providing a documentation-style table of contents with IntersectionObserver scroll spy, an animated SVG tree indicator showing reading progress, and a mobile-first sticky collapsible header that expands into the full TOC. Supports nested headings with indented hierarchy. Installed via npx shadcn add from tocn.vercel.app. Built with React, Next.js, and Tailwind CSS. Free and open source. Use for: documentation sites, long-form content pages, or MDX-based docs built with Next.js that need a polished, animated in-page navigation sidebar.", "homepage": "https://tocn.vercel.app", "docs": "N/A", "github": "https://github.com/lenxism/tocn", "components_github": "https://github.com/lenxism/tocn/tree/main/registry", "github_default_branch": "main", "github_stars": 0, "last_commit": "2026-05-25T04:23:12Z", "archived": false, "license": null, "open_issues": 0, "registry_template": "https://tocn.vercel.app/r/{name}.json", "registry_index": "https://tocn.vercel.app/r/registry.json", "components": [ "table-of-contents" ], "component_items": [ { "name": "table-of-contents", "type": "registry:block", "title": "Table of Contents", "description": "In-page documentation table of contents with scroll-position spy, animated SVG tree indicator, and mobile sticky collapsible." } ], "component_count": 1, "components_truncated": false, "component_types": { "registry:block": 1 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 182, "name": "@tokenui", "category": "Design system", "tags": [ "components" ], "tagline": "Beautiful, interactive documentation components for your design tokens following industry standards.", "short_description": "Beautiful, interactive documentation components for your design tokens following industry standards.", "description": "A shadcn/ui registry of interactive documentation components for displaying design tokens, aligned with the W3C Design Tokens Community Group specification (2025.10). Implements ColorToken, SpacingToken, RadiusToken, FontFamilyToken, FontWeightToken, DurationToken, NumberToken, ElevationToken, and TypographyToken — covering most core DTCG types. TypeScript-first with full type inference. Built on shadcn/ui, extensible and framework-agnostic for React-based doc sites. Free and open source. Use for: design system documentation pages that need to render live, interactive token swatches and specs following W3C standards.", "homepage": "https://www.tokenui.dev", "docs": "https://www.tokenui.dev/docs/components/token", "github": "https://github.com/gmlnchv/token-ui", "components_github": "https://github.com/gmlnchv/token-ui/tree/main/registry", "github_default_branch": "main", "github_stars": 2, "last_commit": "2026-02-24T09:41:05Z", "archived": false, "license": null, "open_issues": 0, "registry_template": "https://www.tokenui.dev/r/{name}.json", "registry_index": "https://www.tokenui.dev/r/registry.json", "components": [ "button", "tooltip", "token", "icon-token", "color-token", "elevation-token", "duration-token", "spacing-token", "typography-token", "order-token", "radius-token", "font-family-token", "font-weight-token", "number-token", "color-swatch", "color-contrast", "color-palette" ], "component_items": [ { "name": "button", "type": "registry:ui", "title": "Button", "description": "A button component with multiple variants and sizes." }, { "name": "tooltip", "type": "registry:ui", "title": "Tooltip", "description": "A tooltip component for displaying contextual information." }, { "name": "token", "type": "registry:component", "title": "Token", "description": "A tooltip-based component for documenting design tokens. Includes TokenIndicator for visual value display." }, { "name": "icon-token", "type": "registry:component", "title": "BaseIconToken", "description": "A base token variant that renders an icon next to the token name; use it to build custom icon tokens." }, { "name": "color-token", "type": "registry:component", "title": "ColorToken", "description": "A specialized component for documenting color tokens." }, { "name": "elevation-token", "type": "registry:component", "title": "ElevationToken", "description": "A token variant with a layers icon for elevation and shadow values." }, { "name": "duration-token", "type": "registry:component", "title": "DurationToken", "description": "A token variant with a timer icon for animation or transition durations." }, { "name": "spacing-token", "type": "registry:component", "title": "SpacingToken", "description": "A token variant with a ruler icon for spacing, padding, and gap values." }, { "name": "typography-token", "type": "registry:component", "title": "TypographyToken", "description": "A token variant with a typography icon for font, size, and line-height values." }, { "name": "order-token", "type": "registry:component", "title": "OrderToken", "description": "A token variant with a layers-2 icon for z-index and stacking contexts." }, { "name": "radius-token", "type": "registry:component", "title": "RadiusToken", "description": "A token variant with a spline icon for border radius values." }, { "name": "font-family-token", "type": "registry:component", "title": "FontFamilyToken", "description": "A token variant with a type icon for font family values." }, { "name": "font-weight-token", "type": "registry:component", "title": "FontWeightToken", "description": "A token variant with a weight icon for font weight values." }, { "name": "number-token", "type": "registry:component", "title": "NumberToken", "description": "A token variant with a hash icon for numeric values like line-height." }, { "name": "color-swatch", "type": "registry:component", "title": "ColorSwatch", "description": "A primitive component for displaying a single color swatch with an optional hover label." }, { "name": "color-contrast", "type": "registry:component", "title": "ColorContrast", "description": "A component for displaying accessibility contrast algorithms visually inline, natively hooking into ColorSwatch." }, { "name": "color-palette", "type": "registry:component", "title": "ColorPalette", "description": "A component for displaying color collections including ramps, scales, and palettes" } ], "component_count": 17, "components_truncated": false, "component_types": { "registry:ui": 2, "registry:component": 15 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 183, "name": "@tool-ui", "category": "AI/chat UI", "tags": [ "ai", "dashboard" ], "tagline": "Open source React components for rendering AI tool call widgets and rich assistant outputs.", "short_description": "Open source React components for rendering AI tool call widgets and rich assistant outputs.", "description": "Open-source shadcn/ui-based copy-paste components for rendering AI tool-call results as rich interactive widgets in chat interfaces, built by the assistant-ui team. Covers ~25 components across five categories: Progress (Plan, Progress Tracker), Input (Option List, Parameter Slider, Preferences Panel, Question Flow), Display (Citation, Geo Map, Item Carousel, Link Preview, Stats Display, Terminal, Weather Widget), Artifacts (Chart, Code Block, Code Diff, Data Table, Instagram Post, LinkedIn Post, Message Draft, X Post), Confirmation (Approval Card, Order Summary), and Media (Audio, Image, Image Gallery, Video). Each component includes a Zod schema for payload validation. Free MIT. Use for: AI chat applications that need to surface structured tool call outputs as interactive, user-friendly UI rather than raw JSON.", "homepage": "https://www.tool-ui.com", "docs": "https://www.tool-ui.com/docs/overview", "github": "https://github.com/assistant-ui/tool-ui", "components_github": null, "github_default_branch": "main", "github_stars": 746, "last_commit": "2026-05-09T09:41:22Z", "archived": false, "license": "MIT", "open_issues": 1, "registry_template": "https://www.tool-ui.com/r/{name}.json", "registry_index": "https://www.tool-ui.com/r/registry.json", "components": [ "approval-card", "audio", "chart", "citation", "code-block", "code-diff", "data-table", "geo-map", "image", "image-gallery", "instagram-post", "item-carousel", "link-preview", "linkedin-post", "message-draft", "option-list", "order-summary", "parameter-slider", "plan", "preferences-panel", "progress-tracker", "question-flow", "stats-display", "terminal", "video", "weather-widget", "x-post" ], "component_items": [ { "name": "approval-card", "type": "registry:block", "title": "Approval Card", "description": "Binary confirmation for agent actions." }, { "name": "audio", "type": "registry:block", "title": "Audio", "description": "Audio playback with artwork and metadata." }, { "name": "chart", "type": "registry:block", "title": "Chart", "description": "Visualize data with interactive charts." }, { "name": "citation", "type": "registry:block", "title": "Citation", "description": "Display source references with attribution." }, { "name": "code-block", "type": "registry:block", "title": "Code Block", "description": "Display syntax-highlighted code snippets." }, { "name": "code-diff", "type": "registry:block", "title": "Code Diff", "description": "Code Diff component for AI interfaces." }, { "name": "data-table", "type": "registry:block", "title": "Data Table", "description": "Sortable, responsive data tables for tool call results." }, { "name": "geo-map", "type": "registry:block", "title": "Geo Map", "description": "Display geolocated entities and fleet positions." }, { "name": "image", "type": "registry:block", "title": "Image", "description": "Display images with metadata and attribution." }, { "name": "image-gallery", "type": "registry:block", "title": "Image Gallery", "description": "Grid layout for browsing image collections." }, { "name": "instagram-post", "type": "registry:block", "title": "Instagram Post", "description": "Render Instagram post previews." }, { "name": "item-carousel", "type": "registry:block", "title": "Item Carousel", "description": "Horizontal carousel for browsing collections." }, { "name": "link-preview", "type": "registry:block", "title": "Link Preview", "description": "Rich link previews with OG data." }, { "name": "linkedin-post", "type": "registry:block", "title": "Linkedin Post", "description": "Render LinkedIn post previews." }, { "name": "message-draft", "type": "registry:block", "title": "Message Draft", "description": "Review and confirm drafted messages before sending." }, { "name": "option-list", "type": "registry:block", "title": "Option List", "description": "Single or multi-select choices with confirmation actions." }, { "name": "order-summary", "type": "registry:block", "title": "Order Summary", "description": "Itemized purchase confirmation with pricing." }, { "name": "parameter-slider", "type": "registry:block", "title": "Parameter Slider", "description": "Numeric parameter adjustment controls." }, { "name": "plan", "type": "registry:block", "title": "Plan", "description": "Display step-by-step task workflows in AI interfaces." }, { "name": "preferences-panel", "type": "registry:block", "title": "Preferences Panel", "description": "Compact settings panel for user preferences." }, { "name": "progress-tracker", "type": "registry:block", "title": "Progress Tracker", "description": "Show real-time status feedback for multi-step operations in AI interfaces." }, { "name": "question-flow", "type": "registry:block", "title": "Question Flow", "description": "Multi-step guided questions with branching." }, { "name": "stats-display", "type": "registry:block", "title": "Stats Display", "description": "Display key metrics in compact cards." }, { "name": "terminal", "type": "registry:block", "title": "Terminal", "description": "Show command-line output and logs." }, { "name": "video", "type": "registry:block", "title": "Video", "description": "Video playback with controls and poster." }, { "name": "weather-widget", "type": "registry:block", "title": "Weather Widget", "description": "Display weather conditions and forecasts." }, { "name": "x-post", "type": "registry:block", "title": "X Post", "description": "Render X (Twitter) post previews." } ], "component_count": 27, "components_truncated": false, "component_types": { "registry:block": 27 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 184, "name": "@tour", "category": "Niche/single-purpose", "tags": [ "saas" ], "tagline": "A component for building onboarding tours. Designed to integrate with shadcn/ui.", "short_description": "A component for building onboarding tours. Designed to integrate with shadcn/ui.", "description": "A single shadcn/ui-compatible component for building interactive product onboarding tours in React applications. Handles step sequencing, popover positioning relative to target elements, and progression controls, designed to integrate directly with shadcn/ui's existing Popover and Dialog primitives and Tailwind CSS styling. Free and open source (MIT). Use for: SaaS or internal tool UIs that need a lightweight, shadcn-native step-by-step onboarding tour without pulling in a heavyweight third-party tour library.", "homepage": "https://onboarding-tour.vercel.app", "docs": "https://onboarding-tour.vercel.app/docs", "github": "https://github.com/tonghohin/tour", "components_github": "https://github.com/tonghohin/tour/tree/main/registry", "github_default_branch": "main", "github_stars": 65, "last_commit": "2026-01-06T21:47:45Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://onboarding-tour.vercel.app/r/{name}.json", "registry_index": "https://onboarding-tour.vercel.app/r/registry.json", "components": [ "tour" ], "component_items": [ { "name": "tour", "type": "registry:ui", "title": "Tour", "description": "A tour component." } ], "component_count": 1, "components_truncated": false, "component_types": { "registry:ui": 1 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 185, "name": "@trophy-ui", "category": "Niche/single-purpose", "tags": [ "saas", "dashboard" ], "tagline": "Open-source gamification UI components for streaks, achievements, leaderboards, points, and more. Built on shadcn/ui and Tailwind CSS.", "short_description": "Open-source gamification UI components for streaks, achievements, leaderboards, points, and more. Built on shadcn/ui and Tailwind CSS.", "description": "Open-source gamification UI component library built on shadcn/ui and Tailwind CSS v4, maintained by Trophy. Provides ready-made components for streaks (StreakBadge), achievements (Achievement), leaderboards (LeaderboardCard), points, XP charts (PointsChart), levels, and event banners. Components are pulled individually via the shadcn CLI using Trophy's registry URL. Requires React 18+, Tailwind CSS v4, and an initialized shadcn/ui project. Free and MIT-licensed. Use for: SaaS apps, learning platforms, or consumer products adding gamification mechanics (streaks, XP, leaderboards) that need prebuilt, themeable display components rather than building from scratch.", "homepage": "https://ui.trophy.so", "docs": "https://ui.trophy.so/docs", "github": "https://github.com/trophyso/ui", "components_github": null, "github_default_branch": "main", "github_stars": 109, "last_commit": "2026-06-02T13:06:01Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://ui.trophy.so/r/{name}.json", "registry_index": "https://ui.trophy.so/r/registry.json", "components": [ "index", "streak-badge", "streak-calendar", "streak-card", "achievement-badge", "achievement-grid", "achievement-list", "achievement-unlocked", "achievement-card", "leaderboard-rankings", "leaderboard-podium", "leaderboard-card", "points-badge", "points-chart", "points-awards", "points-levels-timeline", "points-levels-list", "points-boost" ], "component_items": [ { "name": "index", "type": "registry:style", "title": null, "description": null }, { "name": "streak-badge", "type": "registry:ui", "title": "Streak Badge", "description": "React streak counter UI in a compact badge supporting daily, weekly, monthly or yearly streaks. Built on shadcn/ui + Tailwind. Open source." }, { "name": "streak-calendar", "type": "registry:ui", "title": "Streak Calendar", "description": "React streak calendar for gamification—week, month, and git-style grids to visualize consistency. Native support for streak freezes. Ideal streak UI design for…" }, { "name": "streak-card", "type": "registry:ui", "title": "Streak Card", "description": "Full streak UI card for React. Daily streak display, longest streak record with optional section for streak rules. Built on shadcn/ui + Tailwind. Open source." }, { "name": "achievement-badge", "type": "registry:ui", "title": "Achievement Badge", "description": "Open source React achievement badge component with locked/unlocked states, progress rings and rarity support. Use for achievement UI design and collections. Bu…" }, { "name": "achievement-grid", "type": "registry:ui", "title": "Achievement Grid", "description": "Responsive React achievement grid for displaying collections of badges with progress and rarity across breakpoints. Ideal achievement UI design for galleries a…" }, { "name": "achievement-list", "type": "registry:ui", "title": "Achievement List", "description": "Vertical React achievement list with icons, descriptions, and optional progress for dense achievement UI. Complements grids and cards in gamification dashboard…" }, { "name": "achievement-unlocked", "type": "registry:ui", "title": "Achievement Unlocked", "description": "Celebratory React dialog for newly unlocked achievements with headline, badge, and share actions. Use for unlock moments, level up animations and more. Built o…" }, { "name": "achievement-card", "type": "registry:ui", "title": "Achievement Card", "description": "React achievement card with totals, featured badges, and scrollable lists for profile and progress surfaces. Fits achievement UI examples in SaaS, consumer and…" }, { "name": "leaderboard-rankings", "type": "registry:ui", "title": "Leaderboard Rankings", "description": "React leaderboard rankings list—avatars, scores, bylines, and crown highlights for full tables. Open-source leaderboard UI for games, communities, and SaaS cha…" }, { "name": "leaderboard-podium", "type": "registry:ui", "title": "Leaderboard Podium", "description": "Top-three React leaderboard podium with crowns, avatars, and ranks for competitive gamification. Leaderboard UI component for highlights and recap screens. Bui…" }, { "name": "leaderboard-card", "type": "registry:ui", "title": "Leaderboard Card", "description": "React leaderboard component that composes title, date range, podium, and rankings—one card for competitive gamification UIs. Fits Next.js and React apps. Built…" }, { "name": "points-badge", "type": "registry:ui", "title": "Points Badge", "description": "Compact React points badge for totals and currency-style scores in gamification UIs. Fits XP-style displays alongside charts and lists. Built on shadcn/ui + Ta…" }, { "name": "points-chart", "type": "registry:ui", "title": "Points Chart", "description": "React chart for points over time. Displays trends, campaigns, and seasonality in gamification analytics views. Complements badges and levels. Built on Recharts…" }, { "name": "points-awards", "type": "registry:ui", "title": "Points Awards", "description": "React points activity feed with dated events, totals, and trigger types for gamification timelines. Useful for XP and currency ledgers in dashboards. Built on …" }, { "name": "points-levels-timeline", "type": "registry:ui", "title": "Points Levels Timeline", "description": "Vertical React timeline for level progression. Supports sub-levels, thresholds, and level progress for gamification roadmaps. Complements Points Levels List. B…" }, { "name": "points-levels-list", "type": "registry:ui", "title": "Points Levels List", "description": "React levels list with optional progress bar between tiers. Built on shadcn/ui + Tailwind. Open source." }, { "name": "points-boost", "type": "registry:ui", "title": "Points Boost", "description": "React callout for points multipliers and limited-time boosts. Supports optional countdown for near-ending gamification campaigns. Built on shadcn/ui + Tailwind…" } ], "component_count": 18, "components_truncated": false, "component_types": { "registry:style": 1, "registry:ui": 17 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 186, "name": "@turbopills-ui", "category": "Niche/single-purpose", "tags": [ "components" ], "tagline": "Beautiful, accessible, and customizable React components for your telehealth applications.", "short_description": "Beautiful, accessible, and customizable React components for your telehealth applications.", "description": "A React component library purpose-built for telehealth and healthcare application UIs. Documented components include Input, Masked Input, Multiple Choice, Single Choice, and Progress — form-oriented primitives suited to patient intake flows, clinical questionnaires, and prescription/medication management interfaces. Built with Tailwind CSS and shadcn/ui conventions. No public GitHub listed; commercial product origin. Use for: telehealth platforms, patient-facing apps, or health-tech products that need accessible, healthcare-appropriate form components without building branded clinical UI patterns from scratch.", "homepage": "https://www.turbopills.com/ui/docs", "docs": "https://www.turbopills.com/ui/docs", "github": "N/A", "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://ui.turbopills.com/r/{name}.json", "registry_index": "https://ui.turbopills.com/r/registry.json", "components": [ "before-after-card", "bmi-card", "input", "masked-input", "multiple-choice", "single-choice", "progress-cells", "progress-stretch", "progress-numbered", "progress-solid" ], "component_items": [ { "name": "before-after-card", "type": "registry:block", "title": "Before / After Card", "description": "A before/after image card with a footer badge." }, { "name": "bmi-card", "type": "registry:block", "title": "BMI Card", "description": "A configurable BMI indicator ring with thresholds and tooltip." }, { "name": "input", "type": "registry:component", "title": "Input", "description": "Input field with title, hint, suffix and error message." }, { "name": "masked-input", "type": "registry:component", "title": "Masked Input", "description": "Masked input with presets (tel/date) and optional calendar picker." }, { "name": "multiple-choice", "type": "registry:component", "title": "Multiple Choice", "description": "Multiple choice field with optional max selections." }, { "name": "single-choice", "type": "registry:component", "title": "Single Choice", "description": "Single choice field (list or cells) with optional deselect." }, { "name": "progress-cells", "type": "registry:component", "title": "Progress (Cells)", "description": "Segmented progress bar with optional labels/tooltips." }, { "name": "progress-stretch", "type": "registry:component", "title": "Progress (Stretch)", "description": "Progress with expanding current step." }, { "name": "progress-numbered", "type": "registry:component", "title": "Progress (Numbered)", "description": "Numbered step progress with collapse/ellipsis." }, { "name": "progress-solid", "type": "registry:component", "title": "Progress (Solid)", "description": "Simple solid progress bar." } ], "component_count": 10, "components_truncated": false, "component_types": { "registry:block": 2, "registry:component": 8 }, "has_logo": true, "enrichment_errors": [ "github_lookup_failed" ], "featured": false }, { "number": 187, "name": "@typedora-ui", "category": "Hooks/utilities", "tags": [ "aesthetic", "components" ], "tagline": "Typedora UI is a next-generation extension layer for shadcn/ui, designed to bring full type-safety to your UI components.", "short_description": "Typedora UI is a next-generation extension layer for shadcn/ui, designed to bring full type-safety to your UI components.", "description": "A type-safety extension layer for shadcn/ui that adds full TypeScript inference to interactive components. Provides TypedSelect, TypedRadioGroup, and Combobox with strongly-typed option arrays and event handlers, plus a registry-driven architecture for schema-to-UI mapping and field metadata helpers. Integrates cleanly with TanStack Form, React Hook Form, and Zod. Drop-in shadcn/ui replacement aesthetic with zero runtime cost. Built with React 18+, Tailwind CSS, and Radix primitives. Free and open source. Use for: large TypeScript codebases or design systems where eliminating any-types in form and select components is a priority and full type inference across component APIs is required.", "homepage": "https://typedora-ui.netlify.app", "docs": "https://typedora-ui.netlify.app/docs", "github": "https://github.com/nguyenphutrong/typedora-ui", "components_github": "https://github.com/nguyenphutrong/typedora-ui/tree/master/registry", "github_default_branch": "master", "github_stars": 10, "last_commit": "2025-12-08T13:56:29Z", "archived": false, "license": null, "open_issues": 0, "registry_template": "https://typedora-ui.netlify.app/r/{name}.json", "registry_index": "https://typedora-ui.netlify.app/r/registry.json", "components": [ "typed-utils", "typed-select", "typed-radio-group", "typed-combobox" ], "component_items": [ { "name": "typed-utils", "type": "registry:lib", "title": "Typed Utils", "description": "Shared utility types for typed components." }, { "name": "typed-select", "type": "registry:component", "title": "TypedSelect", "description": "A headless, type-safe select component with full TypeScript inference and customizable rendering." }, { "name": "typed-radio-group", "type": "registry:component", "title": "TypedRadioGroup", "description": "A headless, type-safe radio group component with full TypeScript inference and customizable rendering." }, { "name": "typed-combobox", "type": "registry:component", "title": "TypedCombobox", "description": "A headless, type-safe combobox component with search functionality, full TypeScript inference, and customizable rendering." } ], "component_count": 4, "components_truncated": false, "component_types": { "registry:lib": 1, "registry:component": 3 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 188, "name": "@ui-layouts", "category": "Animated components", "tags": [ "saas", "aesthetic" ], "tagline": "UI Layouts offers components, effects, design tools, and ready-made blocks that make building modern interfaces more efficient—built with React, Next.js, Tailwind CSS, and shadcn/ui.", "short_description": "UI Layouts offers components, effects, design tools, and ready-made blocks that make building modern interfaces more efficient—built with React, Next.js, Tailwind CSS, and shadcn/ui.", "description": "An open-source creative component library focused on advanced animations and visual effects for React/Next.js, built primarily with Framer Motion (motion) and Tailwind CSS. Components include R3F Blob (Three.js), Image Ripple Effect, Image Mousetrail, Image Reveal, Blur Vignette, Liquid Glass, Liquid Gradient, Mesh Gradients, Shimmer Loader, Motion Number, Drag Items, Horizontal Scroll, Globe, Marquee, Randomized Text Effect, Color Picker, Directional Drawer, Motion Drawer, Gallery Modal, and more — totalling 40+ unique effects. Also includes a Labs section for experiments. Free and open source. Use for: marketing sites, portfolios, and creative web apps that need striking motion effects and interactive visual components beyond standard Tailwind utility patterns.", "homepage": "https://ui-layouts.com/", "docs": "https://www.ui-layouts.com/get-started", "github": "https://github.com/ui-layouts/uilayouts", "components_github": null, "github_default_branch": "main", "github_stars": 3510, "last_commit": "2026-07-05T09:48:01Z", "archived": false, "license": "MIT", "open_issues": 8, "registry_template": "https://ui-layouts.com/r/{name}.json", "registry_index": "https://ui-layouts.com/r/registry.json", "components": [ "btn-bg-shine", "btn-animated-gradient", "button-active", "button-hover-right", "btn-creative-right", "btn-creative-top", "btn-click-down", "btn-hover-down", "btn-hover-multiple", "btn-hover-underline", "btn-hover-top-flip", "btn-hover-left-flip", "btn-hover-top-slowflip", "btn-text-change", "btn-cross-arrow", "btn-black-shadow", "btn-hover-outline", "btn-arrow-right", "btn-rotating-gradient", "color-picker", "default-color-picker", "raws-color-picker", "motion-number-upvotes", "motion-number-input", "motion-number-slider", "number-flow-trading", "noise-effect", "scroll-text", "text-scroll-animation", "scroll-text-marquee", "scroll-text-marquee-unidirectional", "scroll-text-marquee-bidirectional", "randomized-text-effect", "randomized-text-unveil", "globe", "card-globe", "card-globe-white", "img-ripple-effect", "r3f-blob", "mesh-shadergradient", "mesh-gradient-background3", "mesh-gradient-background2", "mesh-gradient-background", "animated-logo-footer", "hover-footer", "responsive-header", "responsive-header-default", "boxgrid", "conditionGrid", "normalGrid", "buyme-acoffee", "stripecard", "creative-hover-card", "stripecard2", "hovercard1", "hovercard2", "hovercard3", "hovercard4", "productcard1", "productcard2", "productcard3", "productcard4", "productcard5", "productcard6", "creative-clippath", "corporate-clippath", "symbolic-clippath", "creative-mask-clippath", "watersplash-clippath", "creative-imagemasking", "animal-imagemasking", "watersplash-imagemasking", "center-imagemasking", "fixedbg-imagemasking", "creative-videomasking", "splashwater-videomasking", "textoverlay-videomasking", "hexagon-videomasking", "hexagon2-videomasking", "progressive-carousel", "horizontal-progressive-carousel", "vertical-progressive-carousel", "image-hover-accordion", "tailwind-image-accordion", "image-tab1", "image-tab2", "img-tabs-standalone", "magnified-doc", "magnified-tab", "tabs", "animated-tabs", "creative-tab", "register-tab", "swapy", "default-swapy", "opacity-swapy", "swapy-handle", "swapy-without-components", "drag-items", "timeline-animation" ], "component_items": [ { "name": "btn-bg-shine", "type": "registry:component", "title": null, "description": null }, { "name": "btn-animated-gradient", "type": "registry:component", "title": null, "description": null }, { "name": "button-active", "type": "registry:component", "title": null, "description": null }, { "name": "button-hover-right", "type": "registry:component", "title": null, "description": null }, { "name": "btn-creative-right", "type": "registry:component", "title": null, "description": null }, { "name": "btn-creative-top", "type": "registry:component", "title": null, "description": null }, { "name": "btn-click-down", "type": "registry:component", "title": null, "description": null }, { "name": "btn-hover-down", "type": "registry:component", "title": null, "description": null }, { "name": "btn-hover-multiple", "type": "registry:component", "title": null, "description": null }, { "name": "btn-hover-underline", "type": "registry:component", "title": null, "description": null }, { "name": "btn-hover-top-flip", "type": "registry:component", "title": null, "description": null }, { "name": "btn-hover-left-flip", "type": "registry:component", "title": null, "description": null }, { "name": "btn-hover-top-slowflip", "type": "registry:component", "title": null, "description": null }, { "name": "btn-text-change", "type": "registry:component", "title": null, "description": null }, { "name": "btn-cross-arrow", "type": "registry:component", "title": null, "description": null }, { "name": "btn-black-shadow", "type": "registry:component", "title": null, "description": null }, { "name": "btn-hover-outline", "type": "registry:component", "title": null, "description": null }, { "name": "btn-arrow-right", "type": "registry:component", "title": null, "description": null }, { "name": "btn-rotating-gradient", "type": "registry:component", "title": null, "description": null }, { "name": "color-picker", "type": "registry:component", "title": null, "description": null }, { "name": "default-color-picker", "type": "registry:component", "title": null, "description": null }, { "name": "raws-color-picker", "type": "registry:component", "title": null, "description": null }, { "name": "motion-number-upvotes", "type": "registry:component", "title": null, "description": null }, { "name": "motion-number-input", "type": "registry:component", "title": null, "description": null }, { "name": "motion-number-slider", "type": "registry:component", "title": null, "description": null }, { "name": "number-flow-trading", "type": "registry:component", "title": null, "description": null }, { "name": "noise-effect", "type": "registry:component", "title": null, "description": null }, { "name": "scroll-text", "type": "registry:component", "title": null, "description": null }, { "name": "text-scroll-animation", "type": "registry:component", "title": null, "description": null }, { "name": "scroll-text-marquee", "type": "registry:component", "title": null, "description": null }, { "name": "scroll-text-marquee-unidirectional", "type": "registry:component", "title": null, "description": null }, { "name": "scroll-text-marquee-bidirectional", "type": "registry:component", "title": null, "description": null }, { "name": "randomized-text-effect", "type": "registry:component", "title": null, "description": null }, { "name": "randomized-text-unveil", "type": "registry:component", "title": null, "description": null }, { "name": "globe", "type": "registry:component", "title": null, "description": null }, { "name": "card-globe", "type": "registry:component", "title": null, "description": null }, { "name": "card-globe-white", "type": "registry:component", "title": null, "description": null }, { "name": "img-ripple-effect", "type": "registry:component", "title": null, "description": null }, { "name": "r3f-blob", "type": "registry:component", "title": null, "description": null }, { "name": "mesh-shadergradient", "type": "registry:component", "title": null, "description": null }, { "name": "mesh-gradient-background3", "type": "registry:component", "title": null, "description": null }, { "name": "mesh-gradient-background2", "type": "registry:component", "title": null, "description": null }, { "name": "mesh-gradient-background", "type": "registry:component", "title": null, "description": null }, { "name": "animated-logo-footer", "type": "registry:component", "title": null, "description": null }, { "name": "hover-footer", "type": "registry:component", "title": null, "description": null }, { "name": "responsive-header", "type": "registry:component", "title": null, "description": null }, { "name": "responsive-header-default", "type": "registry:component", "title": null, "description": null }, { "name": "boxgrid", "type": "registry:component", "title": null, "description": null }, { "name": "conditionGrid", "type": "registry:component", "title": null, "description": null }, { "name": "normalGrid", "type": "registry:component", "title": null, "description": null }, { "name": "buyme-acoffee", "type": "registry:component", "title": null, "description": null }, { "name": "stripecard", "type": "registry:component", "title": null, "description": null }, { "name": "creative-hover-card", "type": "registry:component", "title": null, "description": null }, { "name": "stripecard2", "type": "registry:component", "title": null, "description": null }, { "name": "hovercard1", "type": "registry:component", "title": null, "description": null }, { "name": "hovercard2", "type": "registry:component", "title": null, "description": null }, { "name": "hovercard3", "type": "registry:component", "title": null, "description": null }, { "name": "hovercard4", "type": "registry:component", "title": null, "description": null }, { "name": "productcard1", "type": "registry:component", "title": null, "description": null }, { "name": "productcard2", "type": "registry:component", "title": null, "description": null } ], "component_count": 327, "components_truncated": true, "component_types": { "registry:component": 253, "registry:block": 74 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 189, "name": "@uicapsule", "category": "Personal/portfolio registry", "tags": [ "ai", "dashboard", "mobile", "aesthetic" ], "tagline": "A curated collection of components that spark joy. Featuring interactive concepts, design experiments, and components in the intersection of AI/UI.", "short_description": "A curated collection of components that spark joy. Featuring interactive concepts, design experiments, and components in the intersection of AI/UI.", "description": "A curated personal collection of interactive React UI experiments and design concepts by Kaiyu Hsu, spanning ~25 components. Includes ASCII Renderer, Particle Orb, Geometric Orb, Gradient Orb, Wireframe Orb, Card Stack, Carousel 3D, Dynamic Island, Expanding Header Menu, Infinite Grid, iOS Volume Slider, Light/Dark Toggle, Like Button, Line Chart, Radial Slider, Sidebar, Snail Timer, Spinner Pixel Grid, Spreadsheet, Tooltip Grid, Voice Dictator, and Emerald Template. Built with React, Next.js, and Tailwind CSS. Organized by Styles, Elements, and Categories. Free and open source. Use for: sourcing unconventional, design-experiment-quality interactive widgets — particularly orb/particle effects, creative nav patterns, and novel input controls — for portfolios or products that want distinctive UI moments.", "homepage": "https://uicapsule.com", "docs": "N/A", "github": "https://github.com/kyh/uicapsule", "components_github": null, "github_default_branch": "main", "github_stars": 19, "last_commit": "2026-07-07T13:56:25Z", "archived": false, "license": "MIT", "open_issues": 39, "registry_template": "https://uicapsule.com/r/{name}.json", "registry_index": "https://uicapsule.com/r/registry.json", "components": [ "ascii-renderer", "background-pixel-stars", "background-shapes", "card-stack", "carousel-3d", "dynamic-ai-composer", "dynamic-island", "emerald-template", "expanding-header-menu", "feed", "filter-bar", "geometric-orb", "gradient-orb", "infinite-grid", "ios-volume-slider", "light-dark-toggle", "like-button", "particle-orb", "radial-slider", "sidebar", "snail-timer", "spinner-pixel-grid", "spreadsheet", "tesla-climate", "tooltip-grid", "voice-dictator", "wireframe-orb" ], "component_items": [ { "name": "ascii-renderer", "type": "registry:block", "title": null, "description": null }, { "name": "background-pixel-stars", "type": "registry:block", "title": null, "description": null }, { "name": "background-shapes", "type": "registry:block", "title": null, "description": null }, { "name": "card-stack", "type": "registry:block", "title": null, "description": null }, { "name": "carousel-3d", "type": "registry:block", "title": null, "description": null }, { "name": "dynamic-ai-composer", "type": "registry:block", "title": null, "description": null }, { "name": "dynamic-island", "type": "registry:block", "title": null, "description": null }, { "name": "emerald-template", "type": "registry:block", "title": null, "description": null }, { "name": "expanding-header-menu", "type": "registry:block", "title": null, "description": null }, { "name": "feed", "type": "registry:block", "title": null, "description": null }, { "name": "filter-bar", "type": "registry:block", "title": null, "description": null }, { "name": "geometric-orb", "type": "registry:block", "title": null, "description": null }, { "name": "gradient-orb", "type": "registry:block", "title": null, "description": null }, { "name": "infinite-grid", "type": "registry:block", "title": null, "description": null }, { "name": "ios-volume-slider", "type": "registry:block", "title": null, "description": null }, { "name": "light-dark-toggle", "type": "registry:block", "title": null, "description": null }, { "name": "like-button", "type": "registry:block", "title": null, "description": null }, { "name": "particle-orb", "type": "registry:block", "title": null, "description": null }, { "name": "radial-slider", "type": "registry:block", "title": null, "description": null }, { "name": "sidebar", "type": "registry:block", "title": null, "description": null }, { "name": "snail-timer", "type": "registry:block", "title": null, "description": null }, { "name": "spinner-pixel-grid", "type": "registry:block", "title": null, "description": null }, { "name": "spreadsheet", "type": "registry:block", "title": null, "description": null }, { "name": "tesla-climate", "type": "registry:block", "title": null, "description": null }, { "name": "tooltip-grid", "type": "registry:block", "title": null, "description": null }, { "name": "voice-dictator", "type": "registry:block", "title": null, "description": null }, { "name": "wireframe-orb", "type": "registry:block", "title": null, "description": null } ], "component_count": 27, "components_truncated": false, "component_types": { "registry:block": 27 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 190, "name": "@uitripled", "category": "Animated components", "tags": [ "aesthetic" ], "tagline": "An open-source, Production-ready UI components and blocks powered by shadcn/ui and Framer Motion", "short_description": "An open-source, Production-ready UI components and blocks powered by shadcn/ui and Framer Motion", "description": "Open-source production-ready UI registry built on shadcn/ui, Base UI, and Framer Motion, structured as a Turborepo monorepo targeting React 19 and Next.js. Offers components, full landing-page blocks, a drag-and-drop Landing Builder for assembling pages, a Background Builder for shader-powered aurora backgrounds, and a Grid Generator for Tailwind CSS layouts. TypeScript throughout. Fully free and MIT-licensed. Use for: projects that need high-motion landing blocks plus flexible background and grid tooling all sourced from one registry.", "homepage": "https://ui.tripled.work", "docs": "N/A", "github": "https://github.com/moumen-soliman/uitripled", "components_github": null, "github_default_branch": "master", "github_stars": 1272, "last_commit": "2026-06-27T21:28:49Z", "archived": false, "license": "MIT", "open_issues": 1, "registry_template": "https://ui.tripled.work/r/{name}.json", "registry_index": "https://ui.tripled.work/r/registry.json", "components": [ "about-us-page-shadcnui", "about-us-section-baseui", "about-us-section-shadcnui", "ai-chat-interface-shadcnui", "ai-glow-input-shadcnui", "ai-loading-skeleton-shadcnui", "ai-response-typing-shadcnui", "ai-unlock-animation-shadcnui", "animated-accordion-shadcnui", "animated-card-stack-baseui", "animated-card-stack-shadcnui", "animated-checkbox-shadcnui", "animated-dialog-shadcnui", "animated-list-shadcnui", "animated-navbar-shadcnui", "animated-pagination-shadcnui", "animated-profile-menu-shadcnui", "animated-progress-shadcnui", "animated-quote-block-shadcnui", "animated-radio-shadcnui", "animated-select-shadcnui", "animated-sidebar-shadcnui", "animated-tabs-shadcnui", "animated-tooltip-shadcnui", "auto-revealing-heading-shadcnui", "avatar-group-shadcnui", "bento-grid-block-baseui", "bento-grid-block-shadcnui", "blog-block-baseui", "blog-block-shadcnui", "blog-typography-shadcnui", "bottom-modal", "browse-folder-baseui", "browse-folder-shadcnui", "cards-slider-shadcnui", "cash-flow-chart", "chat-app-shadcnui", "cinema-ticket-baseui", "cinema-ticket-shadcnui", "command-palette-shadcnui", "comment-thread-shadcnui", "conference-ticket-baseui", "conference-ticket-shadcnui", "contact-block-baseui", "contact-block-shadcnui", "contact-form-section-baseui", "contact-form-section-shadcnui", "context-menu-bubble-shadcnui", "context-menu-shadcnui", "course-content-page-shadcnui", "credit-card-baseui", "credit-card-shadcnui", "cta-banner-section-baseui", "cta-banner-section-shadcnui", "cta-block-baseui", "cta-block-shadcnui", "cta-hero-block-baseui", "cta-hero-block-shadcnui", "currency-converter-card-baseui", "currency-converter-card-shadcnui", "dashboard-baseui", "dashboard-shadcnui", "detail-task-card-baseui", "detail-task-card-shadcnui", "drag-to-confirm-slider-shadcnui", "draggable-list-shadcnui", "dynamic-spotlight-cta-shadcnui", "dynamic-tag-cloud-shadcnui", "ecommerce-highlight-card-baseui", "ecommerce-highlight-card-shadcnui", "elastic-switch-shadcnui", "expanding-search-dock-shadcnui", "fade-slide-modal-shadcnui", "faq-accordion-block-baseui", "faq-accordion-block-shadcnui", "faq-section-baseui", "faq-section-shadcnui", "feature-cards-block-baseui", "feature-cards-block-shadcnui", "feature-comparison-block-baseui", "feature-comparison-block-shadcnui", "feature-grid-section-baseui", "feature-grid-section-shadcnui", "floating-chat-widget-shadcnui", "floating-gradient-shadcnui", "floating-info-panel-shadcnui", "floating-label-input-shadcnui", "fluid-modal-transition-shadcnui", "folder-animation", "folder-animation-carbon", "footer-block-baseui", "footer-block-shadcnui", "gallery-grid-block-baseui", "gallery-grid-block-shadcnui", "glass-account-settings-card-shadcnui", "glass-blog-card-baseui", "glass-blog-card-shadcnui", "glass-checkout-card-baseui", "glass-checkout-card-shadcnui", "glass-forgot-password-card-shadcnui" ], "component_items": [ { "name": "about-us-page-shadcnui", "type": "registry:page", "title": "About Us Page", "description": "Glassmorphism about page showcasing mission, values, and leadership with motion accents." }, { "name": "about-us-section-baseui", "type": "registry:block", "title": "About Us", "description": "About us section with value cards, icons, and animated reveal effects (Base UI)" }, { "name": "about-us-section-shadcnui", "type": "registry:block", "title": "About Us", "description": "About us section with value cards, icons, and animated reveal effects" }, { "name": "ai-chat-interface-shadcnui", "type": "registry:component", "title": "AI Chat Interface", "description": "Chat input with attachments, model selector, and accessible controls" }, { "name": "ai-glow-input-shadcnui", "type": "registry:component", "title": "AI Glow Input", "description": "Input field with dynamic glow that pulses based on typing speed - smart motion feedback" }, { "name": "ai-loading-skeleton-shadcnui", "type": "registry:component", "title": "AI Loading Skeleton", "description": "Loading state with diagonal shimmer gradient and opacity wave" }, { "name": "ai-response-typing-shadcnui", "type": "registry:component", "title": "AI Response Typing Stream", "description": "Character-by-character typing animation with natural pauses and thinking states" }, { "name": "ai-unlock-animation-shadcnui", "type": "registry:ui", "title": "AI Unlock Animation", "description": "Premium unlock animation with particles, ripples, and loading states" }, { "name": "animated-accordion-shadcnui", "type": "registry:component", "title": "Animated Accordion", "description": "Accordion with smooth expand/collapse and rotate arrow" }, { "name": "animated-card-stack-baseui", "type": "registry:component", "title": "Animated Card Stack", "description": "Stacked cards that expand on hover (Base UI)" }, { "name": "animated-card-stack-shadcnui", "type": "registry:component", "title": "Animated Card Stack", "description": "Stacked cards that expand on hover" }, { "name": "animated-checkbox-shadcnui", "type": "registry:component", "title": "Animated Checkbox", "description": "Checkbox with checkmark animation" }, { "name": "animated-dialog-shadcnui", "type": "registry:component", "title": "Animated Dialog", "description": "Modal dialog with backdrop fade and spring animation" }, { "name": "animated-list-shadcnui", "type": "registry:component", "title": "Animated List", "description": "List with staggered item animations" }, { "name": "animated-navbar-shadcnui", "type": "registry:component", "title": "Animated Navbar", "description": "Navigation bar with animated underline indicator" }, { "name": "animated-pagination-shadcnui", "type": "registry:component", "title": "Animated Pagination", "description": "Pagination with smooth page transition indicator" }, { "name": "animated-profile-menu-shadcnui", "type": "registry:component", "title": "Animated Profile Menu", "description": "Floating profile avatar that reveals quick action cards with smooth motion" }, { "name": "animated-progress-shadcnui", "type": "registry:ui", "title": "Animated Progress Bar", "description": "Progress bar with smooth animation" }, { "name": "animated-quote-block-shadcnui", "type": "registry:ui", "title": "Animated Quote Block", "description": "Quote that types itself in, pauses, then subtly breathes" }, { "name": "animated-radio-shadcnui", "type": "registry:component", "title": "Animated Radio", "description": "Radio button group with selection ripple" }, { "name": "animated-select-shadcnui", "type": "registry:component", "title": "Animated Select", "description": "Select dropdown with smooth open/close animation" }, { "name": "animated-sidebar-shadcnui", "type": "registry:component", "title": "Animated Sidebar", "description": "Sidebar with slide-in animation and overlay" }, { "name": "animated-tabs-shadcnui", "type": "registry:component", "title": "Animated Tabs", "description": "Tabs with sliding indicator animation" }, { "name": "animated-tooltip-shadcnui", "type": "registry:component", "title": "Animated Tooltip", "description": "Tooltip with delay and slide animation" }, { "name": "auto-revealing-heading-shadcnui", "type": "registry:page", "title": "Auto-Revealing Heading", "description": "Heading that reveals each letter/word with staggered motion on scroll" }, { "name": "avatar-group-shadcnui", "type": "registry:component", "title": "Avatar Group", "description": "Stacked avatar group with hover reveal and tooltips" }, { "name": "bento-grid-block-baseui", "type": "registry:block", "title": "Bento Grid Block", "description": "Layered bento grid with imagery, metrics, and smooth motion reveals (Base UI)" }, { "name": "bento-grid-block-shadcnui", "type": "registry:block", "title": "Bento Grid Block", "description": "Layered bento grid with imagery, metrics, and smooth motion reveals" }, { "name": "blog-block-baseui", "type": "registry:block", "title": "Blog Block", "description": "Animated blog posts grid with staggered cards, date/time indicators, and hover effects (Base UI)" }, { "name": "blog-block-shadcnui", "type": "registry:block", "title": "Blog Block", "description": "Animated blog posts grid with staggered cards, date/time indicators, and hover effects" }, { "name": "blog-typography-shadcnui", "type": "registry:component", "title": "Blog Typography", "description": "Beautiful blog post typography with text, links, images, blockquotes, and code examples" }, { "name": "bottom-modal", "type": "registry:component", "title": "Bottom Modal", "description": "Cute bottom-centered modal with smooth slide-up animation and glassmorphism design" }, { "name": "browse-folder-baseui", "type": "registry:component", "title": "Browse Folder", "description": "Folder browser with animated tabs and content (Base UI)" }, { "name": "browse-folder-shadcnui", "type": "registry:component", "title": "Browse Folder", "description": "Folder browser with animated tabs and content" }, { "name": "cards-slider-shadcnui", "type": "registry:component", "title": "Cards Slider", "description": "Liquid smooth draggable cards slider with shadcn/ui styling and framer-motion animations" }, { "name": "cash-flow-chart", "type": "registry:ui", "title": "Accessible Cash Flow Chart", "description": "Interactive cash flow bar chart with keyboard focus, tooltips, and screen reader support" }, { "name": "chat-app-shadcnui", "type": "registry:component", "title": "Chat App", "description": "Fully functional chat interface with animated messages" }, { "name": "cinema-ticket-baseui", "type": "registry:component", "title": "Cinema Ticket", "description": "Cinematic theater ticket with rip effect and barcode (Base UI)" }, { "name": "cinema-ticket-shadcnui", "type": "registry:component", "title": "Cinema Ticket", "description": "Cinematic theater ticket with rip effect and barcode" }, { "name": "command-palette-shadcnui", "type": "registry:component", "title": "Command Palette", "description": "Command palette with search and keyboard navigation" }, { "name": "comment-thread-shadcnui", "type": "registry:component", "title": "Comment Thread", "description": "Nested comment thread with rich interactions and animations" }, { "name": "conference-ticket-baseui", "type": "registry:component", "title": "Conference Ticket", "description": "Animated conference ticket with glassmorphism effects and holographic details (Base UI)" }, { "name": "conference-ticket-shadcnui", "type": "registry:component", "title": "Conference Ticket", "description": "Animated conference ticket with glassmorphism effects and holographic details" }, { "name": "contact-block-baseui", "type": "registry:block", "title": "Contact Block", "description": "Contact form with animated contact info cards, working hours, and interactive icons (Base UI)" }, { "name": "contact-block-shadcnui", "type": "registry:block", "title": "Contact Block", "description": "Contact form with animated contact info cards, working hours, and interactive icons" }, { "name": "contact-form-section-baseui", "type": "registry:block", "title": "Contact Form", "description": "Contact form section with animated inputs, validation, and form handling (Base UI)" }, { "name": "contact-form-section-shadcnui", "type": "registry:block", "title": "Contact Form", "description": "Contact form section with animated inputs, validation, and form handling" }, { "name": "context-menu-bubble-shadcnui", "type": "registry:component", "title": "Context Menu Bubble", "description": "Right-click reveals circular expanding radial menu with icons" }, { "name": "context-menu-shadcnui", "type": "registry:component", "title": "Context Menu", "description": "Right-click context menu with nested items animation" }, { "name": "course-content-page-shadcnui", "type": "registry:component", "title": "Course Content Page", "description": "Interactive course page with video player, instructor details, curriculum sections, and progress tracking" }, { "name": "credit-card-baseui", "type": "registry:component", "title": "Credit Card", "description": "3D animated credit card with flip animation to show CVV (Base UI)" }, { "name": "credit-card-shadcnui", "type": "registry:component", "title": "Credit Card", "description": "3D animated credit card with flip animation to show CVV" }, { "name": "cta-banner-section-baseui", "type": "registry:page", "title": "CTA Banner Section", "description": "Animated call-to-action banner with gradient background and button animations (Base UI)" }, { "name": "cta-banner-section-shadcnui", "type": "registry:page", "title": "CTA Banner Section", "description": "Animated call-to-action banner with gradient background and button animations" }, { "name": "cta-block-baseui", "type": "registry:block", "title": "CTA Block", "description": "Call-to-action section with gradient overlay, animated buttons, and status indicator (Base UI)" }, { "name": "cta-block-shadcnui", "type": "registry:block", "title": "CTA Block", "description": "Call-to-action section with gradient overlay, animated buttons, and status indicator" }, { "name": "cta-hero-block-baseui", "type": "registry:block", "title": "CTA Hero Block", "description": "Engaging hero section with email signup, video preview, and social proof (Base UI)" }, { "name": "cta-hero-block-shadcnui", "type": "registry:block", "title": "CTA Hero Block", "description": "Engaging hero section with email signup, video preview, and social proof" }, { "name": "currency-converter-card-baseui", "type": "registry:component", "title": "Currency Converter Card", "description": "Finance conversion widget with animated inputs, simulated exchange updates, and contextual feedback (Base UI)" }, { "name": "currency-converter-card-shadcnui", "type": "registry:component", "title": "Currency Converter Card", "description": "Finance conversion widget with animated inputs, simulated exchange updates, and contextual feedback" } ], "component_count": 282, "components_truncated": true, "component_types": { "registry:page": 23, "registry:block": 74, "registry:component": 165, "registry:ui": 20 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 191, "name": "@unlumen-ui", "category": "Animated components", "tags": [ "aesthetic" ], "tagline": "Primitives and components with serious attention to animation and design. Copy, own, ship.", "short_description": "Primitives and components with serious attention to animation and design. Copy, own, ship.", "description": "Fully animated, open-source component registry built with React, TypeScript, Tailwind CSS, and Motion (motion/react), installable via the shadcn CLI. Ships 27+ components across categories: buttons (Copy Button, Glow Button, Magnetic Button, Refresh Button), text effects (Count Up, Scramble Text, Shimmering Text, Text Reveal), UI primitives (Clipped Circle, Command Menu, Cursor, Floating Tooltip, Glowing Badge, Kbd, Math Graph, Orbiting Skills, Progressive Blur, Shimmer Skeleton, Slider, Switch, Theme Switch, Tilt Card, Tooltip Preview, Velocity Highlight), and backgrounds (Pixel Background). Free tier plus one-time Pro purchase. Use for: adding polished, animation-forward primitive components without a heavy runtime dependency.", "homepage": "https://ui.unlumen.com", "docs": "https://ui.unlumen.com/docs/ui", "github": "https://github.com/wicki-leonard-emf/unlumen-ui-pv", "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://ui.unlumen.com/r/{name}.json", "registry_index": "https://ui.unlumen.com/r/registry.json", "components": [ "index", "gravity-stars", "pixel", "pixel-liquid-bg", "square-pattern", "wave-background", "copy", "glow", "refresh", "cards-view-icon", "compact-view-icon", "list-view-icon", "sidebar-toggle-icon", "aurora-blur", "aurora-card", "blob-card", "ai-chat", "animate-count", "animate-digits", "animate-text-input-typing", "animated-list", "apple-switch", "aurora-bars", "clipped-circle", "command-menu", "count-up", "cursor", "cursor-image-trail", "dia-text-reveal", "dock", "expand-menu", "expandable-navbar", "favicon-search", "file-tree", "floating-navbar", "floating-tooltip", "glowing-badge", "gooey-navbar-menu", "gooey-svg-filter", "highlight", "horizontal-depth-fade", "hover-expand", "hover-feature-cards", "hover-image-list", "inline-testimonials", "kbd", "magnetic-button", "math-graph", "matrix", "matrix-image", "motion-faqs-accordion", "motion-navigation-menu", "motion-subtitle", "motion-tabs-menu", "nextjs-ship", "orbital-image-wheel", "orbiting-skills", "page-transition", "perspective-flow", "pinned-list", "progressive-blur", "scramble-text", "scroll-reveal-image", "shimmer-skeleton", "shimmering-text", "side-by-side-slide", "sidebar-001", "sidebar-002", "slider", "smart-animate-text", "stacked-feature-cards", "switch", "tag", "team-stack", "text-reveal", "theme-switch", "tilt", "tilt-card", "tooltip-preview", "velocity-highlight", "vercel-snap-text", "vertical-marquee", "video-ambient", "video-slider", "demo-cursor", "demo-gravity-stars", "demo-pixel", "demo-pixel-grid", "demo-pixel-liquid-bg", "demo-square-pattern", "demo-wave-background", "demo-copy", "demo-glow", "demo-refresh", "demo-cards-view-icon", "demo-compact-view-icon", "demo-list-view-icon", "demo-sidebar-toggle-icon", "demo-aurora-card", "demo-blob-card" ], "component_items": [ { "name": "index", "type": "registry:style", "title": null, "description": null }, { "name": "gravity-stars", "type": "registry:ui", "title": "Gravity Stars Background", "description": "A background component featuring a subtle yet engaging animated gravity stars effect." }, { "name": "pixel", "type": "registry:ui", "title": "Pixel Background", "description": "An interactive background featuring tiny pixel particles that ripple outward from the center on hover, then fade away." }, { "name": "pixel-liquid-bg", "type": "registry:ui", "title": "Pixel Liquid Background", "description": "A full Navier-Stokes fluid simulation background with pixelation, Bayer dithering, film-grain noise, and auto-demo mode. Reacts to cursor movement." }, { "name": "square-pattern", "type": "registry:ui", "title": "Square Pattern Background", "description": "An interactive grid background where squares randomly light up with colors and react to hover." }, { "name": "wave-background", "type": "registry:ui", "title": "Wave Background", "description": "A morphing SVG wave divider that transitions between sections. Supports scroll-driven morphing and ambient looping animation modes." }, { "name": "copy", "type": "registry:ui", "title": "Copy Button", "description": "A copy button component with a variety of styles and animations." }, { "name": "glow", "type": "registry:ui", "title": "Glow Button", "description": "A button with an animated conic-gradient glow layer behind it. Supports rotate, pulse, breathe, colorShift, flowHorizontal and static modes." }, { "name": "refresh", "type": "registry:ui", "title": "Refresh Button", "description": "An icon button that spins on click and supports async refresh callbacks — ideal for reloading component previews or live data." }, { "name": "cards-view-icon", "type": "registry:ui", "title": "Cards View Icon", "description": "Animated icon where four square dots reorder in a 2×2 grid via Motion layout animation when active, signaling a card view mode." }, { "name": "compact-view-icon", "type": "registry:ui", "title": "Compact View Icon", "description": "Animated icon where a 3×2 grid of dots reorder themselves via Motion layout animation when active." }, { "name": "list-view-icon", "type": "registry:ui", "title": "List View Icon", "description": "Animated icon where three horizontal lines shuffle vertically when active, signaling a list view mode." }, { "name": "sidebar-toggle-icon", "type": "registry:ui", "title": "Sidebar Toggle Icon", "description": "Animated SVG icon that morphs between open and closed sidebar panel states using Motion path interpolation." }, { "name": "aurora-blur", "type": "registry:ui", "title": "Aurora Blur", "description": "Aurora blur shader layer used by Aurora Card." }, { "name": "aurora-card", "type": "registry:ui", "title": "Aurora Card", "description": "Aurora-blur pricing card with a configurable hero area, layout hooks, and customizable shader controls." }, { "name": "blob-card", "type": "registry:ui", "title": "Blob Card", "description": "Animated card with fluid blob header, animated glow border, and configurable colors." }, { "name": "ai-chat", "type": "registry:ui", "title": "AI Chat", "description": "A chat component that allows you to chat with an AI." }, { "name": "animate-count", "type": "registry:ui", "title": "Vercel Animate Count", "description": "A number display that animates the transition between values with a blur + slide effect, with a hook to throttle rapid updates." }, { "name": "animate-digits", "type": "registry:ui", "title": "Animate Digits", "description": "Per-digit blur-slide animation — only the digits that change animate." }, { "name": "animate-text-input-typing", "type": "registry:ui", "title": "Animate Text Input Typing", "description": "An animated input field with per-character motion effects and a smooth custom cursor overlay — supports multiple animation presets, cursor variants, and input …" }, { "name": "animated-list", "type": "registry:ui", "title": "Animated List", "description": "A real-time push feed where new items animate in from the top with spring physics — Stripe Radar style." }, { "name": "apple-switch", "type": "registry:ui", "title": "Apple Switch", "description": "Animated toggle switch with separate track/thumb sizing, spring feedback, optional label text, and tone variants." }, { "name": "aurora-bars", "type": "registry:ui", "title": "Aurora Bars", "description": "Animated bars with aurora-inspired gradient effects and smooth transitions." }, { "name": "clipped-circle", "type": "registry:ui", "title": "Clipped Circle", "description": "A cursor-following spotlight effect that reveals a soft glowing circle wherever the user moves their mouse inside the container." }, { "name": "command-menu", "type": "registry:ui", "title": "Command Menu", "description": "A composable ⌘K command palette with fuzzy search, custom groups, built-in theme switcher, and animated content reveal." }, { "name": "count-up", "type": "registry:ui", "title": "Count Up", "description": "An animated number counter that springs to its target value when it enters the viewport, with support for decimals, separators, and direction." }, { "name": "cursor", "type": "registry:ui", "title": "Cursor", "description": "An animated cursor component that allows you to customize both the cursor and cursor follow elements with smooth animations." }, { "name": "cursor-image-trail", "type": "registry:ui", "title": "Cursor Image Trail", "description": "A trail of images that follows the cursor with spring-physics fade and rotation." }, { "name": "dia-text-reveal", "type": "registry:ui", "title": "Dia Text Reveal", "description": "Animated text reveal with a colorful gradient sweep effect, inspired by the Dia app." }, { "name": "dock", "type": "registry:ui", "title": "Dock", "description": "Animated dock with Gaussian magnification, spring physics, separators, and tooltip carets." }, { "name": "expand-menu", "type": "registry:ui", "title": "Expand Menu", "description": "An animated expanding menu that reveals items from a trigger button, with configurable direction, layout, and alignment." }, { "name": "expandable-navbar", "type": "registry:ui", "title": "Expandable Navbar", "description": "A full-width fixed header with velocity-highlight hover, expanding inline dropdown, scroll hide/show, and a mobile circle-reveal overlay." }, { "name": "favicon-search", "type": "registry:ui", "title": "Favicon Search", "description": "A search input that fetches and smoothly animates the site favicon into the search bar as you type a URL." }, { "name": "file-tree", "type": "registry:component", "title": "File Tree", "description": "Animated file-tree component with animated hover highlight, spring folder expand/collapse, and automatic file-type icons." }, { "name": "floating-navbar", "type": "registry:ui", "title": "Floating Navbar", "description": "A sticky floating pill navbar with scroll-velocity spring physics, velocity-highlight hover effect, dropdown menus, mobile overlay, and optional theme toggle." }, { "name": "floating-tooltip", "type": "registry:ui", "title": "Floating Tooltip", "description": "A floating tooltip component." }, { "name": "glowing-badge", "type": "registry:ui", "title": "Glowing Badge", "description": "Badge with an animated pulsing glow dot. Supports status variants: default, success, warning, error, info." }, { "name": "gooey-navbar-menu", "type": "registry:component", "title": "Gooey Navbar Menu", "description": "A spring-animated navbar menu with a gooey SVG-filtered background that connects the active trigger and dropdown panel." }, { "name": "gooey-svg-filter", "type": "registry:ui", "title": "Gooey SVG Filter", "description": "An SVG filter that creates a gooey, fluid merging effect on adjacent elements using Gaussian blur and alpha-channel color matrix manipulation." }, { "name": "highlight", "type": "registry:ui", "title": "Highlight", "description": "An animated highlight component that tracks elements with smooth spring animations." }, { "name": "horizontal-depth-fade", "type": "registry:ui", "title": "Horizontal Depth Fade", "description": "Scroll-driven horizontal image strip on a single line with cinematic blur and brightness focus. GSAP ScrollTrigger implementation." }, { "name": "hover-expand", "type": "registry:ui", "title": "Hover Expand", "description": "A vertical list of rows that expand on hover to reveal a full-width image, animated with Motion springs." }, { "name": "hover-feature-cards", "type": "registry:ui", "title": "Hover Feature Cards", "description": "A responsive grid of feature cards where a description panel slides in from below on hover, with spring animation and optional image support." }, { "name": "hover-image-list", "type": "registry:ui", "title": "Hover Image List", "description": "A list of large headings that reveal an image on the left and shift right on hover, animated with Motion." }, { "name": "inline-testimonials", "type": "registry:ui", "title": "Inline Testimonials", "description": "Testimonials rendered as inline flowing text with circular avatars. Hover to blur others and reveal the author's name and role." }, { "name": "kbd", "type": "registry:ui", "title": "Kbd", "description": "Keyboard key and shortcut display component with a realistic keycap style." }, { "name": "magnetic-button", "type": "registry:ui", "title": "Magnetic Button", "description": "A button that magnetically follows cursor proximity with spring physics. Smoothly snaps back when the cursor leaves." }, { "name": "math-graph", "type": "registry:ui", "title": "Math Graph", "description": "A real-time visual math function builder with animated SVG curves, a pan/zoom canvas, crosshair tooltip, and support for multiple expressions simultaneously." }, { "name": "matrix", "type": "registry:ui", "title": "Matrix", "description": "An LED dot matrix display component with SVG pixels, radial glow, built-in digit/animation presets, and a VU meter mode." }, { "name": "matrix-image", "type": "registry:ui", "title": "Matrix Image", "description": "An animated image component that simulates the iconic Matrix digital rain effect." }, { "name": "motion-faqs-accordion", "type": "registry:ui", "title": "Motion FAQs Accordion", "description": "A clean Motion-powered FAQ accordion with spring-animated content reveal." }, { "name": "motion-navigation-menu", "type": "registry:component", "title": "Motion Navigation Menu", "description": "A spring-animated navigation menu with a single morphing container, layout-animated active pill, and direction-aware content transitions." }, { "name": "motion-subtitle", "type": "registry:component", "title": "Motion Subtitle", "description": "Animated subtitle text with per-character reveal, blur transition, speed control, and top/bottom direction." }, { "name": "motion-tabs-menu", "type": "registry:component", "title": "Motion Tabs Menu", "description": "A floating bottom tab bar that expands upward with spring animations to reveal tab-specific content, with direction-aware slide transitions." }, { "name": "nextjs-ship", "type": "registry:ui", "title": "Next.js Ship", "description": "Animated chip/CPU circuit board visualization with gradient pulse traces traveling along PCB-style paths." }, { "name": "orbital-image-wheel", "type": "registry:ui", "title": "Orbital Image Wheel", "description": "Scroll-driven half-wheel image layout powered by GSAP ScrollTrigger, with cinematic blur/saturation/brightness focus and centered captions." }, { "name": "orbiting-skills", "type": "registry:ui", "title": "Orbiting Skills", "description": "Animated skill badges that orbit a center element. On desktop the ring follows the cursor on hover; on mobile the ring is always visible." }, { "name": "page-transition", "type": "registry:ui", "title": "Page Transition", "description": "GSAP-powered Next.js App Router page transition provider. Wraps your layout to animate between pages with a curtain reveal or slide push — ported from the Codr…" }, { "name": "perspective-flow", "type": "registry:ui", "title": "Perspective Flow", "description": "Scroll-driven 3D image grid with perspective rotations, blur, brightness, and inner parallax — supports both GSAP ScrollTrigger and Framer Motion engines." }, { "name": "pinned-list", "type": "registry:ui", "title": "Pinned List", "description": "A list of items that animate smoothly to a pinned section using Framer Motion layout animations." } ], "component_count": 216, "components_truncated": true, "component_types": { "registry:style": 1, "registry:ui": 130, "registry:component": 7, "registry:example": 72, "registry:hook": 5, "registry:lib": 1 }, "has_logo": true, "enrichment_errors": [ "github_lookup_failed" ], "featured": false }, { "number": 216, "name": "@untld", "category": "Uncategorized", "tags": [], "tagline": "A set of beautifully designed components for modern web applications.", "short_description": "", "description": "A set of beautifully designed components for modern web applications.", "homepage": "https://ui.untldlabs.com", "docs": "https://ui.untldlabs.com/docs", "github": null, "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://ui.untldlabs.com/r/{name}.json", "registry_index": "https://ui.untldlabs.com/r/registry.json", "components": [ "ai-input", "page-dock" ], "component_items": [ { "name": "ai-input", "type": "registry:ui", "title": "AI Input", "description": "A animated gradient border AI input component." }, { "name": "page-dock", "type": "registry:ui", "title": "Page Dock", "description": "An animated dock component for page navigation with scroll progress indicator." } ], "component_count": 2, "components_truncated": false, "component_types": { "registry:ui": 2 }, "has_logo": true, "enrichment_errors": [ "github_unresolved" ], "featured": false }, { "number": 192, "name": "@uselayouts", "category": "Animated components", "tags": [ "aesthetic" ], "tagline": "A collection of premium animated React components and micro-interactions built with Motion for building fluid, professional interfaces.", "short_description": "A collection of premium animated React components and micro-interactions built with Motion for building fluid, professional interfaces.", "description": "Micro-interaction UI library of ~30 premium animated React components built with Framer Motion (motion) and Tailwind CSS v4, targeting React 19, designed to complement shadcn/ui. Includes 3D Book, Animated Collection, Bento Card, Bottom Menu, Day Picker, Delete/Discover Buttons, Discrete Tabs, Dynamic Toolbar, Expandable Gallery, Feature Carousel, Fluid Expanding Grid, Folder Interaction, Inline Edit, Magnified Bento, Morphing Input, Multi-Step Form, Pricing Card, Smooth Dropdown, Stacked List, Status Button, Toggle Sidebar, and Vertical Tabs. Fully free and MIT-licensed. Use for: injecting high-craft, direction-aware micro-interactions and layout animations into Next.js projects where feel and motion quality matter.", "homepage": "https://uselayouts.com", "docs": "https://uselayouts.com/docs/introduction", "github": "https://github.com/iurvish/uselayouts", "components_github": "https://github.com/iurvish/uselayouts/tree/main/registry", "github_default_branch": "main", "github_stars": 404, "last_commit": "2026-06-27T09:15:56Z", "archived": false, "license": "MIT", "open_issues": 6, "registry_template": "https://uselayouts.com/r/{name}.json", "registry_index": "https://uselayouts.com/r/registry.json", "components": [ "3d-book", "animated-collection", "bottom-menu", "day-picker", "delete-button", "discover-button", "discrete-tabs", "dynamic-toolbar", "expandable-gallery", "feature-carousel", "folder-interaction", "inline-edit", "list-item", "morphing-input", "multi-step-form", "pricing-card", "shake-testimonial-card", "smooth-dropdown", "status-button", "vertical-tabs", "stacked-list", "bucket", "fluid-expanding-grid", "bento-card", "magnified-bento", "empty-testimonial" ], "component_items": [ { "name": "3d-book", "type": "registry:component", "title": "3D Book", "description": "An interactive 3D book component with page flip animations." }, { "name": "animated-collection", "type": "registry:component", "title": "Animated Collection", "description": "A collection of items with smooth layout transitions and animations." }, { "name": "bottom-menu", "type": "registry:component", "title": "Bottom Menu", "description": "A floating bottom navigation menu with smooth interactions." }, { "name": "day-picker", "type": "registry:component", "title": "Day Picker", "description": "A custom day picker component with smooth animations." }, { "name": "delete-button", "type": "registry:component", "title": "Delete Button", "description": "A confirmation button with smooth icon transitions." }, { "name": "discover-button", "type": "registry:component", "title": "Discover Button", "description": "An interactive button with expanding discovery state." }, { "name": "discrete-tabs", "type": "registry:component", "title": "Discrete Tabs", "description": "A tab component with discrete sliding animations." }, { "name": "dynamic-toolbar", "type": "registry:component", "title": "Dynamic Toolbar", "description": "A toolbar that adapts its size and layout based on content." }, { "name": "expandable-gallery", "type": "registry:component", "title": "Expandable Gallery", "description": "A photo gallery with smooth item expansion." }, { "name": "feature-carousel", "type": "registry:component", "title": "Feature Carousel", "description": "A smooth carousel for showcasing product features." }, { "name": "folder-interaction", "type": "registry:component", "title": "Folder Interaction", "description": "A folder management system with drag-and-drop-like feel." }, { "name": "inline-edit", "type": "registry:component", "title": "Inline Edit", "description": "An input that switches between read and edit modes." }, { "name": "list-item", "type": "registry:component", "title": "List Item", "description": "Interactive list items with hover and focus effects." }, { "name": "morphing-input", "type": "registry:component", "title": "Morphing Input", "description": "An input field that morphs between different states." }, { "name": "multi-step-form", "type": "registry:component", "title": "Multi Step Form", "description": "A dynamic, animated multi-step form with validation." }, { "name": "pricing-card", "type": "registry:component", "title": "Pricing Card", "description": "A focused pricing card layout with clear hierarchy." }, { "name": "shake-testimonial-card", "type": "registry:component", "title": "Shake Testimonial Card", "description": "An eye-catching testimonial card with playful animations." }, { "name": "smooth-dropdown", "type": "registry:component", "title": "Smooth Dropdown", "description": "A dropdown menu with premium layout transitions." }, { "name": "status-button", "type": "registry:component", "title": "Status Button", "description": "A button with animated states for idle, loading, and success." }, { "name": "vertical-tabs", "type": "registry:component", "title": "Vertical Tabs", "description": "A vertical tab interaction with smooth content switching." }, { "name": "stacked-list", "type": "registry:component", "title": "Stacked List", "description": "An expandable list widget with a stacked layout and smooth morphing transitions." }, { "name": "bucket", "type": "registry:component", "title": "Bucket", "description": "An interactive card component that simulates a bucket where chips are tossed and replaced with smooth physics-inspired animations." }, { "name": "fluid-expanding-grid", "type": "registry:component", "title": "Fluid Expanding Grid", "description": "A responsive gallery grid that fluidly shifts and expands items using motion layout." }, { "name": "bento-card", "type": "registry:component", "title": "Bento Card", "description": "An interactive bento card with animated tabs and workspace preview." }, { "name": "magnified-bento", "type": "registry:component", "title": "Magnified Bento", "description": "A bento card component with a draggable magnifying lens effect over scrolling chips." }, { "name": "empty-testimonial", "type": "registry:component", "title": "Empty Testimonial", "description": "An interactive empty state for testimonials with a playful folder animation." } ], "component_count": 26, "components_truncated": false, "component_types": { "registry:component": 26 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 218, "name": "@uui", "category": "Uncategorized", "tags": [], "tagline": "Inspiration for UI Interfaces. Discover UI ideas, micro-interactions, and components drawn from real products.", "short_description": "", "description": "Inspiration for UI Interfaces. Discover UI ideas, micro-interactions, and components drawn from real products.", "homepage": "https://uui.app", "docs": null, "github": null, "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://uui.app/r/{name}.json", "registry_index": "https://uui.app/r/registry.json", "components": [ "cards-shader-effect", "dropbox-upload", "family-signin-drawer", "snapchat-loader", "sora-theme-picker", "text-shimmer-animation-on-hover" ], "component_items": [ { "name": "cards-shader-effect", "type": "registry:block", "title": "Cards Shader Effect", "description": null }, { "name": "dropbox-upload", "type": "registry:block", "title": "Dropbox Upload", "description": null }, { "name": "family-signin-drawer", "type": "registry:block", "title": "Family Sign In Drawer", "description": null }, { "name": "snapchat-loader", "type": "registry:component", "title": "Snapchat Loader", "description": null }, { "name": "sora-theme-picker", "type": "registry:block", "title": "Sora Theme Picker", "description": null }, { "name": "text-shimmer-animation-on-hover", "type": "registry:block", "title": "Text Shimmer Animation", "description": null } ], "component_count": 6, "components_truncated": false, "component_types": { "registry:block": 5, "registry:component": 1 }, "has_logo": true, "enrichment_errors": [ "docs_unresolved", "github_unresolved" ], "featured": false }, { "number": 193, "name": "@utilcn", "category": "Hooks/utilities", "tags": [ "ai", "components" ], "tagline": "Fullstack registry items to start those big features. Utilcn has ChatGPT Apps, file uploading (with progress bars) and downloading, and a way to make your env vars typesafe on the backend.", "short_description": "Fullstack registry items to start those big features. Utilcn has ChatGPT Apps, file uploading (with progress bars) and downloading, and a way to make your env vars typesafe on the backend.", "description": "Fullstack shadcn registry focused on backend utility scaffolding for Next.js/TypeScript projects rather than visual components. Provides: string helpers (camelCase, kebab-case, PascalCase, snake_case, capitalize, truncate, reverse), S3-style file storage utilities with presigned upload/download URL builders plus ready-made React upload/download components and hooks, a ChatGPT MCP widget bundle (frontend UI, build tooling, shared hooks/types, backend server scaffold, sample MCP tool), and a Zod-powered server environment validator for typesafe env configuration. Free and open-source. Use for: bootstrapping the backend plumbing of a new full-stack app — file uploads, AI widget scaffolding, and typed secrets — without reinventing the boilerplate.", "homepage": "https://utilcn.dev", "docs": "https://utilcn.dev/docs", "github": "https://github.com/BrennenRocks/utilcn", "components_github": "https://github.com/BrennenRocks/utilcn/tree/main/registry", "github_default_branch": "main", "github_stars": 15, "last_commit": "2025-12-14T06:52:44Z", "archived": false, "license": null, "open_issues": 0, "registry_template": "https://utilcn.dev/r/{name}.json", "registry_index": "https://utilcn.dev/r/registry.json", "components": [ "capitalize-all", "capitalize", "repeat-pad", "reverse-string", "to-camel-case", "to-kebab-case", "to-pascal-case", "to-snake-case", "truncate-string", "generate-presigned-download-url", "generate-presigned-upload-url", "download-file", "upload-file", "env-server", "upload-multiple-files", "chatgpt-app", "chatgpt-app-backend" ], "component_items": [ { "name": "capitalize-all", "type": "registry:lib", "title": "Capitalize All", "description": "Capitalize the first letter of every word in a string." }, { "name": "capitalize", "type": "registry:lib", "title": "Capitalize", "description": "Capitalize the first letter of a string." }, { "name": "repeat-pad", "type": "registry:lib", "title": "Repeat Pad", "description": "Repeat a string until it reaches the desired length." }, { "name": "reverse-string", "type": "registry:lib", "title": "Reverse String", "description": "Reverse a string." }, { "name": "to-camel-case", "type": "registry:lib", "title": "To Camel Case", "description": "Convert a string to camelCase." }, { "name": "to-kebab-case", "type": "registry:lib", "title": "To Kebab Case", "description": "Convert a string to kebabCase." }, { "name": "to-pascal-case", "type": "registry:lib", "title": "To Pascal Case", "description": "Convert a string to PascalCase." }, { "name": "to-snake-case", "type": "registry:lib", "title": "To Snake Case", "description": "Convert a string to snake_case." }, { "name": "truncate-string", "type": "registry:lib", "title": "Truncate String", "description": "Truncate a string to a given length." }, { "name": "generate-presigned-download-url", "type": "registry:lib", "title": "Generate Presigned Download URL", "description": "Generate a presigned download URL for a file." }, { "name": "generate-presigned-upload-url", "type": "registry:lib", "title": "Generate Presigned Upload URL", "description": "Generate a presigned upload URL for a file." }, { "name": "download-file", "type": "registry:component", "title": "Download A File From Storage", "description": "Download a file from a storage provider using a presigned download URL." }, { "name": "upload-file", "type": "registry:component", "title": "Upload A File To Storage", "description": "Upload a file to a storage provider using a presigned upload URL." }, { "name": "env-server", "type": "registry:file", "title": "Environment Server Configuration", "description": "Environment variable validation schema using Zod for server configuration" }, { "name": "upload-multiple-files", "type": "registry:component", "title": "Upload Multiple Files", "description": "Upload multiple files to a storage provider using a presigned upload URL." }, { "name": "chatgpt-app", "type": "registry:block", "title": "ChatGPT Widget Frontend", "description": "Frontend widget implementation, build script, types, and hooks for embedding a ChatGPT MCP widget." }, { "name": "chatgpt-app-backend", "type": "registry:block", "title": "ChatGPT MCP Backend", "description": "MCP server bootstrap, widget asset builder, and tool registration for the ChatGPT widget." } ], "component_count": 17, "components_truncated": false, "component_types": { "registry:lib": 11, "registry:component": 3, "registry:file": 1, "registry:block": 2 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 194, "name": "@w3-kit", "category": "Crypto/web3", "tags": [ "components" ], "tagline": "Web3 UI components for blockchain dApps. Includes wallet connection, token swaps, NFT cards, staking interfaces, and 20+ more crypto components.", "short_description": "Web3 UI components for blockchain dApps. Includes wallet connection, token swaps, NFT cards, staking interfaces, and 20+ more crypto components.", "description": "Open-source UI component library for blockchain dApp development built with React, TypeScript, and Tailwind CSS. Covers wallet connection UIs, token swap interfaces, NFT cards, staking interfaces, and 20+ additional crypto-specific components. Follows accessible, customizable design patterns aligned with shadcn/ui conventions. MIT-licensed. Site was returning errors at research time. Use for: rapidly assembling dApp frontends that need production-ready wallet, token, and NFT UI primitives without building blockchain-specific components from scratch.", "homepage": "https://w3-kit.com", "docs": "N/A", "github": "https://github.com/w3-kit/ui", "components_github": "https://github.com/w3-kit/ui/tree/main/registry", "github_default_branch": "main", "github_stars": 14, "last_commit": "2026-07-03T01:14:25Z", "archived": false, "license": "MIT", "open_issues": 15, "registry_template": "https://w3-kit.com/registry/{name}.json", "registry_index": null, "components": [], "component_items": [], "component_count": null, "components_truncated": false, "component_types": {}, "has_logo": true, "enrichment_errors": [ "registry_index_unresolved" ], "featured": false }, { "number": 195, "name": "@wandry-ui", "category": "Forms", "tags": [ "components" ], "tagline": "A set of open source fully controlled React Inertia form elements", "short_description": "A set of open source fully controlled React Inertia form elements", "description": "shadcn/ui registry of fully controlled React form components designed specifically for Inertia.js applications, built to pair with the @wandry/inertia-form library. Components handle text inputs, select dropdowns, checkboxes, radio buttons, OTP inputs, and password fields, with automatic form state management, change tracking, dirty-state detection, and TypeScript safety. Integrates with Radix UI and Tailwind CSS. Free and open-source. Use for: Inertia.js (Laravel + React) projects that need ready-made, type-safe form fields wired up to Inertia's form handling without writing repetitive field boilerplate.", "homepage": "http://ui.wandry.com.ua/", "docs": "N/A", "github": "https://github.com/WandryDev/wandry-ui", "components_github": "https://github.com/WandryDev/wandry-ui/tree/main/registry", "github_default_branch": "main", "github_stars": 26, "last_commit": "2025-12-21T17:40:35Z", "archived": false, "license": null, "open_issues": 1, "registry_template": "https://ui.wandry.com.ua/r/{name}.json", "registry_index": null, "components": [], "component_items": [], "component_count": null, "components_truncated": false, "component_types": {}, "has_logo": true, "enrichment_errors": [ "registry_index_unresolved" ], "featured": false }, { "number": 196, "name": "@waves-cn", "category": "Niche/single-purpose", "tags": [ "components" ], "tagline": "A collection of wave players and waveform components built with wavesurfer.js and shadcn/ui.", "short_description": "A collection of wave players and waveform components built with wavesurfer.js and shadcn/ui.", "description": "shadcn/ui-style registry of six audio and video waveform components built on wavesurfer.js and Tailwind CSS, targeting React 18+. Components are Wave Player (full-featured audio player with seek, volume, title), Wave Recorder (live in-browser recording with waveform), Wave Speed (variable playback with pitch toggle), Wave Timeline (timeline ruler), Wave Video (video player with synced waveform), and Wave Zoom (mouse-wheel zoom). Code is copied into your project — no runtime package. Free and MIT-licensed. Use for: apps requiring embedded audio players, podcast interfaces, or voice memo recorders that need waveform visualization matching your existing shadcn design system.", "homepage": "https://waves-cn.vercel.app", "docs": "https://waves-cn.vercel.app/docs", "github": "https://github.com/Ziane-Badreddine/waves-cn", "components_github": "https://github.com/Ziane-Badreddine/waves-cn/tree/main/src/registry", "github_default_branch": "main", "github_stars": 17, "last_commit": "2026-04-05T15:54:11Z", "archived": false, "license": "MIT", "open_issues": 0, "registry_template": "https://waves-cn.vercel.app/r/{name}.json", "registry_index": "https://waves-cn.vercel.app/r/registry.json", "components": [ "wave-cn", "wave-player", "wave-recorder", "wave-speed", "wave-zoom", "wave-video", "wave-timeline" ], "component_items": [ { "name": "wave-cn", "type": "registry:lib", "title": "Wave Core", "description": "Core hook, player and shared defaults powering all waves-cn components. Built on wavesurfer.js." }, { "name": "wave-player", "type": "registry:component", "title": "Wave Player", "description": "Full-featured wave player with play/pause, volume control, seek bar and optional title." }, { "name": "wave-recorder", "type": "registry:component", "title": "Wave Recorder", "description": "Voice message recorder with live waveform, pause/resume, discard and auto-stop." }, { "name": "wave-speed", "type": "registry:component", "title": "Wave Speed", "description": "wave player with continuous playback speed control and preserve-pitch toggle." }, { "name": "wave-zoom", "type": "registry:component", "title": "Wave Zoom", "description": "wave player with mouse-wheel zoom via wavesurfer.js ZoomPlugin." }, { "name": "wave-video", "type": "registry:component", "title": "Wave Video", "description": "Waveform player synced to a video element via the wavesurfer.js media prop." }, { "name": "wave-timeline", "type": "registry:component", "title": "Wave Timeline", "description": "wave player with timeline ruler, zoom slider and volume control powered by wavesurfer.js TimelinePlugin." } ], "component_count": 7, "components_truncated": false, "component_types": { "registry:lib": 1, "registry:component": 6 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 197, "name": "@wds", "category": "Component library (general)", "tags": [ "components" ], "tagline": "A collection of accessible components built for use with Shadcn.", "short_description": "A collection of accessible components built for use with Shadcn.", "description": "Small, accessibility-focused shadcn registry from the Web Dev Simplified YouTube channel. Ships five components: Action Button, Loading Swap, Multi-Select, Number Input, and Password Input. Built for use alongside shadcn/ui with an emphasis on correct ARIA patterns and usability edge cases. Free and MIT-licensed; documented via Starlight. Use for: adding a handful of commonly-needed but tricky-to-get-right accessible form and action components (multi-select, numeric input, password visibility toggle) into a shadcn project without reinventing their accessibility handling.", "homepage": "https://wds-shadcn-registry.netlify.app/", "docs": "https://wds-shadcn-registry.netlify.app/getting-started/introduction/", "github": "https://github.com/WebDevSimplified/wds-shadcn-registry", "components_github": "https://github.com/WebDevSimplified/wds-shadcn-registry/tree/main/src/registry", "github_default_branch": "main", "github_stars": 286, "last_commit": "2026-06-12T22:27:05Z", "archived": false, "license": "MIT", "open_issues": 21, "registry_template": "https://wds-shadcn-registry.netlify.app/r/{name}.json", "registry_index": "https://wds-shadcn-registry.netlify.app/r/registry.json", "components": [ "loading-swap", "action-button", "number-input", "multi-select", "password-input", "loading-swap-experimental", "action-button-experimental", "number-input-experimental", "multi-select-experimental", "password-input-experimental" ], "component_items": [ { "name": "loading-swap", "type": "registry:component", "title": null, "description": "Swaps content with a loading spinner without layout shift." }, { "name": "action-button", "type": "registry:component", "title": null, "description": "A button that performs an action when clicked and optionally asks for user confirmation." }, { "name": "number-input", "type": "registry:component", "title": null, "description": "An input that returns a number value and automatically handles invalid inputs." }, { "name": "multi-select", "type": "registry:component", "title": null, "description": "A multi-select input that emulates the Shadcn Select component as closely as possible." }, { "name": "password-input", "type": "registry:component", "title": null, "description": "An input that can toggle visibility of the password text and check the strength of the password." }, { "name": "loading-swap-experimental", "type": "registry:component", "title": null, "description": "Swaps content with a loading spinner without layout shift. (Includes experimental support for all Shadcn icon libraries)" }, { "name": "action-button-experimental", "type": "registry:component", "title": null, "description": "A button that performs an action when clicked and optionally asks for user confirmation. (Includes experimental support for all Shadcn icon libraries)" }, { "name": "number-input-experimental", "type": "registry:component", "title": null, "description": "An input that returns a number value and automatically handles invalid inputs. (Includes experimental support for all Shadcn icon libraries)" }, { "name": "multi-select-experimental", "type": "registry:component", "title": null, "description": "A multi-select input that emulates the Shadcn Select component as closely as possible. (Includes experimental support for all Shadcn icon libraries)" }, { "name": "password-input-experimental", "type": "registry:component", "title": null, "description": "An input that can toggle visibility of the password text and check the strength of the password. (Includes experimental support for all Shadcn icon libraries)" } ], "component_count": 10, "components_truncated": false, "component_types": { "registry:component": 10 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 198, "name": "@wensity", "category": "AI/chat UI", "tags": [ "saas", "ai", "aesthetic" ], "tagline": "Motion-rich React components for AI interfaces, SaaS blocks, and cinematic interactions. Free Wensity components only.", "short_description": "Motion-rich React components for AI interfaces, SaaS blocks, and cinematic interactions. Free Wensity components only.", "description": "Premium motion-component registry from the Wensity design studio targeting Next.js and Tailwind CSS v4. Offers 40+ hand-built components across five categories: Agentic AI Interfaces (Liquid Multimodal Input, Stream Reveal Typography, Generative Skeleton Mesh, Voice Aurora Wave, Model Context Switcher), Cinematic Interactions (Dynamic Island Toast, 3D Parallax Tilt Card, Infinite Marquee, Apple-Style Sticky Scroll, Morphing Shape Background, Scrubbable Video Reveal, Interactive Beam Connections), Heavy SaaS Blocks (Command Palette, Drag-and-Drop Kanban, Multi-Step Wizard, Activity Grid, Notification Popover, RBAC Permission Toggles), Elite Micro-Interactions, and Show-Off pieces. Free components install immediately; Pro source unlocks per-component after purchase. Use for: AI product UIs and SaaS marketing sites that demand cinematic, studio-grade motion quality with zero runtime dependency overhead.", "homepage": "https://wensity.com", "docs": "https://ui.wensity.com/docs/getting-started", "github": "N/A", "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://raw.githubusercontent.com/ksparth12/wensity-shadcn-registry/main/{name}.json", "registry_index": "https://raw.githubusercontent.com/ksparth12/wensity-shadcn-registry/main/registry.json", "components": [ "liquid-multimodal-input", "generative-skeleton-mesh", "voice-aurora-wave", "model-context-switcher", "dynamic-island-toast", "infinite-marquee", "apple-sticky-scroll-sequence", "morphing-shape-background", "scrubbable-video-reveal", "button", "input", "text-area", "select", "form-field", "badge", "checkbox", "switch", "radio-group", "toggle", "bento-grid", "label", "input-otp", "combobox", "avatar", "table", "progress", "alert", "skeleton", "spinner", "toast", "dialog", "sheet", "drawer", "popover", "tooltip", "tabs", "breadcrumb", "pagination", "card", "separator", "resizable", "hover-card" ], "component_items": [ { "name": "liquid-multimodal-input", "type": "registry:block", "title": "Liquid Multimodal Input", "description": "Expanding prompt area with a glowing drop-zone." }, { "name": "generative-skeleton-mesh", "type": "registry:block", "title": "Generative Skeleton Mesh", "description": "An organic loading state, not a spinner." }, { "name": "voice-aurora-wave", "type": "registry:block", "title": "Voice Aurora Wave", "description": "A breathing voice orb. Never jittery, always organic." }, { "name": "model-context-switcher", "type": "registry:block", "title": "Model Context Switcher", "description": "A Radix dropdown that scales out from the trigger and glides between options." }, { "name": "dynamic-island-toast", "type": "registry:block", "title": "Dynamic Island Toast", "description": "A pixel-faithful Apple Dynamic Island that morphs, splits, and hosts live activities." }, { "name": "infinite-marquee", "type": "registry:block", "title": "Infinite Marquee", "description": "Seamless, GPU-only logo strip that never stutters." }, { "name": "apple-sticky-scroll-sequence", "type": "registry:block", "title": "Apple-Style Sticky Scroll", "description": "A pinned cinematic section that morphs in lock-step with scroll." }, { "name": "morphing-shape-background", "type": "registry:block", "title": "Morphing Shape Background", "description": "Lava-lamp blobs that drift behind your hero at 120fps with no SVG morph." }, { "name": "scrubbable-video-reveal", "type": "registry:block", "title": "Scrubbable Video Reveal", "description": "Apple-style scroll-scrubbed image sequence on a canvas." }, { "name": "button", "type": "registry:block", "title": "Button", "description": "Accessible button with variants, sizes, icons, and loading state." }, { "name": "input", "type": "registry:block", "title": "Input", "description": "Accessible text input with label, hint, error, icons, and clear action." }, { "name": "text-area", "type": "registry:block", "title": "Text Area", "description": "Accessible multi-line input with variants, auto-resize, counts, and validation." }, { "name": "select", "type": "registry:block", "title": "Select", "description": "Accessible select with polished triggers, grouped options, and controlled state." }, { "name": "form-field", "type": "registry:block", "title": "Form Field", "description": "Composable form field wrapper with labels, descriptions, errors, and section layouts." }, { "name": "badge", "type": "registry:block", "title": "Badge", "description": "Polished status and metadata badges with icons, dots, removable chips, and subtle depth." }, { "name": "checkbox", "type": "registry:block", "title": "Checkbox", "description": "Accessible checkbox with focused styles, groups, cards, and indeterminate state." }, { "name": "switch", "type": "registry:block", "title": "Switch", "description": "Accessible switch with distinct variants, smooth motion, groups, cards, and controlled state." }, { "name": "radio-group", "type": "registry:block", "title": "Radio Group", "description": "Native radio selection with distinctive rows, segments, cards, and controlled state." }, { "name": "toggle", "type": "registry:block", "title": "Toggle", "description": "Pressable on/off control with default, icon, outline, soft, and grouped selection." }, { "name": "bento-grid", "type": "registry:block", "title": "Bento Grid", "description": "Responsive bento-style grid layout." }, { "name": "label", "type": "registry:block", "title": "Label", "description": "Accessible form label with default, required, optional, muted, and inline variants." }, { "name": "input-otp", "type": "registry:block", "title": "Input OTP", "description": "Accessible one-time code input with alphanumeric, masked, and grouped variants." }, { "name": "combobox", "type": "registry:block", "title": "Combobox", "description": "Searchable combobox with multi-select, async loading, and creatable options." }, { "name": "avatar", "type": "registry:block", "title": "Avatar", "description": "Profile avatars with image fallback, presence status, stacked groups, and upload." }, { "name": "table", "type": "registry:block", "title": "Table", "description": "Data tables with sortable columns, row selection, expandable rows, and sticky headers." }, { "name": "progress", "type": "registry:block", "title": "Progress", "description": "Progress indicators — linear, circular, segmented steps, indeterminate, and stacked." }, { "name": "alert", "type": "registry:block", "title": "Alert", "description": "Status alerts for info, success, warning, error, and action-oriented messages." }, { "name": "skeleton", "type": "registry:block", "title": "Skeleton", "description": "Loading placeholders for text, avatar, card, table, and custom compositions." }, { "name": "spinner", "type": "registry:block", "title": "Spinner", "description": "Indeterminate loading indicators in default, ring, dots, pulse, and overlay styles." }, { "name": "toast", "type": "registry:block", "title": "Toast", "description": "Transient notifications for info, success, warning, error, and action states." }, { "name": "dialog", "type": "registry:block", "title": "Dialog", "description": "Modal dialogs for focused tasks — default, confirmation, form, fullscreen, and scrollable layouts." }, { "name": "sheet", "type": "registry:block", "title": "Sheet", "description": "Edge-mounted panels that slide in from any side, with an optional persistent mode." }, { "name": "drawer", "type": "registry:block", "title": "Drawer", "description": "Gesture-driven drawers with velocity dismiss, snap points, and multi-side support." }, { "name": "popover", "type": "registry:block", "title": "Popover", "description": "Floating panels for menus, inline forms, rich previews, and controlled state." }, { "name": "tooltip", "type": "registry:block", "title": "Tooltip", "description": "Contextual hints with rich content, keyboard shortcuts, cursor tracking, and interactive links." }, { "name": "tabs", "type": "registry:block", "title": "Tabs", "description": "Tabbed navigation with sliding indicators, segmented controls, and vertical layouts." }, { "name": "breadcrumb", "type": "registry:block", "title": "Breadcrumb", "description": "Wayfinding trail with smart collapsing, dropdowns, and animated hover states." }, { "name": "pagination", "type": "registry:block", "title": "Pagination", "description": "Page navigation with sliding indicators, compact counters, and progressive loading." }, { "name": "card", "type": "registry:block", "title": "Card", "description": "Premium content containers with interactive, media, stat, and feature variants." }, { "name": "separator", "type": "registry:block", "title": "Separator", "description": "Custom dividers with text labels, gradient fades, and dashed borders." }, { "name": "resizable", "type": "registry:block", "title": "Resizable", "description": "Flexible resizable layouts featuring draggable splitter bars, panel snappers, and local persistence." }, { "name": "hover-card", "type": "registry:block", "title": "Hover Card", "description": "Snappy preview card overlays triggered on hovering links/text without click interruption." } ], "component_count": 42, "components_truncated": false, "component_types": { "registry:block": 42 }, "has_logo": true, "enrichment_errors": [ "github_lookup_failed" ], "featured": false }, { "number": 199, "name": "@wigggle-ui", "category": "Niche/single-purpose", "tags": [ "dashboard" ], "tagline": "A beautiful collection of copy-and-paste widgets for your next project.", "short_description": "A beautiful collection of copy-and-paste widgets for your next project.", "description": "Open-source registry of dashboard-style widget components for shadcn/ui, built with Next.js and Tailwind CSS. Centers on a composable Widget primitive with size (sm/md/lg), variant (default/secondary), and design (default/mumbai) props, plus sub-components for layout structuring. Each widget is a self-contained, copy-paste card suited for clocks, stats, activity panels, and similar dashboard tiles styled with class-variance-authority. Free and MIT-licensed. Use for: projects that need a consistent set of widget-card containers for internal dashboards or app home screens where you want ownership of the styling code and shadcn/ui compatibility.", "homepage": "https://wigggle-ui.vercel.app", "docs": "https://wigggle-ui.vercel.app/docs", "github": "https://github.com/wigggle-ui/ui", "components_github": "https://github.com/wigggle-ui/ui/tree/main/registry", "github_default_branch": "main", "github_stars": 882, "last_commit": "2026-02-26T07:13:20Z", "archived": false, "license": "MIT", "open_issues": 7, "registry_template": "https://wigggle-ui.vercel.app/r/{name}.json", "registry_index": "https://wigggle-ui.vercel.app/r/registry.json", "components": [ "widget", "icons", "avatar", "badge", "button", "carousel", "circular-progress", "dialog", "dropdown-menu", "input", "label", "popover", "progress", "select", "scroll-area", "separator", "switch", "tabs", "textarea", "tooltip", "item", "wheel-picker", "utils", "calendar-sm-01", "calendar-sm-02", "calendar-sm-03", "calendar-sm-04", "calendar-sm-05", "calendar-sm-06", "calendar-sm-07", "calendar-sm-08", "calendar-sm-09", "calendar-sm-10", "calendar-md-01", "calendar-md-02", "calendar-md-03", "calendar-md-04", "calendar-md-05", "calendar-md-06", "calendar-lg-01", "calendar-lg-02", "calendar-lg-03", "calendar-lg-04", "calendar-lg-05", "calendar-lg-06", "clock-sm-01", "clock-sm-02", "clock-sm-03", "clock-sm-04", "clock-sm-05", "clock-sm-06", "clock-sm-07", "clock-sm-08", "clock-sm-09", "clock-sm-10", "clock-sm-11", "clock-sm-12", "clock-sm-13", "dashboard-sm-01", "dashboard-sm-02", "dashboard-sm-03", "dashboard-sm-04", "dashboard-sm-05", "dashboard-sm-06", "dashboard-md-01", "dashboard-md-02", "dashboard-lg-01", "dashboard-lg-02", "media-sm-01", "media-sm-02", "media-sm-03", "media-sm-04", "media-sm-05", "media-sm-06", "media-sm-07", "media-sm-08", "media-md-01", "media-md-02", "media-md-03", "media-md-04", "media-md-05", "productivity-sm-01", "productivity-sm-02", "productivity-sm-03", "productivity-sm-04", "productivity-sm-05", "productivity-sm-06", "productivity-sm-07", "productivity-md-01", "productivity-md-02", "productivity-md-03", "productivity-md-04", "sports-sm-01", "sports-sm-02", "sports-sm-03", "sports-sm-04", "sports-sm-05", "sports-sm-06", "sports-sm-07", "stock-sm-01" ], "component_items": [ { "name": "widget", "type": "registry:ui", "title": null, "description": null }, { "name": "icons", "type": "registry:ui", "title": null, "description": null }, { "name": "avatar", "type": "registry:ui", "title": null, "description": null }, { "name": "badge", "type": "registry:ui", "title": null, "description": null }, { "name": "button", "type": "registry:ui", "title": null, "description": null }, { "name": "carousel", "type": "registry:ui", "title": null, "description": null }, { "name": "circular-progress", "type": "registry:ui", "title": null, "description": null }, { "name": "dialog", "type": "registry:ui", "title": null, "description": null }, { "name": "dropdown-menu", "type": "registry:ui", "title": null, "description": null }, { "name": "input", "type": "registry:ui", "title": null, "description": null }, { "name": "label", "type": "registry:ui", "title": null, "description": null }, { "name": "popover", "type": "registry:ui", "title": null, "description": null }, { "name": "progress", "type": "registry:ui", "title": null, "description": null }, { "name": "select", "type": "registry:ui", "title": null, "description": null }, { "name": "scroll-area", "type": "registry:ui", "title": null, "description": null }, { "name": "separator", "type": "registry:ui", "title": null, "description": null }, { "name": "switch", "type": "registry:ui", "title": null, "description": null }, { "name": "tabs", "type": "registry:ui", "title": null, "description": null }, { "name": "textarea", "type": "registry:ui", "title": null, "description": null }, { "name": "tooltip", "type": "registry:ui", "title": null, "description": null }, { "name": "item", "type": "registry:ui", "title": null, "description": null }, { "name": "wheel-picker", "type": "registry:ui", "title": null, "description": null }, { "name": "utils", "type": "registry:lib", "title": null, "description": null }, { "name": "calendar-sm-01", "type": "registry:component", "title": null, "description": null }, { "name": "calendar-sm-02", "type": "registry:component", "title": null, "description": null }, { "name": "calendar-sm-03", "type": "registry:component", "title": null, "description": null }, { "name": "calendar-sm-04", "type": "registry:component", "title": null, "description": null }, { "name": "calendar-sm-05", "type": "registry:component", "title": null, "description": null }, { "name": "calendar-sm-06", "type": "registry:component", "title": null, "description": null }, { "name": "calendar-sm-07", "type": "registry:component", "title": null, "description": null }, { "name": "calendar-sm-08", "type": "registry:component", "title": null, "description": null }, { "name": "calendar-sm-09", "type": "registry:component", "title": null, "description": null }, { "name": "calendar-sm-10", "type": "registry:component", "title": null, "description": null }, { "name": "calendar-md-01", "type": "registry:component", "title": null, "description": null }, { "name": "calendar-md-02", "type": "registry:component", "title": null, "description": null }, { "name": "calendar-md-03", "type": "registry:component", "title": null, "description": null }, { "name": "calendar-md-04", "type": "registry:component", "title": null, "description": null }, { "name": "calendar-md-05", "type": "registry:component", "title": null, "description": null }, { "name": "calendar-md-06", "type": "registry:component", "title": null, "description": null }, { "name": "calendar-lg-01", "type": "registry:component", "title": null, "description": null }, { "name": "calendar-lg-02", "type": "registry:component", "title": null, "description": null }, { "name": "calendar-lg-03", "type": "registry:component", "title": null, "description": null }, { "name": "calendar-lg-04", "type": "registry:component", "title": null, "description": null }, { "name": "calendar-lg-05", "type": "registry:component", "title": null, "description": null }, { "name": "calendar-lg-06", "type": "registry:component", "title": null, "description": null }, { "name": "clock-sm-01", "type": "registry:component", "title": null, "description": null }, { "name": "clock-sm-02", "type": "registry:component", "title": null, "description": null }, { "name": "clock-sm-03", "type": "registry:component", "title": null, "description": null }, { "name": "clock-sm-04", "type": "registry:component", "title": null, "description": null }, { "name": "clock-sm-05", "type": "registry:component", "title": null, "description": null }, { "name": "clock-sm-06", "type": "registry:component", "title": null, "description": null }, { "name": "clock-sm-07", "type": "registry:component", "title": null, "description": null }, { "name": "clock-sm-08", "type": "registry:component", "title": null, "description": null }, { "name": "clock-sm-09", "type": "registry:component", "title": null, "description": null }, { "name": "clock-sm-10", "type": "registry:component", "title": null, "description": null }, { "name": "clock-sm-11", "type": "registry:component", "title": null, "description": null }, { "name": "clock-sm-12", "type": "registry:component", "title": null, "description": null }, { "name": "clock-sm-13", "type": "registry:component", "title": null, "description": null }, { "name": "dashboard-sm-01", "type": "registry:component", "title": null, "description": null }, { "name": "dashboard-sm-02", "type": "registry:component", "title": null, "description": null } ], "component_count": 119, "components_truncated": true, "component_types": { "registry:ui": 22, "registry:lib": 2, "registry:component": 93, "registry:hook": 2 }, "has_logo": true, "enrichment_errors": [], "featured": true }, { "number": 226, "name": "@heatmap", "category": "Uncategorized", "tags": [], "tagline": "Beautiful, accessible heatmap components for React: GitHub-style calendar, weekday x hour matrix, date x hour, and status timeline. Built with shadcn/ui conventions.", "short_description": "", "description": "Beautiful, accessible heatmap components for React: GitHub-style calendar, weekday x hour matrix, date x hour, and status timeline. Built with shadcn/ui conventions.", "homepage": "https://shadcn-heatmap.pages.dev", "docs": null, "github": null, "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://shadcn-heatmap.pages.dev/r/{name}.json", "registry_index": "https://shadcn-heatmap.pages.dev/registry.json", "components": [ "calendar-heatmap", "weekday-heatmap", "date-heatmap", "status-heatmap" ], "component_items": [ { "name": "calendar-heatmap", "type": "registry:component", "title": "CalendarHeatmap", "description": "GitHub-style yearly contribution heatmap with multi-year, weekStart, and i18n support." }, { "name": "weekday-heatmap", "type": "registry:component", "title": "WeekdayHeatmap", "description": "Weekday × hour-of-day matrix with Sum row/column and independent colour scales." }, { "name": "date-heatmap", "type": "registry:component", "title": "DateHeatmap", "description": "Date × hour matrix for zooming into a narrow time window with daily Sum column." }, { "name": "status-heatmap", "type": "registry:component", "title": "StatusHeatmap", "description": "Timeline status indicator showing daily activity over a period (e.g. 90 days). Similar to Atlassian Statuspage." } ], "component_count": 4, "components_truncated": false, "component_types": { "registry:component": 4 }, "has_logo": true, "enrichment_errors": [ "docs_unresolved", "github_unresolved" ], "featured": false }, { "number": 200, "name": "@xcn", "category": "Animated components", "tags": [ "aesthetic" ], "tagline": "Hand-crafted, beautiful, and minimal UI components built with Tailwind CSS and Motion.", "short_description": "Hand-crafted, beautiful, and minimal UI components built with Tailwind CSS and Motion.", "description": "Curated collection of hand-crafted, minimalist animated React components built with Tailwind CSS and Framer Motion (physics-based spring animations), distributed via the shadcn CLI (TanStack Start documentation site). Current components include Animated Cards (overlapping deck with hover scaling and per-card rotation), Animated Testimonials, Motion Button, Scroll Bars, Skeuomorphic Buttons, and Stamp. TypeScript throughout, Apache 2.0 licensed, early-stage with more components planned. Use for: projects needing a small set of highly polished, physics-animated UI accents — particularly stacked card and button effects — where minimal aesthetic and full code ownership are priorities.", "homepage": "https://ui.radiumcoders.com", "docs": "https://ui.radiumcoders.com/docs/thingyyy", "github": "https://github.com/radiumcoders/ui", "components_github": "https://github.com/radiumcoders/ui/tree/main/src/components", "github_default_branch": "main", "github_stars": 8, "last_commit": "2026-04-25T12:35:50Z", "archived": false, "license": "Apache-2.0", "open_issues": 0, "registry_template": "https://ui.radiumcoders.com/r/xcn/{name}.json", "registry_index": "https://ui.radiumcoders.com/r/index.json", "components": [ "animated-cards", "motion-btn", "scroll-bars", "animated-testimonials", "skeuomorphic-buttons", "stamp" ], "component_items": [ { "name": "animated-cards", "type": "registry:component", "title": "Animated Cards", "description": "Overlapping animated cards with subtle hover zoom and per-card rotation." }, { "name": "motion-btn", "type": "registry:component", "title": "Motion Button", "description": "A button component with a motion effect." }, { "name": "scroll-bars", "type": "registry:component", "title": "Scroll Bars", "description": "Animated scroll bars component." }, { "name": "animated-testimonials", "type": "registry:component", "title": "Animated Testimonials", "description": "Animated testimonials with blur effect." }, { "name": "skeuomorphic-buttons", "type": "registry:component", "title": "Skeuomorphic Buttons", "description": "A set of skeuomorphic buttons with realistic shadows and press effects." }, { "name": "stamp", "type": "registry:component", "title": "Stamp", "description": "A perforated edge stamp component with customizable colors." } ], "component_count": 6, "components_truncated": false, "component_types": { "registry:component": 6 }, "has_logo": true, "enrichment_errors": [], "featured": false }, { "number": 228, "name": "@saaskit", "category": "Uncategorized", "tags": [], "tagline": "10 essential shadcn/ui components for B2B SaaS: Pricing, Billing, Usage, and Onboarding. Minimalist Soft Brutalist design.", "short_description": "", "description": "10 essential shadcn/ui components for B2B SaaS: Pricing, Billing, Usage, and Onboarding. Minimalist Soft Brutalist design.", "homepage": "https://saaskit-theta.vercel.app", "docs": null, "github": null, "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://saaskit-theta.vercel.app/r/{name}.json", "registry_index": "https://saaskit-theta.vercel.app/registry.json", "components": [ "pricing-table", "trial-banner", "usage-meter", "onboarding-steps", "upgrade-modal", "team-invite", "invoice-row", "plan-badge", "api-key-card", "feature-gate" ], "component_items": [ { "name": "pricing-table", "type": "registry:component", "title": "PricingTable", "description": "Plans, toggle mensuel/annuel, highlight plan recommandé" }, { "name": "trial-banner", "type": "registry:component", "title": "TrialBanner", "description": "Bandeau J jours restants avec CTA upgrade" }, { "name": "usage-meter", "type": "registry:component", "title": "UsageMeter", "description": "Barre de quota avec seuils d'alerte (warn / danger)" }, { "name": "onboarding-steps", "type": "registry:component", "title": "OnboardingSteps", "description": "Checklist de setup avec progression et skip" }, { "name": "upgrade-modal", "type": "registry:component", "title": "UpgradeModal", "description": "Modal de passage au plan supérieur, avec feature gate" }, { "name": "team-invite", "type": "registry:component", "title": "TeamInvite", "description": "Invitation par email avec sélection de rôle" }, { "name": "invoice-row", "type": "registry:component", "title": "InvoiceRow", "description": "Ligne de facture avec statut, montant, téléchargement" }, { "name": "plan-badge", "type": "registry:component", "title": "PlanBadge", "description": "Badge Free / Pro / Enterprise dans le header" }, { "name": "api-key-card", "type": "registry:component", "title": "ApiKeyCard", "description": "Affichage + rotation de clé API masquée" }, { "name": "feature-gate", "type": "registry:component", "title": "FeatureGate", "description": "Wrapper qui bloque ou affiche un slot selon le plan" } ], "component_count": 10, "components_truncated": false, "component_types": { "registry:component": 10 }, "has_logo": true, "enrichment_errors": [ "docs_unresolved", "github_unresolved" ], "featured": false }, { "number": 201, "name": "@zippystarter", "category": "Blocks & sections (marketing/SaaS)", "tags": [ "saas" ], "tagline": "Expertly crafted blocks, components & themes for shadcn/ui.", "short_description": "Expertly crafted blocks, components & themes for shadcn/ui.", "description": "Freemium shadcn/ui block, component, and template registry targeting Next.js with Tailwind CSS. Free tier includes a growing set of marketing blocks: Hero (5 variants), Feature, Pricing, FAQ, Contact, Blog, About, and Image Group sections. Pro tier adds full Next.js starter templates (Devstarter developer portfolio, Focus marketing site, Nimble SaaS template) plus a private registry and MDX blog scaffold with a CLI that generates post stubs. Trusted by 50+ developers. Use for: quickly assembling a polished Next.js marketing site or SaaS landing page from copy-paste sections, especially when you also want matching full-page starter templates to maintain UI consistency as the project grows.", "homepage": "https://zippystarter.com", "docs": "N/A", "github": "N/A", "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://zippystarter.com/r/{name}.json", "registry_index": "https://zippystarter.com/r/registry.json", "components": [ "index", "avatars", "font-geist", "font-karla", "font-inter", "font-inter-tight", "font-mona-sans", "font-roboto", "font-open-sans", "font-lato", "font-poppins", "font-source-sans-pro", "font-nunito", "font-figtree", "font-host-grotesk", "font-space-grotesk", "font-montserrat", "font-raleway", "font-noto-sans", "font-work-sans", "font-roboto-flex", "font-merriweather", "font-lora", "font-eb-garamond", "font-playfair-display", "font-instrument-serif", "font-source-serif-pro", "font-crimson-text", "font-oswald", "font-bebas-neue", "font-anton", "font-righteous", "font-geist-mono", "font-jetbrains-mono", "font-roboto-mono", "font-source-code-pro", "font-fira-code", "font-ibm-plex-mono", "font-courier-prime", "font-dancing-script", "font-pacifico", "font-indie-flower", "avatar", "image", "link", "container", "ghibli", "focus", "nimble", "starbucks", "skyline", "bourbon", "pumpkin-spice", "catppuccin", "monokai", "neon-dreams", "desert-mirage", "neon-void", "netflix", "vercel", "rose", "blue", "green", "amber", "purple", "orange", "teal", "red", "yellow", "violet", "cyan", "emerald", "indigo", "lime", "pink", "sky", "fuchsia" ], "component_items": [ { "name": "index", "type": "registry:style", "title": "Index", "description": null }, { "name": "avatars", "type": "registry:file", "title": "Avatars", "description": null }, { "name": "font-geist", "type": "registry:font", "title": "Font Geist", "description": "Geist font from Google Fonts" }, { "name": "font-karla", "type": "registry:font", "title": "Font Karla", "description": "Karla font from Google Fonts" }, { "name": "font-inter", "type": "registry:font", "title": "Font Inter", "description": "Inter font from Google Fonts" }, { "name": "font-inter-tight", "type": "registry:font", "title": "Font Inter Tight", "description": "Inter Tight font from Google Fonts" }, { "name": "font-mona-sans", "type": "registry:font", "title": "Font Mona Sans", "description": "Mona Sans font from Google Fonts" }, { "name": "font-roboto", "type": "registry:font", "title": "Font Roboto", "description": "Roboto font from Google Fonts" }, { "name": "font-open-sans", "type": "registry:font", "title": "Font Open Sans", "description": "Open Sans font from Google Fonts" }, { "name": "font-lato", "type": "registry:font", "title": "Font Lato", "description": "Lato font from Google Fonts" }, { "name": "font-poppins", "type": "registry:font", "title": "Font Poppins", "description": "Poppins font from Google Fonts" }, { "name": "font-source-sans-pro", "type": "registry:font", "title": "Font Source Sans Pro", "description": "Source Sans Pro font from Google Fonts" }, { "name": "font-nunito", "type": "registry:font", "title": "Font Nunito", "description": "Nunito font from Google Fonts" }, { "name": "font-figtree", "type": "registry:font", "title": "Font Figtree", "description": "Figtree font from Google Fonts" }, { "name": "font-host-grotesk", "type": "registry:font", "title": "Font Host Grotesk", "description": "Host Grotesk font from Google Fonts" }, { "name": "font-space-grotesk", "type": "registry:font", "title": "Font Space Grotesk", "description": "Space Grotesk font from Google Fonts" }, { "name": "font-montserrat", "type": "registry:font", "title": "Font Montserrat", "description": "Montserrat font from Google Fonts" }, { "name": "font-raleway", "type": "registry:font", "title": "Font Raleway", "description": "Raleway font from Google Fonts" }, { "name": "font-noto-sans", "type": "registry:font", "title": "Font Noto Sans", "description": "Noto Sans font from Google Fonts" }, { "name": "font-work-sans", "type": "registry:font", "title": "Font Work Sans", "description": "Work Sans font from Google Fonts" }, { "name": "font-roboto-flex", "type": "registry:font", "title": "Font Roboto Flex", "description": "Roboto Flex font from Google Fonts" }, { "name": "font-merriweather", "type": "registry:font", "title": "Font Merriweather", "description": "Merriweather font from Google Fonts" }, { "name": "font-lora", "type": "registry:font", "title": "Font Lora", "description": "Lora font from Google Fonts" }, { "name": "font-eb-garamond", "type": "registry:font", "title": "Font Eb Garamond", "description": "EB Garamond font from Google Fonts" }, { "name": "font-playfair-display", "type": "registry:font", "title": "Font Playfair Display", "description": "Playfair Display font from Google Fonts" }, { "name": "font-instrument-serif", "type": "registry:font", "title": "Font Instrument Serif", "description": "Instrument Serif font from Google Fonts" }, { "name": "font-source-serif-pro", "type": "registry:font", "title": "Font Source Serif Pro", "description": "Source Serif Pro font from Google Fonts" }, { "name": "font-crimson-text", "type": "registry:font", "title": "Font Crimson Text", "description": "Crimson Text font from Google Fonts" }, { "name": "font-oswald", "type": "registry:font", "title": "Font Oswald", "description": "Oswald font from Google Fonts" }, { "name": "font-bebas-neue", "type": "registry:font", "title": "Font Bebas Neue", "description": "Bebas Neue font from Google Fonts" }, { "name": "font-anton", "type": "registry:font", "title": "Font Anton", "description": "Anton font from Google Fonts" }, { "name": "font-righteous", "type": "registry:font", "title": "Font Righteous", "description": "Righteous font from Google Fonts" }, { "name": "font-geist-mono", "type": "registry:font", "title": "Font Geist Mono", "description": "Geist Mono font from Google Fonts" }, { "name": "font-jetbrains-mono", "type": "registry:font", "title": "Font Jetbrains Mono", "description": "JetBrains Mono font from Google Fonts" }, { "name": "font-roboto-mono", "type": "registry:font", "title": "Font Roboto Mono", "description": "Roboto Mono font from Google Fonts" }, { "name": "font-source-code-pro", "type": "registry:font", "title": "Font Source Code Pro", "description": "Source Code Pro font from Google Fonts" }, { "name": "font-fira-code", "type": "registry:font", "title": "Font Fira Code", "description": "Fira Code font from Google Fonts" }, { "name": "font-ibm-plex-mono", "type": "registry:font", "title": "Font Ibm Plex Mono", "description": "IBM Plex Mono font from Google Fonts" }, { "name": "font-courier-prime", "type": "registry:font", "title": "Font Courier Prime", "description": "Courier Prime font from Google Fonts" }, { "name": "font-dancing-script", "type": "registry:font", "title": "Font Dancing Script", "description": "Dancing Script font from Google Fonts" }, { "name": "font-pacifico", "type": "registry:font", "title": "Font Pacifico", "description": "Pacifico font from Google Fonts" }, { "name": "font-indie-flower", "type": "registry:font", "title": "Font Indie Flower", "description": "Indie Flower font from Google Fonts" }, { "name": "avatar", "type": "registry:component", "title": "Avatar", "description": "Circular Avatar" }, { "name": "image", "type": "registry:component", "title": "Image", "description": "An image element you can use with any framework" }, { "name": "link", "type": "registry:component", "title": "Link", "description": "A link element you can use with any framework" }, { "name": "container", "type": "registry:component", "title": "Container", "description": "A container component to apply a consistent layout" }, { "name": "ghibli", "type": "registry:style", "title": "Ghibli", "description": "A theme based on the Ghibli color palette" }, { "name": "focus", "type": "registry:style", "title": "Focus", "description": "A theme based on the Focus color palette" }, { "name": "nimble", "type": "registry:style", "title": "Nimble", "description": "A theme based on the Nimble color palette" }, { "name": "starbucks", "type": "registry:style", "title": "Starbucks", "description": "A theme based on the Starbucks color palette" }, { "name": "skyline", "type": "registry:style", "title": "Skyline", "description": "A theme based on the Skyline color palette" }, { "name": "bourbon", "type": "registry:style", "title": "Bourbon", "description": "A theme based on the Bourbon color palette" }, { "name": "pumpkin-spice", "type": "registry:style", "title": "Pumpkin Spice", "description": "A theme based on the Pumpkin Spice color palette" }, { "name": "catppuccin", "type": "registry:style", "title": "Catppuccin", "description": "A theme based on the Catppuccin color palette" }, { "name": "monokai", "type": "registry:style", "title": "Monokai", "description": "A theme based on the Monokai color palette" }, { "name": "neon-dreams", "type": "registry:style", "title": "Neon Dreams", "description": "A theme based on the Neon Dreams color palette" }, { "name": "desert-mirage", "type": "registry:style", "title": "Desert Mirage", "description": "A theme based on the Desert Mirage color palette" }, { "name": "neon-void", "type": "registry:style", "title": "Neon Void", "description": "A theme based on the Neon Void color palette" }, { "name": "netflix", "type": "registry:style", "title": "Netflix", "description": "A theme based on the Netflix color palette" }, { "name": "vercel", "type": "registry:style", "title": "Vercel", "description": "A theme based on the Vercel color palette" } ], "component_count": 77, "components_truncated": false, "component_types": { "registry:style": 32, "registry:file": 1, "registry:font": 40, "registry:component": 4 }, "has_logo": true, "enrichment_errors": [ "github_lookup_failed" ], "featured": false }, { "number": 230, "name": "@kaui", "category": "Uncategorized", "tags": [], "tagline": "Personal well crafted components for Shadcn ui", "short_description": "", "description": "Personal well crafted components for Shadcn ui", "homepage": "https://kaui-shadcn-registry.vercel.app", "docs": null, "github": "https://github.com/diontr00/kaui-shadcn-registry", "components_github": "https://github.com/diontr00/kaui-shadcn-registry/tree/main/src/registry", "github_default_branch": "main", "github_stars": 12, "last_commit": "2026-06-29T00:40:25Z", "archived": false, "license": null, "open_issues": 0, "registry_template": "https://kaui-shadcn-registry.vercel.app/r/{name}.json", "registry_index": "https://kaui-shadcn-registry.vercel.app/r/registry.json", "components": [ "use-async", "async-button", "async-scope", "confirm-action", "use-debounce", "use-controlled-state", "combobox", "input-group", "multi-select", "password-input" ], "component_items": [ { "name": "use-async", "type": "registry:hook", "title": null, "description": "A hook that owns the async action lifecycle — loading state, success, error, and settled callbacks" }, { "name": "async-button", "type": "registry:component", "title": null, "description": "A button that performs async operations with a no-layout-shift loading state" }, { "name": "async-scope", "type": "registry:component", "title": null, "description": "A coordination layer for async UI — decouple what fires an action from what reacts to it." }, { "name": "confirm-action", "type": "registry:component", "title": null, "description": "A confirmation dialog that wraps an async action with loading state" }, { "name": "use-debounce", "type": "registry:hook", "title": null, "description": "A debounce hook that returns a stable { execute, cancel } object — safe to call without wrapping in useCallback" }, { "name": "use-controlled-state", "type": "registry:hook", "title": null, "description": "Uncontrolled/controlled state bridge — use like useState but accepts optional value and onChange props for full controlled mode support" }, { "name": "combobox", "type": "registry:component", "title": null, "description": "A single-select combobox with inline search, async loading support, and full controlled/uncontrolled API" }, { "name": "input-group", "type": "registry:component", "title": null, "description": "Compose inputs with inline addons, buttons, and labels in a styled container" }, { "name": "multi-select", "type": "registry:component", "title": null, "description": "A multi-select combobox with inline search, toggle-based selection, and full controlled/uncontrolled API" }, { "name": "password-input", "type": "registry:component", "title": null, "description": "A password input with show/hide toggle and an optional strength indicator" } ], "component_count": 10, "components_truncated": false, "component_types": { "registry:hook": 3, "registry:component": 7 }, "has_logo": true, "enrichment_errors": [ "docs_unresolved" ], "featured": false }, { "number": 231, "name": "@uiable", "category": "Uncategorized", "tags": [], "tagline": "Free, open-source UI component library built with Next.js, React 19, Tailwind CSS v4, and shadcn/ui — beautifully designed components you can copy, customize, and make your own.", "short_description": "", "description": "Free, open-source UI component library built with Next.js, React 19, Tailwind CSS v4, and shadcn/ui — beautifully designed components you can copy, customize, and make your own.", "homepage": "https://uiable.com", "docs": null, "github": "https://github.com/codedthemes/uiable", "components_github": "https://github.com/codedthemes/uiable/tree/master/src/components", "github_default_branch": "master", "github_stars": 18, "last_commit": "2026-07-08T05:12:33Z", "archived": false, "license": "MIT", "open_issues": 3, "registry_template": "https://uiable.com/r/{name}.json", "registry_index": "https://uiable.com/r/registry.json", "components": [ "uiable-accordion-basic", "uiable-accordion-borders", "uiable-accordion-card", "uiable-accordion-disabled", "uiable-accordion-flush", "uiable-accordion-multiple", "uiable-alert-action", "uiable-alert-basic", "uiable-alert-colors", "uiable-alert-destructive", "uiable-alert-dialog-basic", "uiable-alert-dialog-destructive", "uiable-alert-dialog-media", "uiable-alert-dialog-small", "uiable-alert-dialog-small-media", "uiable-alert-dismissible-danger", "uiable-alert-dismissible-dark", "uiable-alert-dismissible-info", "uiable-alert-dismissible-primary", "uiable-alert-dismissible-secondary", "uiable-alert-dismissible-success", "uiable-alert-dismissible-warning", "uiable-alert-icon-danger", "uiable-alert-icon-dark", "uiable-alert-icon-info", "uiable-alert-icon-primary", "uiable-alert-icon-secondary", "uiable-alert-icon-success", "uiable-alert-icon-warning", "uiable-alert-light-danger", "uiable-alert-light-dark", "uiable-alert-light-info", "uiable-alert-light-primary", "uiable-alert-light-secondary", "uiable-alert-light-success", "uiable-alert-light-warning", "uiable-alert-solid-danger", "uiable-alert-solid-dark", "uiable-alert-solid-info", "uiable-alert-solid-primary", "uiable-alert-solid-secondary", "uiable-alert-solid-success", "uiable-alert-solid-warning", "uiable-aspect-ratio-portrait", "uiable-aspect-ratio-square", "uiable-attachment-vertical", "uiable-attachment-group", "uiable-attachment-states", "uiable-attachment-sizes", "uiable-attachment-triggers", "uiable-avatar-badge", "uiable-avatar-badge-icon", "uiable-avatar-basic", "uiable-avatar-dropdown", "uiable-avatar-group", "uiable-avatar-group-count", "uiable-avatar-group-count-icon", "uiable-avatar-size", "uiable-badge-colors", "uiable-badge-icon", "uiable-badge-light-danger", "uiable-badge-light-dark", "uiable-badge-light-info", "uiable-badge-light-primary", "uiable-badge-light-secondary", "uiable-badge-light-success", "uiable-badge-light-warning", "uiable-badge-link", "uiable-badge-outline-danger", "uiable-badge-outline-dark", "uiable-badge-outline-info", "uiable-badge-outline-primary", "uiable-badge-outline-secondary", "uiable-badge-outline-success", "uiable-badge-outline-warning", "uiable-badge-pill-danger", "uiable-badge-pill-dark", "uiable-badge-pill-info", "uiable-badge-pill-primary", "uiable-badge-pill-secondary", "uiable-badge-pill-success", "uiable-badge-pill-warning", "uiable-badge-solid-danger", "uiable-badge-solid-dark", "uiable-badge-solid-info", "uiable-badge-solid-primary", "uiable-badge-solid-secondary", "uiable-badge-solid-success", "uiable-badge-solid-warning", "uiable-badge-spinner", "uiable-breadcrumb-basic", "uiable-breadcrumb-collapsed", "uiable-breadcrumb-dropdown", "uiable-breadcrumb-ellipsis", "uiable-breadcrumb-icon", "uiable-breadcrumb-link", "uiable-breadcrumb-page-header", "uiable-breadcrumb-separator", "uiable-button-default", "uiable-button-destructive" ], "component_items": [ { "name": "uiable-accordion-basic", "type": "registry:ui", "title": "Basic Accordion", "description": "Accordion Basic variant for accordion." }, { "name": "uiable-accordion-borders", "type": "registry:ui", "title": "Borders Accordion", "description": "Accordion Borders variant for accordion." }, { "name": "uiable-accordion-card", "type": "registry:ui", "title": "Card Accordion", "description": "Accordion Card variant for accordion." }, { "name": "uiable-accordion-disabled", "type": "registry:ui", "title": "Disabled Accordion", "description": "Accordion Disabled variant for accordion." }, { "name": "uiable-accordion-flush", "type": "registry:ui", "title": "Flush Accordion", "description": "Accordion Flush variant for accordion." }, { "name": "uiable-accordion-multiple", "type": "registry:ui", "title": "Multiple Accordion", "description": "Accordion Multiple variant for accordion." }, { "name": "uiable-alert-action", "type": "registry:ui", "title": "Action Alert", "description": "Alert Action variant for alert." }, { "name": "uiable-alert-basic", "type": "registry:ui", "title": "Basic Alert", "description": "Alert Basic variant for alert." }, { "name": "uiable-alert-colors", "type": "registry:ui", "title": "Colors Alert", "description": "Alert Colors variant for alert." }, { "name": "uiable-alert-destructive", "type": "registry:ui", "title": "Destructive Alert", "description": "Alert Destructive variant for alert." }, { "name": "uiable-alert-dialog-basic", "type": "registry:ui", "title": "Basic Alert Dialog", "description": "Alert Dialog Basic variant for alert-dialog." }, { "name": "uiable-alert-dialog-destructive", "type": "registry:ui", "title": "Destructive Alert Dialog", "description": "Alert Dialog Destructive variant for alert-dialog." }, { "name": "uiable-alert-dialog-media", "type": "registry:ui", "title": "Media Alert Dialog", "description": "Alert Dialog Media variant for alert-dialog." }, { "name": "uiable-alert-dialog-small", "type": "registry:ui", "title": "Small Alert Dialog", "description": "Alert Dialog Small variant for alert-dialog." }, { "name": "uiable-alert-dialog-small-media", "type": "registry:ui", "title": "Small Media Alert Dialog", "description": "Alert Dialog Small Media variant for alert-dialog." }, { "name": "uiable-alert-dismissible-danger", "type": "registry:ui", "title": "Danger Dismissible Alert", "description": "Alert Dismissible Danger variant for alert." }, { "name": "uiable-alert-dismissible-dark", "type": "registry:ui", "title": "Dark Dismissible Alert", "description": "Alert Dismissible Dark variant for alert." }, { "name": "uiable-alert-dismissible-info", "type": "registry:ui", "title": "Info Dismissible Alert", "description": "Alert Dismissible Info variant for alert." }, { "name": "uiable-alert-dismissible-primary", "type": "registry:ui", "title": "Primary Dismissible Alert", "description": "Alert Dismissible Primary variant for alert." }, { "name": "uiable-alert-dismissible-secondary", "type": "registry:ui", "title": "Secondary Dismissible Alert", "description": "Alert Dismissible Secondary variant for alert." }, { "name": "uiable-alert-dismissible-success", "type": "registry:ui", "title": "Success Dismissible Alert", "description": "Alert Dismissible Success variant for alert." }, { "name": "uiable-alert-dismissible-warning", "type": "registry:ui", "title": "Warning Dismissible Alert", "description": "Alert Dismissible Warning variant for alert." }, { "name": "uiable-alert-icon-danger", "type": "registry:ui", "title": "Danger Icon Alert", "description": "Alert Icon Danger variant for alert." }, { "name": "uiable-alert-icon-dark", "type": "registry:ui", "title": "Dark Icon Alert", "description": "Alert Icon Dark variant for alert." }, { "name": "uiable-alert-icon-info", "type": "registry:ui", "title": "Info Icon Alert", "description": "Alert Icon Info variant for alert." }, { "name": "uiable-alert-icon-primary", "type": "registry:ui", "title": "Primary Icon Alert", "description": "Alert Icon Primary variant for alert." }, { "name": "uiable-alert-icon-secondary", "type": "registry:ui", "title": "Secondary Icon Alert", "description": "Alert Icon Secondary variant for alert." }, { "name": "uiable-alert-icon-success", "type": "registry:ui", "title": "Success Icon Alert", "description": "Alert Icon Success variant for alert." }, { "name": "uiable-alert-icon-warning", "type": "registry:ui", "title": "Warning Icon Alert", "description": "Alert Icon Warning variant for alert." }, { "name": "uiable-alert-light-danger", "type": "registry:ui", "title": "Danger Light Alert", "description": "Alert Light Danger variant for alert." }, { "name": "uiable-alert-light-dark", "type": "registry:ui", "title": "Light Dark Alert", "description": "Alert Light Dark variant for alert." }, { "name": "uiable-alert-light-info", "type": "registry:ui", "title": "Light Info Alert", "description": "Alert Light Info variant for alert." }, { "name": "uiable-alert-light-primary", "type": "registry:ui", "title": "Light Primary Alert", "description": "Alert Light Primary variant for alert." }, { "name": "uiable-alert-light-secondary", "type": "registry:ui", "title": "Light Secondary Alert", "description": "Alert Light Secondary variant for alert." }, { "name": "uiable-alert-light-success", "type": "registry:ui", "title": "Light Success Alert", "description": "Alert Light Success variant for alert." }, { "name": "uiable-alert-light-warning", "type": "registry:ui", "title": "Light Warning Alert", "description": "Alert Light Warning variant for alert." }, { "name": "uiable-alert-solid-danger", "type": "registry:ui", "title": "Solid Danger Alert", "description": "Alert Solid Danger variant for alert." }, { "name": "uiable-alert-solid-dark", "type": "registry:ui", "title": "Solid Dark Alert", "description": "Alert Solid Dark variant for alert." }, { "name": "uiable-alert-solid-info", "type": "registry:ui", "title": "Solid Info Alert", "description": "Alert Solid Info variant for alert." }, { "name": "uiable-alert-solid-primary", "type": "registry:ui", "title": "Solid Primary Alert", "description": "Alert Solid Primary variant for alert." }, { "name": "uiable-alert-solid-secondary", "type": "registry:ui", "title": "Solid Secondary Alert", "description": "Alert Solid Secondary variant for alert." }, { "name": "uiable-alert-solid-success", "type": "registry:ui", "title": "Solid Success Alert", "description": "Alert Solid Success variant for alert." }, { "name": "uiable-alert-solid-warning", "type": "registry:ui", "title": "Solid Warning Alert", "description": "Alert Solid Warning variant for alert." }, { "name": "uiable-aspect-ratio-portrait", "type": "registry:ui", "title": "Portrait Aspect Ratio", "description": "Aspect Ratio Portrait variant for aspect-ratio." }, { "name": "uiable-aspect-ratio-square", "type": "registry:ui", "title": "Square Aspect Ratio", "description": "Aspect Ratio Square variant for aspect-ratio." }, { "name": "uiable-attachment-vertical", "type": "registry:ui", "title": "Vertical Attachment", "description": "Attachment Vertical variant for attachment." }, { "name": "uiable-attachment-group", "type": "registry:ui", "title": "Group", "description": "Attachment Group variant for attachment." }, { "name": "uiable-attachment-states", "type": "registry:ui", "title": "States", "description": "Attachment States variant for attachment." }, { "name": "uiable-attachment-sizes", "type": "registry:ui", "title": "Sizes", "description": "Attachment Sizes variant for attachment." }, { "name": "uiable-attachment-triggers", "type": "registry:ui", "title": "Trigger", "description": "Attachment Trigger variant for attachment." }, { "name": "uiable-avatar-badge", "type": "registry:ui", "title": "Badge Avatar", "description": "Avatar Badge variant for avatar." }, { "name": "uiable-avatar-badge-icon", "type": "registry:ui", "title": "Badge Icon Avatar", "description": "Avatar Badge Icon variant for avatar." }, { "name": "uiable-avatar-basic", "type": "registry:ui", "title": "Basic Avatar", "description": "Avatar Basic variant for avatar." }, { "name": "uiable-avatar-dropdown", "type": "registry:ui", "title": "Dropdown Avatar", "description": "Avatar Dropdown variant for avatar." }, { "name": "uiable-avatar-group", "type": "registry:ui", "title": "Group Avatar", "description": "Avatar Group variant for avatar." }, { "name": "uiable-avatar-group-count", "type": "registry:ui", "title": "Group Count Avatar", "description": "Avatar Group Count variant for avatar." }, { "name": "uiable-avatar-group-count-icon", "type": "registry:ui", "title": "Group Count Icon Avatar", "description": "Avatar Group Count Icon variant for avatar." }, { "name": "uiable-avatar-size", "type": "registry:ui", "title": "Size Avatar", "description": "Avatar Size variant for avatar." }, { "name": "uiable-badge-colors", "type": "registry:ui", "title": "Colors Badge", "description": "Badge Colors variant for badge." }, { "name": "uiable-badge-icon", "type": "registry:ui", "title": "Icon Badge", "description": "Badge Icon variant for badge." } ], "component_count": 529, "components_truncated": true, "component_types": { "registry:ui": 529 }, "has_logo": true, "enrichment_errors": [ "docs_unresolved" ], "featured": false }, { "number": 232, "name": "@vue-bits", "category": "Uncategorized", "tags": [], "tagline": "An open source collection of high quality, animated, interactive & fully customizable Vue components for building stunning, memorable user interfaces.", "short_description": "", "description": "An open source collection of high quality, animated, interactive & fully customizable Vue components for building stunning, memorable user interfaces.", "homepage": "https://vue-bits.dev", "docs": null, "github": null, "components_github": null, "github_default_branch": null, "github_stars": null, "last_commit": null, "archived": false, "license": null, "open_issues": null, "registry_template": "https://vue-bits.dev/r/{name}.json", "registry_index": "https://vue-bits.dev/r/registry.json", "components": [ "AnimatedContent", "AnimatedList", "Antigravity", "ASCIIText", "Aurora", "Balatro", "Ballpit", "Beams", "BlobCursor", "BlurText", "BorderGlow", "BounceCards", "BubbleMenu", "CardNav", "CardSwap", "Carousel", "ChromaGrid", "CircularGallery", "CircularText", "ClickSpark", "ColorBends", "Counter", "CountUp", "Crosshair", "Cubes", "CurvedLoop", "DarkVeil", "DecayCard", "DecryptedText", "Dither", "Dock", "DomeGallery", "DotField", "DotGrid", "ElasticSlider", "ElectricBorder", "EvilEye", "FadeContent", "FallingText", "FaultyTerminal", "Ferrofluid", "FloatingLines", "FlowingMenu", "FlyingPosters", "Folder", "FuzzyText", "Galaxy", "GhostCursor", "GlareHover", "GlassIcons", "GlassSurface", "GlitchText", "GooeyNav", "GradientBlinds", "GradientText", "GradualBlur", "Grainient", "GridDistortion", "GridMotion", "GridScan", "Hyperspeed", "ImageTrail", "InfiniteMenu", "Iridescence", "LaserFlow", "LetterGlitch", "Lightfall", "Lightning", "LightPillar", "LightRays", "LineWaves", "LiquidChrome", "LiquidEther", "LogoLoop", "MagicBento", "MagicRings", "Magnet", "MagnetLines", "Masonry", "MetaBalls", "MetallicPaint", "ModelViewer", "Noise", "Orb", "OrbitImages", "Particles", "PillNav", "PixelBlast", "PixelCard", "PixelSnow", "PixelTrail", "PixelTransition", "Plasma", "PlasmaWave", "Prism", "PrismaticBurst", "ProfileCard", "Radar", "ReflectiveCard", "Ribbons" ], "component_items": [ { "name": "AnimatedContent", "type": "registry:component", "title": "AnimatedContent", "description": "Wrapper that animates any children on scroll or mount with configurable direction, distance, duration, easing and disappear options." }, { "name": "AnimatedList", "type": "registry:component", "title": "AnimatedList", "description": "List items enter with staggered motion variants for polished reveals." }, { "name": "Antigravity", "type": "registry:component", "title": "Antigravity", "description": "3D antigravity particle field that repels from the cursor with smooth motion." }, { "name": "ASCIIText", "type": "registry:component", "title": "ASCIIText", "description": "Renders text with an animated ASCII background for a retro feel." }, { "name": "Aurora", "type": "registry:component", "title": "Aurora", "description": "Flowing aurora gradient background." }, { "name": "Balatro", "type": "registry:component", "title": "Balatro", "description": "The balatro shader, fully customizalbe and interactive." }, { "name": "Ballpit", "type": "registry:component", "title": "Ballpit", "description": "Physics ball pit simulation with bouncing colorful spheres." }, { "name": "Beams", "type": "registry:component", "title": "Beams", "description": "Crossing animated ribbons with customizable properties." }, { "name": "BlobCursor", "type": "registry:component", "title": "BlobCursor", "description": "Organic blob cursor that smoothly follows the pointer with inertia and elastic morphing." }, { "name": "BlurText", "type": "registry:component", "title": "BlurText", "description": "Text starts blurred then crisply resolves for a soft-focus reveal effect." }, { "name": "BorderGlow", "type": "registry:component", "title": "BorderGlow", "description": "Glowing mesh-gradient border that follows cursor direction and intensifies near edges." }, { "name": "BounceCards", "type": "registry:component", "title": "BounceCards", "description": "Cards bounce that bounce in on mount." }, { "name": "BubbleMenu", "type": "registry:component", "title": "BubbleMenu", "description": "Floating circular expanding menu with staggered item reveal." }, { "name": "CardNav", "type": "registry:component", "title": "CardNav", "description": "Expandable navigation bar with card panels revealing nested links." }, { "name": "CardSwap", "type": "registry:component", "title": "CardSwap", "description": "Cards animate position swapping with smooth layout transitions." }, { "name": "Carousel", "type": "registry:component", "title": "Carousel", "description": "Responsive carousel with touch gestures, looping and transitions." }, { "name": "ChromaGrid", "type": "registry:component", "title": "ChromaGrid", "description": "A responsive grid of grayscale tiles. Hovering the grid reaveals their colors." }, { "name": "CircularGallery", "type": "registry:component", "title": "CircularGallery", "description": "Circular orbit gallery rotating images." }, { "name": "CircularText", "type": "registry:component", "title": "CircularText", "description": "Layouts characters around a circle with optional rotation animation." }, { "name": "ClickSpark", "type": "registry:component", "title": "ClickSpark", "description": "Creates particle spark bursts at click position." }, { "name": "ColorBends", "type": "registry:component", "title": "ColorBends", "description": "Vibrant color bends with smooth flowing animation." }, { "name": "Counter", "type": "registry:component", "title": "Counter", "description": "Flexible animated counter supporting increments + easing." }, { "name": "CountUp", "type": "registry:component", "title": "CountUp", "description": "Animated number counter supporting formatting and decimals." }, { "name": "Crosshair", "type": "registry:component", "title": "Crosshair", "description": "Custom crosshair cursor with tracking, and link hover effects." }, { "name": "Cubes", "type": "registry:component", "title": "Cubes", "description": "3D rotating cube cluster. Supports auto-rotation or hover interaction." }, { "name": "CurvedLoop", "type": "registry:component", "title": "CurvedLoop", "description": "Flowing looping text path along a customizable curve with drag interaction." }, { "name": "DarkVeil", "type": "registry:component", "title": "DarkVeil", "description": "Subtle dark background with a smooth animation and postprocessing." }, { "name": "DecayCard", "type": "registry:component", "title": "DecayCard", "description": "Hover parallax effect that disintegrates the content of a card." }, { "name": "DecryptedText", "type": "registry:component", "title": "DecryptedText", "description": "Hacker-style decryption cycling random glyphs until resolving to real text." }, { "name": "Dither", "type": "registry:component", "title": "Dither", "description": "Retro dithered noise shader background." }, { "name": "Dock", "type": "registry:component", "title": "Dock", "description": "macOS style magnifying dock with proximity scaling of icons." }, { "name": "DomeGallery", "type": "registry:component", "title": "DomeGallery", "description": "Immersive 3D dome gallery projecting images on a hemispheric surface." }, { "name": "DotField", "type": "registry:component", "title": "DotField", "description": "Interactive dot grid with cursor bulge, glow, sparkle, and wave effects." }, { "name": "DotGrid", "type": "registry:component", "title": "DotGrid", "description": "Animated dot grid with cursor interactions." }, { "name": "ElasticSlider", "type": "registry:component", "title": "ElasticSlider", "description": "Slider handle stretches elastically then snaps with spring physics." }, { "name": "ElectricBorder", "type": "registry:component", "title": "ElectricBorder", "description": "Jittery electric energy border with animated arcs, glow and adjustable intensity." }, { "name": "EvilEye", "type": "registry:component", "title": "EvilEye", "description": "Procedural evil eye shader with animated iris, slit pupil, and fiery outer glow." }, { "name": "FadeContent", "type": "registry:component", "title": "FadeContent", "description": "Simple directional fade / slide entrance / exit wrapper with threshold-based activation." }, { "name": "FallingText", "type": "registry:component", "title": "FallingText", "description": "Characters fall with gravity + bounce creating a playful entrance." }, { "name": "FaultyTerminal", "type": "registry:component", "title": "FaultyTerminal", "description": "Terminal CRT scanline squares effect with flicker + noise." }, { "name": "Ferrofluid", "type": "registry:component", "title": "Ferrofluid", "description": "A churning magnetic fluid traced by glowing contour lines, with a cursor magnet." }, { "name": "FloatingLines", "type": "registry:component", "title": "FloatingLines", "description": "3D floating lines that react to cursor movement." }, { "name": "FlowingMenu", "type": "registry:component", "title": "FlowingMenu", "description": "Liquid flowing active indicator glides between menu items." }, { "name": "FlyingPosters", "type": "registry:component", "title": "FlyingPosters", "description": "3D posters rotate on scroll infinitely." }, { "name": "Folder", "type": "registry:component", "title": "Folder", "description": "Interactive folder opens to reveal nested content smooth motion." }, { "name": "FuzzyText", "type": "registry:component", "title": "FuzzyText", "description": "Vibrating fuzzy text with controllable hover intensity." }, { "name": "Galaxy", "type": "registry:component", "title": "Galaxy", "description": "Parallax realistic starfield with pointer interactions." }, { "name": "GhostCursor", "type": "registry:component", "title": "GhostCursor", "description": "Semi-transparent ghost cursor that smoothly follows the real cursor with a trailing effect." }, { "name": "GlareHover", "type": "registry:component", "title": "GlareHover", "description": "Adds a realistic moving glare highlight on hover over any element." }, { "name": "GlassIcons", "type": "registry:component", "title": "GlassIcons", "description": "Icon set styled with frosted glass blur." }, { "name": "GlassSurface", "type": "registry:component", "title": "GlassSurface", "description": "Advanced Apple-style glass surface with real-time distortion + lighting." }, { "name": "GlitchText", "type": "registry:component", "title": "GlitchText", "description": "RGB split and distortion glitch effect with jitter effects." }, { "name": "GooeyNav", "type": "registry:component", "title": "GooeyNav", "description": "Navigation indicator morphs with gooey blob transitions between items." }, { "name": "GradientBlinds", "type": "registry:component", "title": "GradientBlinds", "description": "Layered gradient blinds with spotlight and noise distortion." }, { "name": "GradientText", "type": "registry:component", "title": "GradientText", "description": "Animated gradient sweep across live text with speed and color control." }, { "name": "GradualBlur", "type": "registry:component", "title": "GradualBlur", "description": "Progressively un-blurs content based on scroll or trigger creating a cinematic reveal." }, { "name": "Grainient", "type": "registry:component", "title": "Grainient", "description": "Grainy gradient swirls with soft wave distortion." }, { "name": "GridDistortion", "type": "registry:component", "title": "GridDistortion", "description": "Warped grid mesh distorts smoothly reacting to cursor." }, { "name": "GridMotion", "type": "registry:component", "title": "GridMotion", "description": "Perspective moving grid lines based on cusror position." }, { "name": "GridScan", "type": "registry:component", "title": "GridScan", "description": "Animated grid room 3D scan effect and cool interactions." } ], "component_count": 132, "components_truncated": true, "component_types": { "registry:component": 132 }, "has_logo": true, "enrichment_errors": [ "docs_unresolved", "github_unresolved" ], "featured": false }, { "number": 233, "name": "@svelte-bits", "category": "Uncategorized", "tags": [], "tagline": "An open source collection of high quality, animated, interactive & fully customizable Svelte components for building stunning, memorable user interfaces.", "short_description": "", "description": "An open source collection of high quality, animated, interactive & fully customizable Svelte components for building stunning, memorable user interfaces.", "homepage": "https://sveltebits.xyz", "docs": null, "github": "https://github.com/DavidHDev/svelte-bits", "components_github": null, "github_default_branch": "main", "github_stars": 219, "last_commit": "2026-05-21T15:43:44Z", "archived": false, "license": null, "open_issues": 1, "registry_template": "https://sveltebits.xyz/r/{name}.json", "registry_index": "https://sveltebits.xyz/r/registry.json", "components": [ "animated-content", "antigravity", "blob-cursor", "click-spark", "crosshair", "cubes", "electric-border", "fade-content", "ghost-cursor", "glare-hover", "gradual-blur", "image-trail", "laser-flow", "logo-loop", "magic-rings", "magnet", "magnet-lines", "meta-balls", "metallic-paint", "noise", "orbit-images", "pixel-trail", "pixel-transition", "ribbons", "shape-blur", "splash-cursor", "star-border", "sticker-peel", "target-cursor", "aurora", "balatro", "ballpit", "beams", "color-bends", "dark-veil", "dither", "dot-field", "dot-grid", "evil-eye", "faulty-terminal", "floating-lines", "galaxy", "gradient-blinds", "grainient", "grid-distortion", "grid-motion", "grid-scan", "hyperspeed", "iridescence", "letter-glitch", "light-pillar", "light-rays", "lightning", "line-waves", "liquid-chrome", "liquid-ether", "orb", "particles", "pixel-blast", "pixel-snow", "plasma", "plasma-wave", "prism", "prismatic-burst", "radar", "ripple-grid", "shape-grid", "silk", "soft-aurora", "threads", "waves", "animated-list", "border-glow", "bounce-cards", "bubble-menu", "card-nav", "card-swap", "carousel", "chroma-grid", "circular-gallery", "counter", "decay-card", "dock", "dome-gallery", "elastic-slider", "flowing-menu", "flying-posters", "folder", "glass-icons", "glass-surface", "gooey-nav", "infinite-menu", "magic-bento", "masonry", "model-viewer", "pill-nav", "pixel-card", "profile-card", "reflective-card", "scroll-stack" ], "component_items": [ { "name": "animated-content", "type": "registry:component", "title": "Animated Content", "description": "Scroll-triggered entrance animation with distance, direction, scale and opacity controls. Powered by GSAP + ScrollTrigger." }, { "name": "antigravity", "type": "registry:component", "title": "Antigravity", "description": "Instanced 3D particles that orbit and react to the mouse with wave physics, rendered with three.js." }, { "name": "blob-cursor", "type": "registry:component", "title": "Blob Cursor", "description": "Gooey blob cursor with a trail of lagging blobs, smoothed via GSAP." }, { "name": "click-spark", "type": "registry:component", "title": "Click Spark", "description": "Clickable container that emits radial spark lines on click." }, { "name": "crosshair", "type": "registry:component", "title": "Crosshair", "description": "Animated crosshair lines that follow the cursor with subtle SVG turbulence on hover." }, { "name": "cubes", "type": "registry:component", "title": "Cubes", "description": "3D cube grid that tilts toward the cursor with optional ripple-on-click and idle drift." }, { "name": "electric-border", "type": "registry:component", "title": "Electric Border", "description": "Animated electric arcs around rounded rectangle borders rendered to canvas with noise displacement." }, { "name": "fade-content", "type": "registry:component", "title": "Fade Content", "description": "Scroll-triggered fade-in (with optional blur) entrance using GSAP + ScrollTrigger, with optional auto-disappearance." }, { "name": "ghost-cursor", "type": "registry:component", "title": "Ghost Cursor", "description": "WebGL ghostly cursor trail rendered with three.js + bloom + film grain post-processing." }, { "name": "glare-hover", "type": "registry:component", "title": "Glare Hover", "description": "Hover-triggered moving glare highlight across a card." }, { "name": "gradual-blur", "type": "registry:component", "title": "Gradual Blur", "description": "Multi-layer gradient-masked backdrop blur for soft fade-out edges (top/bottom/left/right)." }, { "name": "image-trail", "type": "registry:component", "title": "Image Trail", "description": "Mouse trail of images with 8 visually distinct GSAP variants." }, { "name": "laser-flow", "type": "registry:component", "title": "Laser Flow", "description": "Volumetric laser beam with wisps and tilting fog volume, rendered with three.js raw shader." }, { "name": "logo-loop", "type": "registry:component", "title": "Logo Loop", "description": "Smooth, infinite, pause-on-hover marquee for partner logos with optional fade-out edges." }, { "name": "magic-rings", "type": "registry:component", "title": "Magic Rings", "description": "WebGL2 concentric ring animation with mouse parallax, hover scale, and click burst. Real three.js shader." }, { "name": "magnet", "type": "registry:component", "title": "Magnet", "description": "Magnetic pull effect that attracts content toward the cursor when nearby." }, { "name": "magnet-lines", "type": "registry:component", "title": "Magnet Lines", "description": "A grid of small line segments that rotate to face the cursor." }, { "name": "meta-balls", "type": "registry:component", "title": "Meta Balls", "description": "Animated metaballs (gooey blob field) with cursor interaction, rendered with OGL shader." }, { "name": "metallic-paint", "type": "registry:component", "title": "Metallic Paint", "description": "Image-driven liquid metallic paint shader (WebGL2) with depth field solved via SOR relaxation." }, { "name": "noise", "type": "registry:component", "title": "Noise", "description": "Full-viewport animated film-grain canvas overlay." }, { "name": "orbit-images", "type": "registry:component", "title": "Orbit Images", "description": "Images orbiting along a configurable SVG path (ellipse, circle, star, heart, infinity, wave, custom)." }, { "name": "pixel-trail", "type": "registry:component", "title": "Pixel Trail", "description": "Pixelated mouse trail with optional gooey blend, rendered with three.js + a canvas-based trail texture." }, { "name": "pixel-transition", "type": "registry:component", "title": "Pixel Transition", "description": "Hover/click reveal that transitions between two contents through a randomized pixel grid effect." }, { "name": "ribbons", "type": "registry:component", "title": "Ribbons", "description": "Colorful spring-driven ribbon trails following the cursor, rendered with OGL polylines." }, { "name": "shape-blur", "type": "registry:component", "title": "Shape Blur", "description": "Mouse-reactive blurred SDF shapes (rounded rect, circle, ring, triangle) rendered with three.js." }, { "name": "splash-cursor", "type": "registry:component", "title": "Splash Cursor", "description": "Liquid splash burst at cursor with curling ripples and waves." }, { "name": "star-border", "type": "registry:component", "title": "Star Border", "description": "Button-like wrapper with two animated radial-gradient sweeps tracing the top and bottom border." }, { "name": "sticker-peel", "type": "registry:component", "title": "Sticker Peel", "description": "Draggable sticker that peels off on hover, with SVG specular lighting and drop shadow filters." }, { "name": "target-cursor", "type": "registry:component", "title": "Target Cursor", "description": "Custom spinning crosshair cursor that snaps to corners of elements matching a selector when hovered." }, { "name": "aurora", "type": "registry:component", "title": "Aurora", "description": "WebGL aurora background with configurable color stops, amplitude, blend and speed. Real OGL shader, not a CSS gradient." }, { "name": "balatro", "type": "registry:component", "title": "Balatro", "description": "Swirling pixel-painted Balatro-style WebGL background with mouse interaction." }, { "name": "ballpit", "type": "registry:component", "title": "Ballpit", "description": "Interactive 3D ball pit using Three.js physics." }, { "name": "beams", "type": "registry:component", "title": "Beams", "description": "Light beams animated with noise displacement." }, { "name": "color-bends", "type": "registry:component", "title": "Color Bends", "description": "Three.js shader background with warped color bands, pointer parallax, noise, and rotation controls." }, { "name": "dark-veil", "type": "registry:component", "title": "Dark Veil", "description": "Dark veil WebGL background with hue shift, scanlines, noise and warp controls." }, { "name": "dither", "type": "registry:component", "title": "Dither", "description": "Bayer-dithered animated wave field." }, { "name": "dot-field", "type": "registry:component", "title": "Dot Field", "description": "Interactive dotted canvas background with cursor bulge, glow, sparkle, and wave controls." }, { "name": "dot-grid", "type": "registry:component", "title": "Dot Grid", "description": "Interactive grid of dots with cursor proximity highlighting and shockwave click physics." }, { "name": "evil-eye", "type": "registry:component", "title": "Evil Eye", "description": "Reactive evil eye background with cursor-tracked pupil." }, { "name": "faulty-terminal", "type": "registry:component", "title": "Faulty Terminal", "description": "OGL terminal-style shader background with scanlines, glitches, curvature, mouse reaction, and load animation." }, { "name": "floating-lines", "type": "registry:component", "title": "Floating Lines", "description": "Layered animated wave lines with parallax & bend." }, { "name": "galaxy", "type": "registry:component", "title": "Galaxy", "description": "Animated galaxy of twinkling stars." }, { "name": "gradient-blinds", "type": "registry:component", "title": "Gradient Blinds", "description": "Animated gradient blinds with spotlight tracking." }, { "name": "grainient", "type": "registry:component", "title": "Grainient", "description": "Animated WebGL2 grainy gradient." }, { "name": "grid-distortion", "type": "registry:component", "title": "Grid Distortion", "description": "Image grid distortion driven by mouse movement." }, { "name": "grid-motion", "type": "registry:component", "title": "Grid Motion", "description": "Grid that pans with mouse position, powered by GSAP." }, { "name": "grid-scan", "type": "registry:component", "title": "Grid Scan", "description": "Animated 3D grid scan with bloom and chromatic aberration. Optional face tracking via face-api.js." }, { "name": "hyperspeed", "type": "registry:component", "title": "Hyperspeed", "description": "Three.js hyperspeed road background with bloom, SMAA, distortion presets, animated light trails, and hold-to-accelerate interaction." }, { "name": "iridescence", "type": "registry:component", "title": "Iridescence", "description": "Animated iridescent WebGL background with optional mouse parallax." }, { "name": "letter-glitch", "type": "registry:component", "title": "Letter Glitch", "description": "Cascading glitchy letter grid background." }, { "name": "light-pillar", "type": "registry:component", "title": "LightPillar", "description": "Volumetric raymarched light pillar." }, { "name": "light-rays", "type": "registry:component", "title": "Light Rays", "description": "Animated volumetric light rays rendered with OGL." }, { "name": "lightning", "type": "registry:component", "title": "Lightning", "description": "Procedural lightning bolt WebGL background." }, { "name": "line-waves", "type": "registry:component", "title": "Line Waves", "description": "Warped line waves background powered by OGL." }, { "name": "liquid-chrome", "type": "registry:component", "title": "Liquid Chrome", "description": "Liquid chrome animated WebGL background with mouse and touch interaction." }, { "name": "liquid-ether", "type": "registry:component", "title": "Liquid Ether", "description": "Interactive liquid shader with flowing distortion and customizable colors." }, { "name": "orb", "type": "registry:component", "title": "Orb", "description": "Dreamy hue-shifting orb with hover interaction." }, { "name": "particles", "type": "registry:component", "title": "Particles", "description": "OGL-based 3D point cloud particles with hover interaction." }, { "name": "pixel-blast", "type": "registry:component", "title": "PixelBlast", "description": "Pixelated dithered shape field with ripples and liquid distortion." }, { "name": "pixel-snow", "type": "registry:component", "title": "Pixel Snow", "description": "Volumetric pixel snowfall background." } ], "component_count": 128, "components_truncated": true, "component_types": { "registry:component": 128 }, "has_logo": true, "enrichment_errors": [ "docs_unresolved" ], "featured": false } ], "featured_count": 100 }