Node-RED Contrib Theme Collection

A collection of themes for Node-RED.

📸 See the screenshots

Installation
- Install with npm
Theme list
Usage
- Themed Scrollbars [DEPRECATED]
- Monaco Editor Theme
Development
License

Installation

Install with npm

Run the following command from within the Node-RED user data directory (by default, $HOME/.node-red).

npm install @node-red-contrib-themes/theme-collection

NOTE: The command above installs the latest version of the theme collection, which is compatible with Node-RED 3.0 and later. For Node-RED version 2.2.X, run npm install @node-red-contrib-themes/theme-collection@v2.2.

Theme list

📸 See the screenshots

Name	Description
`aurora`	Inspired by the Aurora Theme for Sublime Text
`cobalt2`	Based on the Cobalt2 Theme for VS Code
`dark`	A dark theme for Node-RED based on VS Code's Dark Modern theme
`dracula`	Based on the Dracula theme
`espresso-libre`	Inspired by the Espresso Libre theme for Monaco Editor
`github-dark`	Based on the GitHub Dark (legacy) theme from GitHub's VS Code themes
`github-dark-default`	Based on the GitHub Dark Default theme from GitHub's VS Code themes
`github-dark-dimmed`	Based on the GitHub Dark Dimmed theme from GitHub's VS Code themes
`midnight-red`	Based on the Midnight theme for Home Assistant
`monoindustrial`	Based on the monoindustrial theme for Monaco Editor
`monokai`	Based on the Monokai theme for VS Code
`monokai-dimmed`	Based on the Monokai Dimmed theme for VS Code
`noctis`	Inspired by the Noctis theme for VS Code
`oceanic-next`	Based on the Oceanic Next Color Scheme
`oled`	A Node-RED dark theme for OLED displays
`one-dark-pro`	Based on the Default theme from One Dark Pro
`one-dark-pro-darker`	Based on the Darker theme from One Dark Pro
`solarized-dark`	Based on the Solarized color palette
`solarized-light`	Based on the Solarized color palette
`tokyo-night`	Based on the Tokyo Night theme from Tokyo Night theme
`tokyo-night-light`	Based on the Tokyo Night Light theme from Tokyo Night theme
`tokyo-night-storm`	Based on the Tokyo Night Storm theme from Tokyo Night theme
`totallyinformation`	Created per request of Julian Knight (@TotallyInformation)
`zenburn`	Inspired by the Zenburn color scheme for Vim

If you have an idea for a new theme, you can request it here, or better yet, create one yourself.

Usage

Set theme: "<theme-name>" in the editorTheme object in your settings.js and then restart Node-RED.

For example, this sets Node-RED to use the dark theme.

editorTheme: {
    theme: "dark"
},

NOTE: For details on the Node-RED's configuration file and its structure, please refer to the Node-RED official documentation.

Themed Scrollbars [DEPRECATED]

NOTE: This feature is now deprecated and will be removed in the next major release.

Includes the theme and changes the scrollbars to make them better fit the theme.

Add -scroll to the name of the theme you chose.

For example, this sets Node-RED to use the midnight-red theme with themed scrollbars.

editorTheme: {
    theme: "midnight-red-scroll"
},

Monaco Editor Theme

Each theme in this collection comes with a pre-configured theme for the Monaco editor.

Just leave theme in the codeEditor object commented out.

For example, this sets Node-RED to use the dracula theme and its pre-configured theme for the Monaco editor.

editorTheme: {
    theme: "dracula",
    codeEditor: {
        lib: "monaco",
        options: {
            // theme: "",
        },
    },
},

Development

Please refer to the DEVELOPMENT.md file for details on how to set up a local development environment.

License

This project is licensed under the MIT license.

@node-red-contrib-themes/theme-collection

Package Exports

Readme