React File Tree Components

Dev Design Library indexes 21 React file tree components from 18 open-source UI libraries, with the most coming from beUI, FLX UI, uselayouts, Halaska UI and Magic UI. Each one links to its page with the source code, a live preview where available, the library license and the install command. Every library in this list targets React. File tree components belong to the Data display group.

• Sidebar 11shadcn/ui · ReactA sidebar with a collapsible file tree.
• Tree ViewChakra UI · ReactUsed to display hierarchical data structures in an expandable tree format
• File TreeMagic UI · ReactA component used to showcase the folder and file structure of a directory.
• Tree ViewArk UI · ReactA component that is used to show a tree hierarchy.
• File TreeAI Elements · ReactDisplay hierarchical file and folder structure with expand/collapse functionality.
• Mdx File TreeLobe UI · React
• Card FolderbeUI · ReactA landscape card tucked into a stitched purse pocket that lifts forward as the purse compresses into its bottom seam…
• Folder PreviewVengeance UI · ReactFolder stack visual preview
• Scroll Area 01 - Custom File ExplorerShadcn Space · ReactA scrollable file explorer list with custom icons, badges, and smooth scroll area performance.
• Folder Interactionuselayouts · ReactA folder management system with drag-and-drop-like feel.
• Tree ViewShark UI · ReactHierarchical data in a tree structure.
• FilesWatermelon UI · React
• Tree viewArc Library · ReactNavigate nested folders and structured content.
• TreeHextaUI · ReactNested, expandable rows for files and hierarchies, with indent guides, connector lines, cascading checkboxes…
• File treeFLX UI · ReactNested folders built from collapsible rows, with folder icons that swap on open.
• File TreeVelora UI · ReactCollapsible tree for documenting project structure.
• File TreeHalaska UI · React
• Tree Viewark-cn · ReactA shadcn-style tree view component built with Ark UI primitives.
• File TreebeUI · ReactComposable file and folder primitives with springing branches, a gliding selection, and complete keyboard navigation.
• File listFLX UI · ReactFile icon, name, size metadata, and a trailing overflow menu with actions per row.
• Project FolderbeUI · ReactAn interactive project folder that opens its file fan on hover or focus, expands into a focus-managed overlay, then…

Libraries with React file tree components

• beUI
• FLX UI
• uselayouts
• Halaska UI
• Magic UI

Related categories

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