effectthemingglow

How can I add a glow effect to editor text in a VS Code theme?


What is the best method for adding a CSS glow effect to tokens in a VS Code theme? I want to do something similar to neon dreams that has been implemented for the theme Synthwave '84. I'm not looking for extensions or anything like that where you adjust your personal settings.json, but rather a way to actually code the effect into the theme that I am working on.

I have looked at the Synthwave source code as well as browsed the web and have not been able to come up with a clear-cut way to do this.


Solution

  • I can more or less defer to what I've already written in my answer to How can I use a linear-gradient in a VS Code theme?.

    [...] not currently supported in VS Code colour customizations / colour themes.

    [...]

    Both work by modifying what are supposed to be more-or-less internal VS Code files, which will cause VS Code to issue a corruption warning (which you can mark to not be shown again through the gear button menu), and those file modifications may need to be re-done upon VS Code updates, so it's not really ideal, but at the moment, it appears to be the only way to get theme gradients.

    For example, to see how the synthwave extension does the VS Code modification, see its src/extension.js file.

    In particular, Synthwave patches the VS Code isntallation's CSS and adds rules that use the text-shadow property. See https://github.com/search?q=repo%3Arobb0wen%2Fsynthwave-vscode+%22text-shadow%22&type=code.