Tree View File Explorer CSS

A file and folder tree that expands and collapses, styled to look like an editor sidebar.

Each folder is a details element with a summary as its label, so open and closed states are handled by the browser itself. That means no JavaScript, and keyboard users get the toggle behavior without extra work.

Nesting is plain unordered lists with left padding per level, so adding depth is just more nesting. The connecting lines are borders on the list items rather than background images, so they scale with the font size.