SLARIVO / LISTS

Lists Components

Browse 320 exact locally owned demos. Filter the collection, inspect a focused preview, and unlock its implementation prompt.

• Slarivo Stacked List x

  An animated stacked list with smooth layout transitions.

• Slarivo List

  List views are a great way to show a list of tasks grouped by status and ranked by priority.

• Slarivo Listbox

  Here is Listbox component

• Slarivo Animated List

  A list that animates each item in sequence with a delay. Used to showcase notifications or events on your landing page.

• Slarivo Select

  Display a dropdown list of items.

• Slarivo List 2

  A general list component

• Slarivo Timeline

  Displays a list of events in chronological order.

• Slarivo List Box [react-aria-components]

  A ListBox displays a list of options and allows a user to select one or more of them. A listbox can be built using the <select> and <option> HTML elements, but this is not possible to style consistently cross browser. ListBox helps you build accessible listbox components that can be styled as needed.

• Slarivo Grid List [react-aria-components]

  A grid list displays a list of interactive items, with support for keyboard navigation, single or multiple selection, and row actions. A list can be built using <ul> or <ol> HTML elements, but does not support any user interactions. HTML lists are meant for static content, rather than lists with rich interactions like focusable elements within rows, keyboard navigation, row selection, etc. GridList helps achieve accessible and interactive list components that can be styled as needed.

• Slarivo Scroller

  Display an overflowing list of items.

• Slarivo Text Rotate

  A text component that switches the rendered text from a list.

• Slarivo Radio Group

  Enhanced shadcn/ui radio group

• Slarivo Reveal images

  Reveals the images on hover.

• Slarivo Toast

  A succinct message that is displayed temporarily.

• Slarivo Menu Vertical

  Here is Menu Vertical component

• Slarivo Animated Background

  The AnimatedBackground component visually highlights selected items by sliding a background into view when hovered over or clicked. This smooth transition helps users focus on the active item, making it ideal for interactive lists, menus, or navigations where clear selection feedback is important.

• Slarivo Live Feed

  Live Feed Component

• Slarivo Animated Comman Menu

  Animated Comman Menu

• Slarivo Select

  Display a dropdown list of items.

• Slarivo Select

  Reusable select option component built with framer motion and tailwindcss

• Slarivo Animated Project Cards

  This component renders a list of animated, expandable project cards with smooth framer-motion transitions, hover/tap effects, dynamic chevron toggling, and staggered child animations for category tags, metadata, and descriptions. Can be easily customizable for any accordion style component. Perfect for freelance dashboards, gig marketplaces, or any project listing interface where you want rich interactivity and polished microinteractions.

• Slarivo Member List

  Here is modern Member list by indev ui

• Slarivo Card Status List

  This component displays a dynamic list of status-driven cards with built-in syncing animations, hover-activated actions, and staggered motion transitions using framer-motion. It supports syncing state transitions (updates-found → syncing → completed), animated status indicators, and optional back/add button callbacks. Perfect for onboarding flows, document indexing, status updates, guided setup sequences, or any app section where users must complete a set of progressive tasks.

• Slarivo Joblisting

  sleek animation job lisiting model type component

• Slarivo Notifications Filter

  This Notifications with Category Filter component provides a clean and efficient way for users to organize and browse through their alerts. Instead of showing all notifications in a single stream, it introduces category filters such as All, Updates, Alerts, and Reminders, allowing users to quickly narrow down what matters most. The interface is minimal, using only Lucide icons and neutral theme styles, ensuring it fits seamlessly in both light and dark modes.

• Slarivo Sortable

  A drag-and-drop sortable component designed for seamless item organization across customizable columns.

• Slarivo Combobox

  Filters large lists to selectable options based on the matching query.

• Slarivo Combobox

  Filters large lists to selectable options based on the matching query.

• Slarivo Combobox

  Filters large lists to selectable options based on the matching query.

• Slarivo Music Portfolio

  A sophisticated React component for displaying music portfolios, discographies, or creative project collections with stunning interactive effects. Features include text scrambling animations on hover using GSAP, dynamic background image transitions, automatic idle animations, and full support for system dark/light themes. Perfect for musicians, record labels, music producers, or creative agencies looking to showcase their work in an engaging, modern interface. The component offers a minimalist grid layout that transforms into an immersive visual experience through smooth animations and hover interactions

• Slarivo Table

  A semantic HTML table component

• Slarivo Skills Showcase

  This component can be used in portfolio to showcase the skills.

• Slarivo Sortable

  A drag and drop sortable component for reordering items.

• Slarivo Messaging people list

  A simple messaging component to display people list

• Slarivo Task List

  Task List This component renders a list of tasks in a table format. It features a staggered animation for list items, making the UI feel dynamic and modern. It's designed to be highly reusable, accepting a title and an array of tasks as props.

• Slarivo Command Menu

  Launch a set of actions as a full-screen overlay.

• Slarivo Draggable List

  A reorderable list component with drag and drop functionality.

• Slarivo Download Toast

  This project is a responsive React component that displays a list of file downloads with a sleek, modern design. It features an animated background, light/dark modes, and a progress bar for active downloads.

• Slarivo Notifications

  This Notifications component is a reusable UI element built with shadcn/ui and TypeScript (TSX) that displays a bell icon with a notification count badge. When the user clicks the bell, a popover card opens directly beneath the icon, aligned to its center, containing a scrollable list of notifications. Each notification shows a title, description, and timestamp in a clean, structured layout.

• Slarivo Expandable Skill Tags

  Expandable Skill Tags component, which displays a collection of skills with a "View all" / "View less" toggle, complete with smooth animations using framer-motion.

• Slarivo Project Badge

  Here is modern project badge component

• Slarivo Animated List

  Here is animated list component

• Slarivo Dashboard

  Storage Dashboard A clean usage tracker with category breakdowns, progress bar, and upgrade prompts. Ideal for cloud storage apps to monitor space and encourage plan upgrades.

• Slarivo Pagination with text buttons

  Pagination with text buttons

• Slarivo Command Menu

  A command palette component with keyboard navigation, search, and shortcuts for quick actions and navigation.

• Slarivo NotificationsWithActions

  This Notifications with Actions component, a standard notification popover by adding interactive controls for each notification. A GripVertical icon on the right allows users to reveal contextual actions — specifically Archive and Delete buttons — which animate into view by slightly shifting the text content to the left. To enhance usability, a dedicated ChevronLeft icon appears alongside these actions, letting users easily close the action menu and return the notification item to its normal state. The component is fully reusable, supports popover placement customization, and uses Framer Motion for smooth transitions.

• Slarivo Leaderboard Rankings

  Lists component from the 21st.dev community.

• Slarivo Workout Card

  Workout Card Description: A container component to display a "Workout of the Day" session, complete with a title, duration, and an animated list of exercises.

• Slarivo Vercel Notification Popover

  A Vercel-style notification center that adapts to the device. Renders as a popover on desktop and a bottom sheet on mobile, with animated tabs and hover actions.

• Slarivo Swipe Row

  A swipe row for providing actions of swipe of left and right

• Slarivo Timeline

  A timeline component with sticky header and scroll beam follow.

• Slarivo Testimonials Columns

  an animated testimonials section where the testimonials are shown in columns

• Slarivo Dock

  A versatile UI element that provides a flexible and customizable way to organize and display menu items within your application.

• Slarivo Scroll Area

  Augments native scroll functionality for custom, cross-browser styling.

• Slarivo Marquee

  Very useful while showcasing comments or technologies

• Slarivo Card

  Containers for displaying content and actions about a single subject.

• Slarivo Features 10

  features section

• Slarivo Action Search Bar

  Action search bar inspired from Raycast

• Slarivo Cards Stack

  - Stack of cards to showcase a related set of element, like your services, your work, features, process of work, timeline,

• Slarivo Card

  Latest News Card A card component designed to display a list of recent articles or news items. It features a main title, a "View all" link, and a list of animated news entries that fade in on load. Each item is clickable and has a subtle hover effect.

• Slarivo Job Listing

  Here is Job Listing component

• Slarivo Careers 4

  Basic careers section with jobs grouped by role with location label and link

• Slarivo Collapsible

  Lists component from the 21st.dev community.

• Slarivo ListBox

  Here is ListBox component

• Slarivo ListBox

  Here is ListBox component

• Slarivo ListBox

  Here is ListBox component

• Slarivo ListBox

  Here is ListBox component

• Slarivo Integrations 02

  An integrations panel listing third-party tools and services, each with a favicon and a Connect button or Connected status badge.

• Slarivo 8bit Item

  An 8-bit styled item row for lists and inventories. Composes ItemGroup, Item, ItemContent, ItemTitle, ItemDescription, ItemActions and a pixelated ItemSeparator, with default, outline and muted variants in the retro pixel theme.

• Slarivo Markdown

  Render markdown with headings, lists, tables, blockquotes, code fences, and safe external links. State-friendly for streaming text. Self-contained port from 21st.dev Agent Elements (uses react-markdown + remark-gfm in place of streamdown + @streamdown/code).

• Slarivo Achievement Card

  Lists component from the 21st.dev community.

• Slarivo Achievement List

  Lists component from the 21st.dev community.

• Slarivo Collapsible

  Here is Collapsible component

• Slarivo Listbox

  Here is Listbox component

• Slarivo Listbox

  Here is Listbox component

• Slarivo Listbox

  Here is Listbox component

• Slarivo Listbox

  Here is Listbox component

• Slarivo Listbox

  Here is Listbox component

• Slarivo Draggable Priority List

  A keyboard and drag-and-drop reorderable list with rank numbers, smooth transitions, and full accessibility support. Built with native HTML5 DnD.

• Slarivo BeUI Swipeable List

  Lists component from the 21st.dev community.

• Slarivo Shared Files

  Shared Files Panel Streamlined interface to manage and track file-sharing with contacts. Perfect for collaboration tools to keep shared access transparent and organized.

• Slarivo Tracker Card

  Calorie Tracker Card A visually engaging card to track daily calorie intake. It features an animated counter, a dynamic progress bar, and a list for food suggestions, all styled using shadcn/ui principles.

• Slarivo List Item

  An animated list item with smooth entrance and exit effects.

• Slarivo Points Levels List

  Lists component from the 21st.dev community.

• Slarivo Interfaces Collapsible

  Collapsible component from Interfaces DS — an expandable content panel with animated open and close states.

• Slarivo The Item one

  Here is The Item components

• Slarivo The Item one

  Here is The Item components

• Slarivo Keyboard

  A keyboard shortcut label that renders inline hint keys (like ⌘K) next to menu items, commands, and actions.

• Slarivo List Skeleton with Icons

  An animated list loading skeleton with a title bar, icon-and-text rows, and badge placeholders that stagger a fade-up when scrolled into view.

• Slarivo Market Watchlist

  Sortable market watchlist: per-row sparkline trend, sort by symbol or change with direction toggle, and row selection marked by an accent rail. Light and dark via theme tokens.

• Slarivo HeroUI ListBox

  HeroUI v3 ListBox — an accessible, keyboard-navigable list of selectable options with single and multiple selection, sections with headers, per-item labels, descriptions, avatars and keyboard-shortcut hints, disabled items, custom selection indicators, controlled selection state, custom render functions, and windowed virtualization for large datasets. A thin re-export of the genuine @heroui/react package with @heroui/styles, so consumers install and render the real HeroUI primitive.

• Slarivo HeroUI ListBox

  HeroUI v3 ListBox — an accessible, keyboard-navigable list of selectable options with single and multiple selection, sections with headers, per-item labels, descriptions, avatars and keyboard-shortcut hints, disabled items, custom selection indicators, controlled selection state, custom render functions, and windowed virtualization for large datasets. A thin re-export of the genuine @heroui/react package with @heroui/styles, so consumers install and render the real HeroUI primitive.

• Slarivo HeroUI ListBox

  HeroUI v3 ListBox — an accessible, keyboard-navigable list of selectable options with single and multiple selection, sections with headers, per-item labels, descriptions, avatars and keyboard-shortcut hints, disabled items, custom selection indicators, controlled selection state, custom render functions, and windowed virtualization for large datasets. A thin re-export of the genuine @heroui/react package with @heroui/styles, so consumers install and render the real HeroUI primitive.

• Slarivo HeroUI ListBox

  HeroUI v3 ListBox — an accessible, keyboard-navigable list of selectable options with single and multiple selection, sections with headers, per-item labels, descriptions, avatars and keyboard-shortcut hints, disabled items, custom selection indicators, controlled selection state, custom render functions, and windowed virtualization for large datasets. A thin re-export of the genuine @heroui/react package with @heroui/styles, so consumers install and render the real HeroUI primitive.

• Slarivo HeroUI ListBox

  HeroUI v3 ListBox — an accessible, keyboard-navigable list of selectable options with single and multiple selection, sections with headers, per-item labels, descriptions, avatars and keyboard-shortcut hints, disabled items, custom selection indicators, controlled selection state, custom render functions, and windowed virtualization for large datasets. A thin re-export of the genuine @heroui/react package with @heroui/styles, so consumers install and render the real HeroUI primitive.

• Slarivo HeroUI ListBox

  HeroUI v3 ListBox — an accessible, keyboard-navigable list of selectable options with single and multiple selection, sections with headers, per-item labels, descriptions, avatars and keyboard-shortcut hints, disabled items, custom selection indicators, controlled selection state, custom render functions, and windowed virtualization for large datasets. A thin re-export of the genuine @heroui/react package with @heroui/styles, so consumers install and render the real HeroUI primitive.

• Slarivo HeroUI ListBox

  HeroUI v3 ListBox — an accessible, keyboard-navigable list of selectable options with single and multiple selection, sections with headers, per-item labels, descriptions, avatars and keyboard-shortcut hints, disabled items, custom selection indicators, controlled selection state, custom render functions, and windowed virtualization for large datasets. A thin re-export of the genuine @heroui/react package with @heroui/styles, so consumers install and render the real HeroUI primitive.

• Slarivo ReUI Filters

  ReUI Filters with the first 10 official ReUI examples, preserved from the MIT-licensed source registry.

• Slarivo Reorder List

  A vertical drag-and-drop list for reordering items, with full keyboard support (grab, arrow-move, drop, cancel) and screen-reader announcements.

• Slarivo Notification List

  An animated notification list where stacked cards fan out and expand on hover, revealing each notification's details.

• Slarivo Alert

  Alert in shadcn/ui format

• Slarivo Waitlist Hero

  Waitlist Hero Animation

• Slarivo Pricing Card

  A sleek, component-based Card system with glass effects, pricing layouts, and flexible sections like header, body, and list items. Perfect for modern SaaS pricing tables, feature lists, or product showcases with consistent, stylish UI.

• Slarivo Project Showcase

  A minimal, list-based portfolio section with a cursor-following image preview. On hover, a smooth floating image appears and tracks your mouse using lerp-based animation.

• Slarivo Gallery

  Gallery

• Slarivo Workspaces

  a flexible, context-based solution to manage and display multiple workspaces in your app. It uses Radix Popover, supports avatars, search, and customizable rendering—perfect for SaaS dashboards with multi-tenant support.

• Slarivo Calendar

  Book a call

• Slarivo lumina-interactive-list

  A sophisticated, hover-responsive showcase block designed for high-end creative portfolios and luxury brand websites. This component features a minimalist vertical navigation list (01–06) that dynamically updates a featured image preview. It balances "Quiet Luxury" typography with high-impact visuals, creating a "premium" user experience that feels both authoritative and mysterious. It is optimized for developers who want to display "Featured Creations" with an air of exclusivity and artistic depth.

• Slarivo Filesystem Item

  Render a filesystem tree of arbitrary depth using a single recursive component.

• Slarivo Faq 5

  Center aligned FAQ with numbers and expanded text.

• Slarivo Features 5

  features section

• Slarivo Search Modal

  A powerful command palette with keyboard shortcuts, categorized results, and live search filtering. Perfect for SaaS apps, dashboards, and productivity tools to deliver a fast, intuitive, and modern search experience.

• Slarivo Accordion 05

  Accordion with hiding title

• Slarivo Category List

  An interactive and theme-adaptive list component used to display and navigate through different categories or features. Each item provides visual feedback on hover, revealing more details and an icon, making it ideal for guiding users through key sections of an application.

• Slarivo Quick Links Card

  Quick Links Card

• Slarivo NotificationIn box Popover

  This Notification Inbox Popover provides a clean, inbox-style experience for managing alerts directly within the app. Users can toggle between All and Unread notifications using tabs, while each notification is displayed with a relevant Lucide icon, bold styling for unread items, and a timestamp for context. A small dot indicator reinforces which items are new. The design now also includes a “Mark all as read” option in the header, allowing users to quickly clear unread items in one click. Combined with the footer’s “View all notifications” action, this layout balances clarity and efficiency, making it well-suited for SaaS dashboards, admin panels, or productivity apps where streamlined notification handling is essential.

• Slarivo Interactive Logs Table

  Observability logs panel with animated filters, search, and expandable rows

• Slarivo Scroll Area

  A customizable scroll area component with smooth scrolling and accessible scrollbars.

• Slarivo Tree

  Here is Tree component

• Slarivo Team Showcase

  A magazine-style team section featuring a three-column staggered photo grid paired with an interactive member list. Photos default to grayscale; hovering a photo or a name entry simultaneously reveals the portrait in full color and highlights the corresponding name row. Includes social link icons (X, LinkedIn) that animate in on row hover.

• Slarivo Changelog 1

  Modern Changelog view with versions, dates, description images. An array of changelog entries with stick scroll effect.

• Slarivo Rolling List

  Animated process list with hover roll text and image preview.

• Slarivo Services with Animated Hover Modal

  A responsive services component that displays a list of offerings. On hover, a modal follows the cursor, revealing project images with smooth scaling and transition effects. Built with GSAP for cursor‑following animations and Framer Motion for scale transitions.

• Slarivo Scroll Area

  Augments native scroll functionality for custom, cross-browser styling.

• Slarivo Action Searchbar

  Action searchbar the name itself is enough Animated smooth transtitional searchbar with framer motion

• Slarivo Progressive Blur

  Here is Progressive Blur component

• Slarivo Audio Player

  Here is Audio Player component

• Slarivo Feature Highlight

  Feature Highlight Component This component animates a list of features, a title, and an icon into view with a staggered effect. It's built to be highly reusable—you can pass any text, icons, or custom elements as props.

• Slarivo Item

  Here is Item component

• Slarivo Numbered Pagination

• Slarivo Image Reveal

  Here is image reveal component

• Slarivo Dashboard Activities

  Dashboard Activities Admin Dashboard Activities Recent activity

• Slarivo Waitlist

  Here is waitlist ui component

• Slarivo useItemOverflow

  Responsive and dynamically calculates the number of items that can fit within a container without overflowing, while accounting for a "+X" overflow indicator. It automatically adjusts to container resizes and provides utilities to render responsive lists (e.g., tags, avatars, or badges) that gracefully handle overflow.

• Slarivo Todo List Item

  A reusable animated todo list item component with swipe actions and strike-through animation. Inspired by the original non-reusable implementation by @alirdev and @sekachov design. Features: - Smooth strike-through animation on completion - Swipe gestures for actions - Action buttons for complete/delete - Theme support using shadcn/ui colors - Fully typed props

• Slarivo Omni Command Palette

  a fast, accessible, mobile-friendly command/search palette with async multi-sources, fuzzy highlighting, recents, presets, pinned actions, and keyboard shortcuts.

• Slarivo Scroller

  Display an overflowing list of items.

• Slarivo Scroller

  Display an overflowing list of items.

• Slarivo Scroller

  Display an overflowing list of items.

• Slarivo Scroller

  Display an overflowing list of items.

• Slarivo Financial Dashboard

  Financial Dashboard This component provides a comprehensive overview of financial activities, including quick actions, recent transactions, and available services. It is designed to be the central hub of a financial application.

• Slarivo Accordion Multi-level

  Here is accordion multi-level component

• Slarivo Feature Accordion Section

  This component provides an interactive and visually engaging way to present key features in an organized layout. The left section highlights important items with clear icons, images, and counts, while an accordion ensures that detailed information can be expanded or collapsed as needed.

• Slarivo Progressive Blur Modal

  Here is Progressive Blur Modal component

• Slarivo Waitlist Form

  Animated and minimal waitlist form with email input and submit button.

• Slarivo Pin List

  Here is animated Pin List component

• Slarivo Hotel Showcase

  Interactive hotel showcase with GSAP animations featuring image galleries, smooth transitions, and overlay details. Includes hover effects, keyboard navigation, and responsive design for displaying luxury hotel collections.

• Slarivo To-do card

  Animated to-do list card

• Slarivo Combobox

  An input combined with a list of predefined items to select.

• Slarivo Combobox

  An input combined with a list of predefined items to select.

• Slarivo Scroll Area

  A scrollable container with custom, styled scrollbars built on Base UI.

• Slarivo Icon Accordion

  An accordion component with icons, titles, and descriptions for each section. Ideal for organizing content, features, or settings into collapsible panels, making information easy to browse and interact with.

• Slarivo Glassmorphism Listen App

  Music streaming block with glassmorphism player, curated highlights, and animated controls

• Slarivo Accordion

  A collapsible panel that can be expanded or collapsed.

• Slarivo Text roll navigation

  Here is Text roll navigation

• Slarivo Todo / Task Management

  A very minimal, yet functional, animated todo component that will catch user's attention.

• Slarivo Joined Pagination

• Slarivo Stock Category List

  StockCategoryList A responsive and accessible accordion component to display categorized lists of items. Each category features a title and an icon, and clicking it reveals a detailed list. It's themed for both light and dark modes using shadcn/ui variables.

• Slarivo Stock Portfolio Card

  Stock Portfolio Card This component provides a comprehensive view of a user's stock portfolio, including total gain, individual holdings, and related news. It's designed to be highly reusable, accepting all data through props.

• Slarivo Scroll Area

  Here is Scroll Area component

• Slarivo Select

  Here is Select component

• Slarivo Select

  Here is Select component

• Slarivo Community Hub Card

  Community Hub Card This card provides a centralized view of a community's key information, including member stats, an invite system, book progress, and an upcoming reading list.

• Slarivo Accordion 01

  Accordion with animation hover

• Slarivo Select

  Display a dropdown list of items. A recreation of Vercel's Geist design system.

• Slarivo Tree

  A customizable tree component for React.

• Slarivo Shadcn Accordion

  Accordions are one of those components you don’t think much about until your page gets too long. When used well, they make content easier to scan, reduce visual noise, and help users focus on what they actually care about.

• Slarivo Animated To-Do List

  This React component implements an interactive to-do list with smooth animations for adding and removing items. It leverages Framer Motion for its animation capabilities, creating a visually engaging user experience. The component manages a list of to-do items, each with a description, completion status, and estimated time. Users can check off tasks, delete them, and add new ones through a form. Adding a new task smoothly animates the form's appearance, while removing a task triggers a custom exit animation that fades the item and moves it offscreen, providing visual feedback to the user. The application uses functional components, hooks like useState and useEffect for state management and side effects, and the AnimatePresence component from Framer Motion to manage the appearance and disappearance of list items. Each to-do item is a motion component, allowing for individual animations. The form uses controlled components to manage input values and prevent unexpected behavior. This component is ideal for applications requiring a user-friendly and visually appealing to-do list interface. Example scenarios include personal task management, project planning, or simple to-do list applications. The use of Framer Motion enhances user engagement by providing smooth, visually appealing transitions between states.

• Slarivo Connect Wallet Modal

  Connect Wallet Modal A responsive and theme-adaptive modal dialog that allows users to select from a list of crypto wallets. The component is highly reusable, accepting a list of wallets as a prop. It features subtle hover animations and an entrance animation for the wallet list, creating a polished user experience.

• Slarivo Scroll Swap Text

  Text that swaps in and out vertically as its scrollable container is navigated, with the current line sliding up while a clone rises into place.

• Slarivo Animated List

  A sophisticated animation component that creates dynamic column-based transitions with scaling effects. Perfect for showcasing notifications, messages, or any sequential content with smooth formation, scrolling, and reset animations.

• Slarivo Notifications

  The Notifications component is a reusable, interactive UI element built using ShadCN UI, TypeScript, and Tailwind CSS, designed to display real-time notifications in a web application. It features a bell icon trigger with an optional unread badge, and a dropdown menu that appears centered below the icon, ensuring a consistent and visually appealing alignment.

• Slarivo List

  Activity List The ActivityList component is designed to display a feed of recent transactions or activities. It features a clean, card-based layout with animated list items that gracefully fade in. The component is fully responsive and uses shadcn theme variables for seamless integration into light and dark modes.

• Slarivo Menu

  This is Basic menu

• Slarivo Default

  Here is according default component

• Slarivo Accordion

  Here is Accordion component

• Slarivo Interactive List

  Interactive List An interactive list component designed for search interfaces or recent activity logs. It supports animated removal of list items and filter tags, is fully responsive, and adapts to shadcn themes out-of-the-box.

• Slarivo Next-Gen Pagination: Accessible

  Stop shipping clunky pagination. This drop-in React + shadcn/ui pagination component gives you enterprise-grade accessibility, responsive design, and dark mode support out of the box. Fully customizable, lightweight, and built for production at scale — because your users deserve better navigation.” ⚡ Why this works: Title is punchy, modern, and developer-friendly (“Next-Gen”, “Shadcn-ready” trigger interest). Description highlights pain points (clunky pagination) and the solution (accessible, responsive, production-ready). Uses action words: “Stop”, “drop-in”, “built for production” → this makes developers feel it’s urgent and useful.

• Slarivo News Search

  Here is News Search component

• Slarivo Playful Todolist

  A playful todolist component with animated wavy strikethroughs for each completed task.

• Slarivo Product Card

  Product Card This reusable card component displays product information, including an image, title, ratings, specifications, and pricing details in a responsive layout.

• Slarivo Variable Font Hover By Letter

  A text component that animates the font variation settings of letters. Works only with variable fonts. This component is designed to work exclusively with variable fonts. Variable fonts are a modern font technology that allows a single font file to contain multiple variations of a typeface — these variations can be adjusted along different axes, such as weight, width, or slant, etc.

• Slarivo Checkbox Group

  A checkbox group with proximity hover, animated checkmarks, contiguous selection merging, and spring transitions. Built on Radix UI with Framer Motion.

• Slarivo Tree View

  Here is Tree View component

• Slarivo checkbox 02

  A reusable component for a checkbox

• Slarivo Animated Collection

  A collection of items with smooth layout transitions and animations.

• Slarivo Command

  Fast, composable, unstyled command menu for React.

• Slarivo Accordion Space

  Here is Accordion component

• Slarivo Scroller

  Display an overflowing list of items.

• Slarivo Transaction List

  Here is modern minimalistic Transaction List component

• Slarivo Checkbox Group

  Here is Checkbox Group component

• Slarivo Country Accordion

  A collapsible international money transfer UI that groups countries by region. Each row expands to reveal additional destinations with a fluid height animation powered by Framer Motion

• Slarivo Message Design Card List

  Here is Message Design Card List component

• Slarivo Accordion

  Here is Accordion component

• Slarivo Inbox Calendar

  The Inbox-Style Calendar is a modern, list-based scheduling component that organizes events in a format similar to an email inbox. Instead of the traditional grid or wheel layout, events are displayed chronologically under their respective dates, making it perfect for users who manage event-heavy schedules. With the integration of the shadcn UI calendar, users can easily pick dates and add events directly into the timeline, while existing events can be expanded for details or removed with a single action. Its minimal design, smooth animations, and card-based entries ensure clarity and usability, offering an efficient way to manage and visualize busy schedules without overwhelming the user. This component is ideal for productivity apps, dashboards, and any platform that prioritizes quick event management and readability.

• Slarivo NotificationsAlt

  This Notifications component is designed to provide users with a richer, more informative experience. Unlike a standard notification list, it allows embedding interactive elements such as links and info icons within individual notifications. The info icons are paired with tooltips (powered by shadcn UI) that appear on hover, offering additional context without cluttering the message itself. The component uses a popover aligned to the center of the bell icon, ensuring a clean, intuitive placement.

• Slarivo Sidebar Dashboard Skeleton

  Loading placeholder that mirrors a sidebar dashboard layout with a nav rail, header actions, stat cards, and list rows.

• Slarivo Sidebar 1

  A searchable component navigation sidebar with grouped, scrollable sections and item counts.

• Slarivo Collapsible

  here is collapsible demo by indev ui

• Slarivo Dynamic Action

  Here is dynamic action bar component

• Slarivo Bookmark Toggle List

  A list of article rows where each row has a bookmark toggle button, with a live count of how many items are saved.

• Slarivo Radio Group List

  Radio Groups component from the 21st.dev community.

• Slarivo Infinite List

  A bias-based infinite scroll wrapper and hook that manages pagination and masks child items for progressive "load more" lists.

• Slarivo Listbox

  Here is Listbox component

• Slarivo Listbox

  Here is Listbox component

• Slarivo Email Inbox Skeleton

  A loading placeholder skeleton for an email inbox list with avatars, subject lines, and unread indicators.

• Slarivo Scroll Area

  A scrollable container that lets users scroll through a long list of items, such as a user or contacts list, within a fixed height.

• Slarivo Email Categories

  Email categories component for building email client app.

• Slarivo Accordion

  Here is Accordion component

• Slarivo Dropdown Menu

  Here is Dropdown Menu component

• Slarivo Scroll Fade Effect

  Fade content edges as you scroll, for both vertical and horizontal layouts.

• Slarivo BeUI Shared Layout Background

  Buttons component from the 21st.dev community.

• Slarivo BeUI Bouncy Accordion

  Accordions component from the 21st.dev community.

• Slarivo Reshaped Autocomplete

  Renders a TextField and a list of suggested values using Autocomplete.Item compound components. The list is shown when the user focuses the field and hidden once they select a value. Supports filtering, custom item composition with slots, multiline start slot and FormControl integration.

• Slarivo Reshaped Menu item

  Building block for menus and navigation that renders its main area from children and works with both href and onClick. Supports critical and neutral colors, selected and disabled states, three sizes, startSlot/endSlot composition, built-in icon support and a MenuItem.Aligner utility for aligning with surrounding text.

• Slarivo Customer Experience

  An interactive experience section that reveals a floating preview image following the cursor as you hover over each list row.

• Slarivo The Item one

  Here is The Item components

• Slarivo File System (Finder)

  A macOS Finder-style file browser for flat object-store manifests (S3 / R2). Derives a folder hierarchy from object keys and switches between icon, list, column and gallery views, with Finder-style keyboard navigation. Thumbnails, URLs and signing stay external.

• Slarivo Service Changelog

  A scroll-spy services section. A sticky tab strip at the top tracks the active entry while the reader scrolls through long-form panels with deliverables, optional preview media, and inline CTAs.

• Slarivo Scroll Area File Explorer

  A scrollable file explorer list with type icons, size badges, sticky column headers, and a custom scroll area.

• Slarivo Table of Contents

  An auto-scrolling table of contents that highlights the active section using an intersection observer as the reader scrolls.

• Slarivo Notification Scroll Area

  A scrollable container that displays a long list of notifications grouped by date with sticky date headers.

• Slarivo 8-bit Scroll Area

  Pixel-art scroll area from 8bitcn.com — overflow container with retro chunky scrollbar styling.

• Slarivo Inline Loading Status

  Inline loading text paired with a spinner to show multiple status states like checking, connected and reconnecting.

• Slarivo Infinite Circular Scroll

  A vertical list of cards that loops seamlessly as you scroll, with the scrollbar hidden for a continuous circular feel.

• Slarivo Tool Group

  Collapsible header summarizing nested tool calls (files / searches / commands). State-driven (completed / pending streaming / interrupted) with shimmer label and elapsed time. Self-contained port from 21st.dev Agent Elements.

• Slarivo Points Awards

  Stats & KPIs component from the 21st.dev community.

• Slarivo BeUI Bottom Sheet

  Buttons component from the 21st.dev community.

• Slarivo Action dropdown

  A click-driven action picker whose multi-level submenu opens beside the row, jumps straight to the selected item, and drills in place with an animated breadcrumb at a fixed width.

• Slarivo Scroll Fade List

  A scrollable list with gradient fade edges that appear to signal there is more content above or below. The top and bottom fades grow and shrink based on scroll position (measured on scroll and via a ResizeObserver, batched with requestAnimationFrame), leaving a stable scrollbar gutter. It is fully generic over the item type via getKey/items/renderItem, with a configurable max fade height and a themeable background color. Dependency-free.

• Slarivo Snippet

  Display a snippet of copyable code for the command line.

• Slarivo Password Field

  This PasswordField component is a next-level, reusable password input built for modern applications. Unlike a basic show/hide field, it combines several useful features into one clean UI: a password visibility toggle, a dynamic strength meter, a requirements checklist, a one-click strong password generator, and a copy-to-clipboard option with instant feedback. These additions help users create secure passwords.

• Slarivo Code Editor

  Live code editor with multiple language support and built in JavaScript evaluation

• Slarivo 8-bit Demo Shell

  Fake terminal demo shell that renders a sequence of command, output, and comment lines with a blinking cursor, in the 8-bit retro style.

• Slarivo Todo Tool

  Render task list with status icons (pending / in_progress / completed) and an optional shimmer 'Updating to-dos...' streaming state. Self-contained port from 21st.dev Agent Elements with inline SVG icons + shimmer keyframes.

• Slarivo Bash Tool

  Render a command tool card. State-driven (idle / running) with optional output and an approval footer (Skip / Run). Self-contained port from 21st.dev Agent Elements with inline shimmer + dot keyframes.

• Slarivo Great UI Deployment Checklist

  An interactive CI/CD pipeline protocol checklist depicting git clone, install, build, and deploy stages with custom animated status icons.

• Slarivo ReUI Item

  ReUI Item with the first 10 official ReUI examples, preserved from the MIT-licensed source registry.

• Slarivo AI Task List

  Agent plan checklist with nested subtasks and pending, running, done and failed states, each transitioning in place. Respects prefers-reduced-motion.

• Slarivo AI Sources

  Collapsible source list for a grounded answer, with per-source snippets that expand in place rather than opening a dialog. Respects prefers-reduced-motion.

• Slarivo Great UI Terminal Loader

  A retro, terminal-inspired monospace loading indicator that animates character blocks and trailing density particles in real-time.

• Slarivo Data Stream

  An animated terminal-style log feed that reveals timestamped entries one by one with type-colored status dots for streaming data or activity monitors.

• Slarivo Command

  Fast, composable, unstyled command menu for React.

• Slarivo Command

  Fast, composable, unstyled command menu for React.

• Slarivo Snippet

  Display a snippet of copyable code for the command line.

• Slarivo Snippet

  Display a snippet of copyable code for the command line.

• Slarivo Snippet

  Display a snippet of copyable code for the command line.

• Slarivo Snippet

  Display a snippet of copyable code for the command line.

• Slarivo Snippet

  Display a snippet of copyable code for the command line.

• Slarivo Snippet

  Display a snippet of copyable code for the command line.

• Slarivo Sortable

  A drag-and-drop sortable component designed for seamless item organization across customizable columns.

• Slarivo Agent To-do List

  An animated Cursor-style to-do checklist that an AI agent maintains, with a collapsible header showing overall progress and done, in-progress, and pending item states.

• Slarivo Item

  A Item component for revealing contextual actions, options, and navigation, featuring dropdown, menu item, menu-item, avatar.

• Slarivo Item

  A Item component for displaying ordered records, tasks, activity, and repeated content, featuring list, avatar, separator, user profile.

• Slarivo Item

  A Item component for displaying ordered records, tasks, activity, and repeated content, featuring list, avatar, invite teammate, invite-teammate.

• Slarivo Card Studio

  A Card Studio component for grouping related information, actions, and media into reusable surfaces, featuring card, note, avatar, list.

• Slarivo Editable Components

  A Editable Components component for displaying ordered records, tasks, activity, and repeated content, featuring todo, editable, task, checklist.

• Slarivo Login Card

  A Login Card component for displaying ordered records, tasks, activity, and repeated content, featuring task, checklist, card, badge.

• Slarivo Login Card

  A Login Card component for displaying ordered records, tasks, activity, and repeated content, featuring todo, task, checklist, card.

• Slarivo Skeleton

  Spinner Loaders component from the 21st.dev community.

• Slarivo Combobox

  An input combined with a list of predefined items to select.

• Slarivo Code Snippet

  A Code Snippet component for headlines, typography, readable content, and animated copy, featuring code snippet, code-snippet, code block, code-block.

• Slarivo The Dialog

  A The Dialog component for representing people, teams, and account identity, featuring invite teammate, invite-teammate, invite member, invite-member.

• Slarivo ListBox

  A ListBox component for displaying ordered records, tasks, activity, and repeated content, featuring listbox, list, selection, multiselect.

• Slarivo ListBox

  A ListBox component for displaying ordered records, tasks, activity, and repeated content, featuring listbox, list, selection, react aria.

• Slarivo ListBox

  A ListBox component for displaying ordered records, tasks, activity, and repeated content, featuring listbox, list, drag and drop, drag-and-drop.

• Slarivo Spiral Loader

  Two-phase Lottie spiral loader for streaming agents. Self-contained port from 21st.dev Agent Elements.

• Slarivo The Item one

  A The Item one component for grouping related information, actions, and media into reusable surfaces, featuring card, travel, image card, image-card.

• Slarivo The Item one

  A The Item one component for grouping related information, actions, and media into reusable surfaces, featuring card, shadcn/ui, outline, container.

• Slarivo The Item one

  A The Item one component for grouping related information, actions, and media into reusable surfaces, featuring card, outline, shadcn/ui, layout.

• Slarivo The Item one

  A The Item one component for switching settings, modes, preferences, and binary states, featuring toggle, list, clean, shadcn/ui.

• Slarivo Floating Panel

  A Floating Panel component for arranging mixed content in responsive modular layouts, featuring floating, panel, note, search.

• Slarivo Collapsible

  A Collapsible component for displaying ordered records, tasks, activity, and repeated content, featuring collapsible, profile card, profile-card, user avatar.

• Slarivo Collapsible

  A Collapsible component for displaying ordered records, tasks, activity, and repeated content, featuring collapsible, list, avatar, task.

• Slarivo Reshaped Autocomplete

  Renders a TextField and a list of suggested values using Autocomplete.Item compound components. The list is shown when the user focuses the field and hidden once they select a value. Supports filtering, custom item composition with slots, multiline start…

• Slarivo ReUI Item

  ReUI Item with the first 10 official ReUI examples, preserved from the MIT-licensed source registry.

• Slarivo ReUI Item

  ReUI Item with the first 10 official ReUI examples, preserved from the MIT-licensed source registry.

• Slarivo ReUI Item

  ReUI Item with the first 10 official ReUI examples, preserved from the MIT-licensed source registry.

• Slarivo ReUI Item

  ReUI Item with the first 10 official ReUI examples, preserved from the MIT-licensed source registry.

• Slarivo ReUI Item

  ReUI Item with the first 10 official ReUI examples, preserved from the MIT-licensed source registry.

• Slarivo ReUI Item

  ReUI Item with the first 10 official ReUI examples, preserved from the MIT-licensed source registry.

• Slarivo ReUI Item

  ReUI Item with the first 10 official ReUI examples, preserved from the MIT-licensed source registry.

• Slarivo ReUI Item

  ReUI Item with the first 10 official ReUI examples, preserved from the MIT-licensed source registry.

• Slarivo ReUI Item

  ReUI Item with the first 10 official ReUI examples, preserved from the MIT-licensed source registry.

• Slarivo Todo Tool

  Render task list with status icons (pending / in_progress / completed) and an optional shimmer 'Updating to-dos...' streaming state. Self-contained port from 21st.dev Agent Elements with inline SVG icons + shimmer keyframes.

• Slarivo Collapsible

  A minimal show/hide primitive built on Base UI's Collapsible. A trigger toggles a height-animated panel — perfect for read-more text, FAQ rows, nested groups and expandable log output. Controlled or uncontrolled via open / defaultOpen, with data-panel-open…

• Slarivo Hover Terminal

  An interactive, animated button that transforms into a CLI snippet for quick copying.

• Slarivo Switch

  A Switch component for switching settings, modes, preferences, and binary states, featuring toggle, list, form control, form-control.

• Slarivo Bash Tool

  Render a command tool card. State-driven (idle / running) with optional output and an approval footer (Skip / Run). Self-contained port from 21st.dev Agent Elements with inline shimmer + dot keyframes.

• Slarivo Bash Tool

  Render a command tool card. State-driven (idle / running) with optional output and an approval footer (Skip / Run). Self-contained port from 21st.dev Agent Elements with inline shimmer + dot keyframes.

• Slarivo Switch

  An accessible toggle switch built on Base UI's Switch primitive. Animated thumb with a springy press/scale interaction, two sizes (default and sm), controlled or uncontrolled usage via checked / defaultChecked, disabled state, and easy accent recoloring…

• Slarivo Reshaped Divider

  Separates content horizontally or vertically with the vertical flag. Integrates with the View utility's divided property, supports a neutral color to match form field borders, text or custom content next to the divider lines with configurable position, and…

• Slarivo AI Agent Response

  Interactive Claude & Cursor-style AI execution trace with nested reasoning, bash terminal outputs, and live Git diff inspect. (124 chars).

• Slarivo Pricing Plan Card

  A pricing plan card with a feature checklist, a highlighted ring, a "Most Popular" badge, and a call-to-action button.

• Slarivo GitHub Repository Cards

  A vertical list of GitHub repository cards showing name, description, visibility badge, language, star and fork counts.

• Slarivo Upstash Leaderboard

  A ranked leaderboard display for Redis sorted sets with positions, scores, avatars, and gold/silver/bronze styling for the top three.

• Slarivo Key Value List

  A definition-list component that displays label/value pairs with optional descriptions for metadata and payload details.

• Slarivo Checkbox List Group

  A bordered list of options each pairing a labeled row with icon and a checkbox, useful for selecting multiple preferences or skills.

• Slarivo Checkbox Group

  A multi-select option list where each row toggles with a spring-animated tick, supporting descriptions, grouping, disabled options and a collapsible show-more list.

• Slarivo List

  Renders ordered and to-do list items with checkboxes inside a Plate rich-text editor.

• Slarivo TOC Base Kit

  A Plate editor plugin kit that registers a static table-of-contents element for server-side rendering of document headings.

• Slarivo AI Response Writer

  An auto-scrolling text display that smoothly keeps the latest streamed AI response always visible as new text arrives.

• Slarivo Onboarding Step Tracker

  An onboarding step tracker built on an accordion, showing each setup step with a completion state and a mark-as-complete action.

• Slarivo CI/CD Build Log Viewer

  A collapsible list of CI/CD build steps with status badges and expandable, color-coded log output.

• Slarivo Package Dependency List

  A vertical list of package groups with version badges and collapsible rows that expand to reveal the individual dependencies inside each group.

• Slarivo Sprint Task Checklist

  A task checklist with checkboxes, priority badges, line-through completed items, a remaining counter, a completion celebration state, and a reset button.

• Slarivo Streaming Chat Response

  A focused AI response component with character-by-character streaming, a live cursor, stop generation, and regenerate states.

• Slarivo Hover Expand Gallery

  A row of hairline-separated panels with vertical labels. Hover or tap one and it absorbs the free space to reveal its image while the rest stay rail-width; below 1024px the same list becomes a vertical accordion. Pure CSS flex-grow transition - no…

• Slarivo Tier List Maker

  A polished drag-and-drop tier list builder. Rank avatars into S/A/B/C/D rows, rename and reorder tiers, add or remove rows, and drag anyone back to the bench. Custom pointer-based drag and drop, macOS-style dock magnification on the bench tray, ghost-slot…

• Slarivo Animated List

  A semantic list component whose items fade and slide in with a stagger, animate out cleanly on removal, and reorder smoothly via layout animation — for building live feeds, task lists, or activity logs.

• Slarivo Comment Thread

  A threaded comment/review discussion component with replies, @mentions, emoji reactions, edit, resolve/reopen, delete, and optimistic sending that shows pending, sent, or failed with retry.

• Slarivo Item Image

  A list of items with a thumbnail image, title, subtitle and trailing metadata, useful for music tracks, files or search results.

• Slarivo Onboarding Checklist Drawer

  A right-side drawer panel showing onboarding progress with a progress bar and an interactive, checkable task checklist.

• Slarivo Pricing Card

  A pricing card that highlights a plan with a Popular badge, monthly price, and a feature checklist with a call-to-action button.

• Slarivo Glow Text Reveal

  A Glow Text Reveal component for headlines, typography, readable content, and animated copy, featuring text, glow, terminal, typewriter.

• Slarivo Issue Label Picker

  A multi-select checkbox list for picking issue labels, each with a colored dot and a live count of selected items.

• Slarivo What Saa SChat Inbox

  Reusable WhatsApp-style inbox component with chat list, conversation pane and CRM side panel.

• Slarivo Status

  A pill-shaped status badge with a pulsing indicator dot and color variants for signaling online, error, warning, info, and idle states.

• Slarivo Orbs Ring

  Compact animated ring activity indicators for showing agent status without blocking the thread.

• Slarivo Cinematic List

  Expandable destination list where each row reveals a full-width cinematic background image and travel metadata on hover.