I’m a huge fan of Workflowy and continue using it heavily in my day to day life, but one thing I’ve always wanted to do is to fully customize its theme.

I’m on their pro plan which gives me a few options for customizing the theme and font, but if you want a customize it beyond what they offer, you’re mostly out of luck.

I’ve been using their Wood theme with Sans-Serif font for quite a while, but finally tired of it and decided to look into ways to customize it.

Enter Stylebot.

Stylebot is a Chrome extension that lets you specify custom CSS for any webpage and will automatically apply that CSS whenever you load the page in the future.

To customize Workflowy’s background, I first used the Chrome Inspector to figure out which element was responsible for the background image, then used Stylebot to overwrite it. I also had to remove the brownish border shadow to get it to look right. Here’s the complete CSS I entered in Stylebot:

#backgroundImage {
 background-image: url(http://mattshared.s3.amazonaws.com/scenery/21.jpg);
}

.page {
 box-shadow: none;
 border: 1px solid #555;
}

And voilà, a new background:

You could use this technique to customize Workflowy even more if you’d like, or just use it to customize the background like I did. Enjoy!