We are currently planning to migrate to a different platform for the forum. We will announce this fact both here and on Twitter, once we have settled on a solution.

[Custom CSS] - Ayu light

Hi all,

I've had a crack at making custom css for Zettlr based on the Ayu Sublime theme (https://github.com/dempfi/ayu). I used the colour palette made by dempfi here (https://github.com/ayu-theme/ayu-colors). I like light themes, but am probably in the minority out there hah.

I didn't have any experience with CSS prior to making this - I've just been tinkering with it and learning as I go/from looking at other customisations on this forum, so it's probably pretty rough - apologies in advance...

I have the ui and editor font set to 'Cantarell' in this CSS, but on my system I use Apple's San Francisco font, which is the one in the Ayu screenshots on the github page, for the UI elements. You can download it here: https://github.com/AppleDesignResources/SanFranciscoFont.

I leaned on karlb's Bear theme (https://forum.zettlr.com/discussion/169/bear-theme#latest) to help me get my structure ok and isolate some of the things I wanted to change. I also stole the idea for colour-blocking the tags, links and ids from plavasova's frankfurt dark mode theme (https://forum.zettlr.com/discussion/40/custom-theme-based-on-frankfurt-dark-mode-theme#latest). Thanks to both of them for creating such great themes.


  • For my very own personal taste a little colouring of the file list and tree view would be great, but I really do like the way you implemented the tags with this badge-effect! :)

  • Thanks a lot! This now became my personal favorite.

    Just one peculiar thing: Ctrl + Shift + + won't zoom in as it did previously. Is there a definition in CSS for this?

Sign In or Register to comment.