/trilium-theme-melon

A theme for Trilium Notes

Primary LanguageCSS

🍋 melon-4

A theme for Trilium Notes, (>= 0.48.x) "a hierarchical note taking application with focus on building large personal knowledge bases".

I really like this application and its many features. At the same time I felt like it needed some visual overhaul for lack of better terms. I am trying to achieve a consistent look and feel. Sometimes things break (e.g. due to updates of the application) - please don't hesitate to file an issue!

Screenshots

Main Window

scrn4_01

Theme Installation

Please follow the official instructions here.

In a nutshell:

Install the theme by following these steps:

  • copy the (raw) content of trilium-theme-melon-4.css
  • paste it into a new trilium code note (type: CSS) named "melon-theme-4"
  • add a new attribute to the melon-theme-4 note (Alt + A)
    • either copy & paste #appTheme=melon-4 to the node's attributes
    • or use the UI with these settings
      • Type: Label
      • Name: appTheme
      • Value: melon4
      • inheritable: not ticked
  • go to Menu > Options
  • select it as your new theme

Additional Fonts

To get the full experience you need to install some additional fonts.

  • The web font files (.woff) have to be imported into the theme note (right click on theme note, select Import into note)
  • the customResourceProvider attribute needs to be added to every font file you want to use
  • the respective attribute value should be fonts/Font-File-Name.woff

Example Attributes (use to copy&paste)

#originalFileName=FiraCode-Regular.woff #customResourceProvider="fonts/FiraCode-Regular.woff"