https://github.com/mahirhamiabrar/vscode-blur-linux

A Visual Studio Code extension to make the vscode window blur and control It's tranparency.
https://github.com/mahirhamiabrar/vscode-blur-linux

blur visual-studio-code visual-studio-code-extension visual-studio-extension visualstudio vscode vscode-extension vscode-plugin vscode-theme

Last synced: about 1 month ago
JSON representation

A Visual Studio Code extension to make the vscode window blur and control It's tranparency.

• Host: GitHub
• URL: https://github.com/mahirhamiabrar/vscode-blur-linux
• Owner: MahirHamiAbrar
• License: gpl-3.0
• Created: 2022-07-21T14:50:44.000Z (over 2 years ago)
• Default Branch: main
• Last Pushed: 2023-09-28T08:38:26.000Z (about 1 year ago)
• Last Synced: 2024-05-05T05:29:58.040Z (8 months ago)
• Topics: blur, visual-studio-code, visual-studio-code-extension, visual-studio-extension, visualstudio, vscode, vscode-extension, vscode-plugin, vscode-theme
• Language: JavaScript
• Homepage: https://marketplace.visualstudio.com/items?itemName=mhabrar.vscode-blur-linux
• Size: 15.8 MB
• Stars: 9
• Watchers: 1
• Forks: 0
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# vscode-blur-linux README

vscode-blur-linux helps to achieve transparent and blurry background to vscode window on linux.

## Features

This extension provides transparency and blurring features. Transparency effect is expected to be

working on all linux distros but the blur effect will only work on KDE Plasma distros for now. We

will be adding the support for blurring on GNOME distros verry soon.

   ### Make vscode window transparent

   ![Make vscode window transparent](images/VSCode-Transparent-SS.png)

   ### Add blur effect to the vscode window (works on KDE Plasma Distros only)

   ![Add blur effect to the vscode window (works on KDE Plasma Distros only)](images/VSCode-Blur-SS.png)

   ### Activate or deactivate Blur and change Opacity in Settings

   ![Activate or deactivate Blur and change Opacity in Settings](images/VSCode-Settings-SS.png)

## Requirements

`vscode-blur-linux` requires `wmctrl` (to get the window ID), `xprop` (to set transparency), and `bash` (to run the transparency commands) installed on your system.

### Install Dependencies on Ubuntu/Debian:

``` bash

sudo apt install -y wmctrl x11-utils bash

```

### Install Dependencies on Arch Linux:

#### pacman:

``` bash

sudo pacman -S wmctrl bash

```

#### yay:

```bash

yay -S pacman bash

```

Also make sure that `blur` is turned on in the settings.

Go to `System Steeings` > `Workspace Behaviour` > `Desktop Effects` > under appearance check the check box `Blur`.

You might need to change the blur strength by clicking the gear icon at the very right side beside `Blur`. and then click `Apply`.

Done!

## Extension Settings

This extension contributes the following settings:

* `vscode-blur-linux.opacity`: opacity can be changed between 0-100 range, default is `88%`.

* `vscode-blur-linux.blur`: enable/disable blur effect behind the window.

## Usage

* First install the dependencies.

* Then install the extension from marketplace.

* Finally restart the Visual Studio Code window.

You are done! Enjoy the new look of your Visual Studio Code!