Skip to content

How to make VS Code Transparent

How to make VS Code transparent

In this step-by-step guide, we’ll be exploring a couple of ways to make VS Code transparent on Windows.

You may want to opt for a transparent VS Code primarily for the aesthetics.

Sometimes transparent windows can be visually pleasing but can also facilitate multitasking to a certain degree by allowing you to keep an eye on other apps or resources while coding.

Ultimately, it all boils down to personal preference.

Let’s get to it!

🎥 As we’re talking about visual stuff, I strongly suggest you check out this video for a showcase of this functionality:

GlassIt

First up, we have the GlassIt extension.

It’s worth noting that this extension isn’t limited to Windows; it also plays nice with Linux, provide you’re running the Xorg display server and have the xprop package installed.

Make VS Code Transparent with GlassIt extension

 


To tweak the transparency you can press CTRL + ALT + Z to increase the transparency and CTRL + ALT + C to decrease it.

You can also adjust the transparency increment level in the settings.json file, meaning how much you increase or decrease the transparency per keystroke.

  • glassit.alpha (integer): Transparency level [1-255]
  • glassit.step (integer): Increment of alpha

 

Windows opacity

The other extension is called Windows opacity.

Make VS Code Transparent with Windows opacity extension

This extension, however doesn’t have shortcuts to tweak the transparency level.

You can however manually tweak the winopacity.opacity setting in the settings.json file.

winopacity.opacity (integer): [0-255]

 

Caveat

Unfortunately, both extensions have a caveat.

VS Code transparency extensions have a caveat

A higher level of transparency causes even the text and the important elements of the editor to become transparent as well.

There are a few open issues on GitHub regarding this topic, and I would be happy if the authors could fix the problem.

It would be astonishing to be able to code as if you were writing on a piece of glass.


Let me know what you think about this article in the comments section below.

If you find this article helpful, please share it with others and subscribe to the blog to support me, and receive a bi-monthly-ish e-mail notification on my latest articles.   
  

Comments