LogoPolyImg Docs
LogoPolyImg Docs
Homepage

Introduction

Quick StartWhat is FumadocsComparisons

Setup

Manual InstallationStatic Export

Writing

MarkdownInternationalization

UI

OverviewThemesSearch
Components
Accordion
Banner
Code Block (Dynamic)
Files
GitHub Info
Zoomable Image
Inline TOC
Root Toggle
Steps
Tabs
Type Table
MDX
X (Twitter)
Components

Files

Display file structure in your documentation

Usage

Wrap file components in Files.

import { File, Folder, Files } from 'fumadocs-ui/components/files';

<Files>
  <Folder name="app" defaultOpen>
    <File name="layout.tsx" />
    <File name="page.tsx" />
    <File name="global.css" />
  </Folder>
  <Folder name="components">
    <File name="button.tsx" />
    <File name="tabs.tsx" />
    <File name="dialog.tsx" />
  </Folder>
  <File name="package.json" />
</Files>

File

Folder

Code Block (Dynamic)

A codeblock that also highlights code

GitHub Info

Display your GitHub repository information

Table of Contents

Usage
File
Folder
page.tsx
layout.tsx
page.tsx
global.css
package.json