Minimalist colored folders

Hi all,

I’ve been looking for a way to add color to my folders. I tried the snippets created by Lithou and pbhopeful but I wanted something more minimalist.

So I made some changes and created two versions.

The first version “title only” will add a background to the title of top-level folders only. The second version will add a background to top-level folder and all of their contents. Colors and opacity can be modified at the top of the CSS file. The snippets don’t make any change to typography. Only colors and margin/padding of folders. Screenshots below are with the Things theme.

Title only

Title + contents

The CSS snippets are available on Github here.

The “title only” snippet is pretty clean. The second one (title+contents) needs a bit of polishing: for instance, while hovering top-level folders, the background doesn’t overlap perfectly. I won’t spend additional time on it though, as I’m using the “title only” spinnet. Also, I’ve tested those in light mode only (I’m not a fan of dark mode).

Enjoy and feel free to propose some changes!

6 Likes

Thank you for sharing this! I’m a complete noob at all of this and was making slow progress trying to customise pbhopeful’s snippet when I found this - much much better.

I’m using the title+contents snippet on dark mode (Things theme) and am pretty happy with it - I just changed the colours to suit me better. I’m not sure what you meant by the hovering when hovering, but I’m happy with it anyway.

The only thing I would change further is the ability to change the individual colours of the subfolders, something halfway between yours and pbhopeful’s rendition, but I guess I will need to learn more about CSS to attempt it.

Thank you very much. I like it. :+1: