Here’s how to install the SynthWave ’84 theme and activate the glow effect (Neon Dreams) in VS Code

Nadin Pethiyagoda
3 min readAug 5, 2022
SynthWave ’84 for VS Code

You might have installed the SynthWave theme and tried activating the glow effect by CRT-SHIFT-P, searching for “Enable Neon Dreams” and hitting enter… but that didn’t work right? you keep getting this annoying notification even though you did open VS Code in administrator mode.

“You must run VS code with admin privileges in order to enable Neon Dreams.”

This tutorial explains how to fix it and note that this is only for windows users.

Installation

Open VS code, go to the Extensions tab, and in the search bar search for SynthWave ’84 and install it.

Once installation is completed VS Code will auto apply the theme, if it doesn't then set the color theme. In the SynthWave ’84 extension click on Set Color Theme button to apply the theme.

Open a project in VS Code to check if the theme is working, once everything is set, to enable the glow there is one more extension that you need to install, Custom CSS and JS Loader. Install this extension for VS Code (refer to the above steps).

Locate synthwave84.css

Now add the custom CSS import from the SynthWave ’84 theme. To locate the synthwave84.css, navigate to Local Disk C -> Users -> username -> .vscode ->extensions ->robbowen.synthwave-vscode-0.1.11. You will find the synthwave84.css file there.

In my case the path would be:

C:\Users\LENOVO\.vscode\extensions\robbowen.synthwave-vscode-0.1.11
synthwave84.css

Edit settings.json

Hit CTRL-SHIFT-P to open the Command Palette in VS Code, search for Open User Settings (JSON)

Command Palette

Inside the settings.json file add the path to the synthwave84.css file inside the curly brackets {} (Change it to your username C:/Users/”username”)

"vscode_custom_css.imports": [   "file:///C:/Users/LENOVO/.vscode/extensions/robbowen.synthwave-      vscode-0.1.11/synthwave84.css"]

Reload Custom CSS and JS

The final step is to Reload Custom CSS and JS. Again hit CTRL-SHIFT-P to open the Command Palette in VS Code, search for Reload Custom CSS and JS, and hit enter.

You will see a notification to Restart VS Code, go ahead and restart VS Code

👏 Done!! you have now installed SynthWave ’84 with Neon Dreams

IMPORTANT

Note that you need to perform Reload Custom CSS and JS everytime you install a VS Code update.

--

--