Node-RED Contrib Theme Collection

A collection of themes for Node-RED.

Installation

Install via the Palette Manager

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

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

Theme list

📸 Screenshots

Name	Inspiration
`aurora`	Aurora Theme for Sublime Text
`cobalt2`	Cobalt2 Theme for VS Code
`dark`	Default Dark Modern VS Code theme
`dracula`	Dracula theme
`espresso-libre`	Espresso Libre theme for Monaco Editor
`github-dark`	GitHub Dark (legacy) VS Code theme
`github-dark-default`	GitHub Dark Default VS Code theme
`github-dark-dimmed`	GitHub Dark Dimmed VS Code theme
`midnight-red`	Midnight theme for Home Assistant
`monoindustrial`	Monoindustrial theme for Monaco Editor
`monokai`	Monokai theme for VS Code
`monokai-dimmed`	Monokai Dimmed theme for VS Code
`night-owl`	Night Owl theme for VS Code
`noctis`	Noctis theme collection for VS Code
`noctis-azureus`	Noctis theme collection for VS Code
`noctis-bordo`	Noctis theme collection for VS Code
`noctis-minimus`	Noctis theme collection for VS Code
`noctis-obscuro`	Noctis theme collection for VS Code
`noctis-sereno`	Noctis theme collection for VS Code
`noctis-uva`	Noctis theme collection for VS Code
`noctis-viola`	Noctis theme collection for VS Code
`oceanic-next`	Oceanic Next Color Scheme
`oled`	Tomorrow Night Bright for VS Code
`one-dark-pro`	One Dark Pro theme
`one-dark-pro-darker`	One Dark Pro Darker theme
`railscasts-extended`	Railscasts Extended theme for Sublime Text
`selenized-dark`	Selenized for VS Code
`selenized-light`	Selenized for VS Code
`solarized-dark`	Solarized color palette
`solarized-light`	Solarized color palette
`tokyo-night`	Tokyo Night theme
`tokyo-night-light`	Tokyo Night Light theme
`tokyo-night-storm`	Tokyo Night Storm theme
`totallyinformation`	Julian Knight's (@TotallyInformation) creation
`zenburn`	Zenburn color scheme for Vim
`zendesk-garden`	Garden design system by Zendesk

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 midnight-red theme.

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

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

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: "",
        },
    },
},

Mermaid Theme

Each theme in this collection comes with a pre-configured theme for the Mermaid diagramming and charting tool.

Just leave theme in the mermaid object commented out.

For example, this sets Node-RED to use the dark theme and its pre-configured theme for the Mermaid diagramming and charting tool.

editorTheme: {
    theme: "dark",
    mermaid: {
        // 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.