Built-in themes#

Themes can be loaded with the --theme option. Multiple themes can be combined. Built-in themes can be loaded using their name, custom theme files can be loaded using their path.

Available themes (full color scheme):

Available extensions (alternative visual settings)

Creating a custom theme#

Creating a custom theme is as simple as writing a tiny css file that will override the default css variables defined in default.scss :

:root {
    --color-accent:red;
}

This will change the default accent color to red. Variables can also be overridden for a specific subset of elements, for example :

.panel-container {
    --color-text:blue;
}

This will change the default text color to blue for all elements in panel widgets.

Scss / autoreload#

When running the app from sources, custom themes can be written in scss:

The theme will be watched and compiled automatically to a css file located in app/browser/themes/ (css files in this directory can be selected from the theme option by their name, without .css suffix). If the app is running on default http port, clients will reload the theme automatically.