File Tree Components

Dev Design Library indexes 22 file tree components from 19 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. 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.
• File TreeAnimations (Svelte) · SvelteAn interactive file tree component with expandable folders, selectable files, and smooth animations.
• 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 file tree components

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

Related categories

• React File Tree Components
• Tailwind CSS File Tree Components
• Animated File Tree Components
• shadcn/ui File Tree Components
• Data Display Components
• Card Components
• Chart Components
• Table Components
• Avatar Components
• List 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