Learn how to customize the theme to fit your needs, preview changes and package the extension.
This is a living document which means it is work in progress, not completed yet and can change at any time while the project is still in development major version zero
This page documents how to develop the theme extension — from requirements to VSIX packaging and the development workflow steps.
Uninstall all currently installed versions of the Nord extension!
Otherwise the installed and versioned extension will collide with the development extension that'll be configured in this guide.
Clone the Nord Visual Studio Code repository from GitHub to your local extension directory where name of Nord's extension directory must follow VS Code's extension naming scheme of
This results in the following directory name for the Nord extension:
arcticicestudio.nord-visual-studio-code-0.0.0. Note that you can specify any version number you like, but using
0.0.0 indicates that this is a special version for development purposes.
git clone https://github.com/arcticicestudio/nord-visual-studio-code.git arcticicestudio.nord-visual-studio-code-0.0.0
To get the project without Git download the project as
.zip archive file from the GitHub repository or click on the download button below. Afterwards extract the archive to your local extension directory following the directory naming scheme like described above.
Both methods will use the
develop branch to work with the latest development state.
Open the extension by adding the cloned/extracted repository directory to your workspace or opening the directory directly and set Nord as active color theme like documented in the installation & activation guide.
To simplify the development without requiring to restart VS Code every time to preview changes
- add the modified workbench UI or syntax theme key to your user settings
- save the file to apply the changes immediately
- add the changes to Nord's JSON theme file afterwards
This way allows to develop and preview the theme without being slowed down by the missing hot reload functionality.
Visual Studio Code extensions are packaged using the custom and installable VSIX format.
To package, publish and manage extensions, VS Code uses the official CLI tool
- Follow the official documentations to learn how to install and use the
vsce packagein your terminal from within Nord Visual Studio Code's repository to build the
Please read the theme documentation about how to install and activate the generated VSIX file locally.
Follow the Installation & Activation Guide for more details how to enable the theme.