List Components

Dev Design Library indexes 240 list components from 62 open-source UI libraries, with the most coming from ReUI, Tremor Blocks, FLX UI, Watermelon UI and Spectrum UI. Each one links to its page with the source code, a live preview where available, the library license and the install command. List components belong to the Data display group.

Showing 120 of 240, a mix from every library. Open a library to see all of its components.

• Itemshadcn/ui · ReactA versatile component for displaying content with media, title, description, and actions.
• Image ListMUI / Material UI · React
• Animated ListReact Bits · ReactList items enter with staggered motion variants for polished reveals.
• ListdaisyUI · CSS (Tailwind)
• ListChakra UI · ReactUsed to display a list of items
• List BoxHeroUI · ReactA listbox displays a list of options and allows a user to select one or more of them
• Animated ListMagic UI · ReactA list that animates each item in sequence with a delay. Used to showcase notifications or events on your landing page.
• List ViewReact Spectrum · ReactA ListView displays a list of interactive items, and allows a user to navigate, select, or perform an action.
• Data ListRadix Themes · React
• Prompt LibraryCult UI · ReactBrowse, insert, and manage prompt templates with categories and custom prompts
• ListboxArk UI · ReactA component for selecting a single or multiple items from a list.
• Delete With Smoky Dissolvetransitions.dev · HTML/CSSList item that dissolves into smoke when deleted.
• Bar ListTremor · React
• Attachment listReUI · ReactAttachments with their type, size and a download action.
• Listpdfcn · ReactList PDF component (forme)
• Environment VariablesAI Elements · ReactDisplay environment variables with masking and copy functionality.
• ListLobe UI · ReactRenders selectable list items with titles, descriptions, avatars, actions, pin and loading states, and active-key…
• Scroll TextKokonut UI · ReactScroll-driven text list that highlights the active word as you scroll, using IntersectionObserver with React, Tailwind…
• grid-listIntent UI · Reactgrid-list
• Sortable ListbeUI · ReactStable item ids keep focus and content attached to their row during sorting.
• ListTailGrids · ReactA list component with multiple variants.
• Task ListRare UI · ReactA checklist that strikes out completed tasks and moves them to the bottom of the list.
• Conversation ListSpectrum UI · ReactA date-grouped conversation sidebar with pinning.
• Image Reveal ListVengeance UI · ReactHover-based image reveal tooltip list
• Collection Actions ControlToolcraft · React
• LeaderboardPanel UI · React NativeEntries ranked by a value, with the top three on a podium.
• Animated List 01 - DefaultShadcn Space · ReactAnimated List component
• Minimal Agenda WidgetOpenSourceUI · React
• Animated Collectionuselayouts · ReactA collection of items with smooth layout transitions and animations.
• Activity LedgerKinetics · HTML/CSSFresh events arrive sharply while older entries compact
• Notification CenterBoardUI · ReactGrouped activity inbox with tabs and actions.
• Grid List 01Tremor Blocks · React
• L
  List AnimationShadcn Dashboard · React
• Animated ListAnimations (Svelte) · SvelteA component that animates list items with smooth layout transitions, revealing items one by one from top to bottom.
• QueueAI Elements (Svelte) · SvelteA structured queue view with sections, items, attachments, and action controls.
• Paged ListSwiftPieces · SwiftUIAn infinite-scroll list that prefetches and drops duplicate and stale pages, with a glass footer for loading, retry…
• Animated ListBadtz UI · ReactA sophisticated animation component that creates dynamic column-based transitions with scaling effects. Perfect for…
• ItemObsidianUI · React
• ChatGPT SearchNotra · ReactThe "Searched N websites" line, built on shadcn Button.
• Music Playeraudiocn · ReactA playlist player with a waveform seek bar, shuffle, repeat, volume and optional ducking under the microphone.
• ItemShark UI · ReactA versatile component for displaying content.
• Swipe Action RowSona UI · ReactA coordinated list-row interaction with two-sided actions, keyboard opening, outside dismissal, and action-owned full…
• Career 1Watermelon UI · React
• Notification centerArc Library · ReactA home for updates with read state, grouped information, and animated disclosure.
• Glass Itemglasscn · ReactGlass Item with five variants: clear, frosted, subtle, liquid, and liquid-refract
• Activity TimelineUI Lab · ReactNew events slide in at the top as the line grows to meet them.
• ItemHextaUI · ReactA row of media, text and actions for lists, settings and pickers, with a grouped surface and a hover highlight that…
• Voice Notes BlockLocalMode · ReactRecord (push-to-talk from a selectable mic) or upload audio → Whisper/Moonshine transcription → saved notes with…
• Activity feedCojeev UI · ReactAn ordered, date-grouped history in three looks (a living thread, a quiet ledger or gathered bursts), with readable…
• Activity FeedFLX UI · ReactActivity Feed for Comment Thread.
• Animated ListVelora UI · ReactLooping feed that springs each item in, newest on top.
• Context Sources PatternHalaska UI · React
• Session ListPin UI · React
• ItemSpaceUI · ReactComposable Item primitive with media, content, title, and description slots for lists and rows.
• Aria ItemReScript shadcn · ReScript
• List BoxOUI · ReactReact aria components List Box with shadcn characteristics.
• Liquid ListLiquefy UI · ReactList in liquid glass style. Lista em estilo vidro líquido.
• Notification BentoD2Studio UI · ReactA four-panel notification bento: a pure-CSS metallic bell on a lit dot-matrix field, recent activity feed, unread…
• Todo ListEaseUI · ReactA collapsible agent task plan with morphing status marks and a completion count.
• Message ListFibo · ReactA conversation that groups each person's messages under one heading, with a single tab stop.
• Kanban BoardReactFrame · ReactA drag-and-drop task board with a hand-rolled pointer-based drag engine, velocity tilt, edge autoscroll, ghost…
• Itemark-cn · ReactComposable list item with media, content, title, description, and action slots.
• ListMUI / Material UI · React
• Swipe RowReact Bits · ReactList row that swipes open to reveal actions, snaps by flick velocity, and deletes on a full swipe that stretches the…
• ListboxChakra UI · ReactUsed to display a list of options for selection.
• Tailwind Grid ListReact Spectrum · React
• Sortable ListCult UI · ReactDrag-and-drop sortable list component with smooth animations and reordering
• CollectionArk UI · React
• Drag Drop With Physicstransitions.dev · HTML/CSS
• Basic item with title and descriptionReUI · ReactBasic item with title and description
• Listpdfcn · ReactList PDF component (takumi)
• QueueAI Elements · ReactA comprehensive queue component system for displaying message lists, todos, and collapsible task sections in AI…
• Sortable ListLobe UI · ReactSortableList is a component for creating drag-and-drop sortable lists. It allows users to reorder list items through…
• leaderboardIntent UI · Reactleaderboard
• Swipeable ListbeUI · ReactMobile-style list rows that swipe left or right to reveal contextual action buttons.
• Infinite Scroll DependenciesSpectrum UI · Reactcomponent for the Infinite Scroll Dependencies
• ItemVengeance UI · React
• File Drop Collection ControlToolcraft · React
• SortablePanel UI · React NativeA list whose rows can be dragged into a different order.
• Calendar 08 - With Event ListShadcn Space · ReactCalendar component
• Music Playlist CardOpenSourceUI · React
• Filter Interactionuselayouts · ReactInteractive list items with hover and focus effects.
• Reorderable ListKinetics · HTML/CSSDrag items up and down; others shift to make room
• Grid List 02Tremor Blocks · React
• Claude SearchNotra · ReactClaude's web search timeline with queries, result cards and status steps.
• Track Listaudiocn · ReactA list of tracks with active and playing states, arrow-key navigation and slots for artwork, duration and actions.
• ListboxShark UI · ReactSelect a single or multiple items from a list.
• Career 2Watermelon UI · React
• Reorderable listArc Library · ReactOrganize items with direct drag and drop.
• Itemglasscn · React
• Filter ListUI Lab · ReactRows fade out of the way while the rest slide up to close the gap.
• Semantic Search BlockLocalMode · ReactFull text/PDF/OCR ingest into its OWN corpus with off/recursive/semantic chunking and a live chunk-boundary preview…
• ItemCojeev UI · ReactA notebook ledger, an illustrated collection or an actionable detail. Three readable arrangements for the things you…
• BasicFLX UI · ReactTitle plus supporting description.
• Digest PatternHalaska UI · React
• KanbanSpaceUI · ReactDisplays tasks across draggable columns, allowing users to organize projects, track progress stages, and reorder cards…
• Base ItemReScript shadcn · ReScript
• Listboxark-cn · ReactA shadcn-style listbox component built with Ark UI primitives.
• List SubheaderMUI / Material UI · React
• Tailwind List BoxReact Spectrum · React
• Item with header and footer sectionsReUI · ReactItem with header and footer sections
• TaskAI Elements · ReactA collapsible task list component for displaying AI workflow progress, with status indicators and optional descriptions.
• Chat Chat ListLobe UI · React
• list-boxIntent UI · Reactlist-box
• Todo ListbeUI · ReactShows which planned work is paused by the decision.
• Kanban BoardSpectrum UI · Reactcomponent for the Kanban Board
• Checkbox-04 - Checkbox with todo listShadcn Space · ReactCheckbox component
• Resource Links PanelOpenSourceUI · React
• Liquid Indexuselayouts · ReactA feature list whose hover badge is a WebGL liquid gradient that tracks the row.
• Stagger EntranceKinetics · HTML/CSSList items rise in sequence on scroll into view
• Grid List 03Tremor Blocks · React
• Perplexity SearchNotra · ReactThe globe search step with queries, source rows and a +N more expander, built on shadcn Collapsible.
• Career 3Watermelon UI · React
• Swipe actionsArc Library · ReactReveal row actions with a swipe, or from the same actions in a menu.
• Kanban BoardUI Lab · ReactLift a card and the others slide aside to make room for it.
• Encrypted Vault BlockLocalMode · ReactA passphrase-locked, end-to-end encrypted item store driven by useEncryptedVault — AES-GCM ciphertext at rest in…
• Item adornmentCojeev UI · ReactColoured organic shapes for list items, with deterministic automatic selection and custom icon or no-icon options.
• VariantsFLX UI · ReactDefault, outline, and muted variants side-by-side.
• List ItemHalaska UI · React
• Liquid Sortable ListSpaceUI · ReactSmooth drag-and-drop sortable team list with generative avatars and spring reordering.

Libraries with list components

• ReUI
• Tremor Blocks
• FLX UI
• Watermelon UI
• Spectrum UI

Related categories

• React List Components
• Tailwind CSS List Components
• Animated List Components
• shadcn/ui List Components
• Data Display Components
• Card Components
• Chart Components
• Table Components
• Avatar Components
• Stat Components
• Calendar Components
• Accordion Components
• Data Table Components
• Carousel Components
• Collapsible Components
• Avatar Group Components
• Stat Card Components
• Bar Chart Components
• Tree View Components
• Card Stack Components