簡単にディレクトリ構造（ツリー）にできるリストスタイルが欲しいです。

具体的には以下のようなデザイン。

子要素を作るだけで自動的にディレクトリアイコンをつけられるようにコード例を書いてみました。

※現在has()はFirefoxは未対応、対応ブラウザ86.93%

ul li::before {
  content: "■ ";
  color: blue;
}


li:has(ul)::before {
  content: "■ ";
  color: red;
}

ul ul li::after {
  content: "■ ";
  position:absolute;
  top: 0;
  left:-1em;
  color: green;
}

すでに出来ているなら自作しろと言われればそれまでですが…カスタマイズに関する記事も多くなってきたのであれば便利かなと。

ご検討よろしくお願いいたします。