robb0wen / synthwave-vscode

Synthwave inspired colour theme for VS Code 🌅🕶
MIT License
5.19k stars 1.19k forks source link

Customizing the colors #141

Open Lloople opened 4 years ago

Lloople commented 4 years ago

First of all, thank you for this amazing extension, it's the reason I switched to Visual Studio Code a few months ago! ❤️

Since the last update, the strings now looks odd to me, too much orange. I would like to be able to override the default colors, maybe using the settings.json file.

Anyway, amazing work here and great extension, thank you very much for this

speirsluke commented 4 years ago

I have a similar issue. In the settings.json I have the following:

{"workbench.colorCustomizations": {
        "[SynthWave '84]": {
            "editor.background": "#000"
        }
    }
}

which makes the expected background colour change, but loses the glow. If I then run the Enable Neon Dreams command, the glow is enabled but the background returns to purple: Screenshot 2020-02-18 at 14 48 56

David-Everlasting-Media commented 4 years ago

VERY curious about how to resolve this. I would LOVE to take the splendor of this theme and mold it into a fully fledged DOOM Eternal theme.

deme3 commented 4 years ago

If you're still wondering, I wanted to change the variables pink color, I investigated and finally found something in the theme_template.js file, you can find it in the synthwave folder inside the VS Code extensions folder (in my macOS system it's located in ~/.vscode/extensions/, probably the same in all unix systems, google it and you'll find out).\ This will keep the glow, IF you don't delete the text-shadow property, clearly.

The full path structure should be something like /Users/[your username]/.vscode/extensions/robbowen.synthwave-vscode-0.1.3/src/js/theme_template.js

Schermata 2020-04-24 alle 14 58 37

From there you can change the main theme colours and the glow settings, once you do, open the Command Palette and use the "Synthwave '84: Enable Neon Dreams" command, when prompted, click "Restart editor to refresh settings". It'll reload the JS files and update the color scheme.

Beware that most of the times you do not want to change the glow, except if you make major changes to the colour palette. I recommend that you backup the file before making any edits.