Ledger
Search, sort, and browse a folder with bundled file icons.
Optional Svelte theme · search and sortingPut a directory
on the web.
Dirwell turns folders into browsable websites for downloads, reports, and build artifacts. Serve current files from a Node application, or build static files for your host.
$ npx @dirwell/cli server ./downloads
Dirwell server: http://127.0.0.1:4173/browse/Ledger · optional Svelte themeOpen full explorer
Run the Ledger interface shown above with your own files:
npm install --save-dev @dirwell/cli @dirwell/theme-ledger
npx dirwell server ./downloads --theme ledger --liveBrowse your folder. Then publish it.
Requires Node.js 22.12 or later. Use the published CLI; Plain is included and no config file is needed.
Serve current files
npx @dirwell/cli server ./downloadsBuild static output
npx @dirwell/cli build ./downloads --out ./site-downloadsBrowse locally. Open a current folder with the included Plain theme. Start a local server
Publish downloads. Build a dedicated static tree and upload it to your host. Publish a static explorer
Use Dirwell in an app. Choose Core generation, a build adapter or a live Node handler. Choose the integration
The folder already has the information.
Start with file names, sizes and timestamps. Add public descriptions or checksums when names need more explanation. Serve the current directory or publish a static snapshot.
- Start
- Browse a folder without a config file.
- Inspect
- File sizes, timestamps and symlink targets.
- Ship
- Serve generated HTML from a static host.
- Adapt
- Customize a theme or supply your own renderer.
Choose an example to try.
Try an explorer in your browser, or run a server integration locally. Each example includes its source and instructions.
Official themes
Plain comes with the CLI. Install Ledger or Crosswave for search, sorting and keyboard navigation.
Plain
Minimal directory HTML with native links, system fonts, and no generated assets.
Included with the CLI · minimal HTMLCrosswave
A PSP-inspired crossbar with flowing light and keyboard or controller navigation.
Optional Vue theme · crossbar navigationCustomization and deployment
Change colors, languages, file categories, share images or deployment URLs.
Choose directory URLs
Compare explicit filenames, directory indexes and extensionless routing.
Core routing · output placement and hosting requirementsDeploy under a URL prefix
Share assets across pages and mount the explorer under a known URL prefix.
Ledger · deployment URLsCustomize Ledger source
Keep the explorer behavior while changing colors, icons, and its header.
Ledger · Svelte snippets and custom iconsBuild an independent theme
Replace the full document with your own HTML and CSS.
Independent renderer · complete HTMLAdd theme-owned languages
Switch English, Traditional Chinese, and Japanese in an independent theme.
Custom theme · language switchingCustomize Crosswave categories
Rename and reorder categories, choose icons, and define file-type filters.
Crosswave · category rules and iconsGenerate per-folder share images
Generate an image for each folder in a small Design kit.
Crosswave · build-time image callbacksServer integrations
Run Dirwell inside a Node application and connect it to your services.
Cache a public listing
Run two Hono servers that share listing data through Redis.
Node.js and Redis · run locallyCustomize when your project needs it.
Start with Plain. Later, install a rich theme, choose a deployment path, or connect it to an existing build.
import { createLedgerTheme } from "@dirwell/theme-ledger";
export default { theme: createLedgerTheme({ title: "Downloads" }) };export default {
build: { base: "/dirwell/", urlStrategy: "base", mode: "mpa" },
};export default {
build: {
outputName(directory) {
return directory.entries.some((entry) => entry.name === "index.html")
? null : "index.html";
},
},
};A directory can be the product.
Keep it static. Make it navigable. Change only what your project needs.
Get started