How to make your IDE or Code Editor with transparent background

Are you a web developer, or maybe some programmer that wants a little more nice background for the IDE other than the boring black or white?
Or maybe you want to see your website while viewing the code on the same screen?

If the answer to one of these questions is Yes, this guide is for you!

Video that show you what you will get:


More images from other IDEs

Preparations

Before we begin, we need to make sure that you have:

NVIDIA GPU with CUDA support

מכירת מוצרי מותג NVIDIA מ ₪787 בחנות מקוונת TopMarket ישראל.

In order that this transparency feature will work well, WindowTop makes use of the NVIDIA graphics card with Cuda support. 
All modern NVIDIA graphics cards have Cuda support.

To know if your GPU support Cuda, please refer to:

https://www.geforce.com/hardware/technology/cuda/supported-gpus?field_gpu_type_value=All

WindowTop Pro v3.4.5 or newer

Only from version v3.4.5 the transparency feature should be well developed and can be used in daily usage.
This feature is included only if WindowTop is activated so you will have to buy it or you can start 30 days trial for FREE 

Windows 10 version 2004 or newer

You will have to update Windows 10 to version 2004 or newer in order that this feature will work.

WindowTop is configured correctly

before you start, you need to make sure that the “Aero” feature is enabled:

And that it uses NVIDIA GPU acceleration for this feature:

Both check box must be selected

After you verified that the configurations are correct you can start to use this feature on text/code editor.

Enabling Transparency

1. Open your IDE / Text Editor
2. Move the mouse to the top of the window

3. Click on the “Aero” icon

You will see that the window will now look like this:

Adjusting Transparency

You can adjust a few transparency parameters as needed. 

The most used parameters are

Blur Level

Brightness Level

Background

Dark Background

You may also want to use other parameters such as the text parameter to reduce the brightness of the text.

Configuring Transparency HotKey

You may want to enable/disable this effect using a hotkey. 

To do this follow the steps:

  1. Right-click on WindowTop tray icon
  2. Click on: 
  1. Configure the hotkey for example like in the image

To enable the effect on any window, press the hotkey you configured.
To disable the transparency effect on the window, press the hotkey again.

2 thoughts on “How to make your IDE or Code Editor with transparent background

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.