This post documents the visual tweaks I use in VS Code, including vibrancy, animations, and a custom startup watermark. The steps are short but make the editor feel more alive.

1. Enable vibrancy

Install Vibrancy Continued, then:

  • Press Cmd + Shift + P to open the Command Palette
  • Run Enable Vibrancy

2. Add animations

Install VSCode Animations and Custom CSS and JS Loader, then:

  • Press Cmd + Shift + P
  • Run Enable Animations

3. Customize the startup watermark

I use this icon. Download it, convert it to Base64 with this converter, and create a user.css file with:

.editor-group-watermark .letterpress {
  background-image: url("paste-base64-here") !important;
  opacity: .75;
  aspect-ratio: 3 / 2 !important;
}

Then add this to settings.json:

"vscode_custom_css.imports": [
  "file:///absolute/path/to/your/user.css"
]

4. Enable custom CSS

Open the Command Palette and run Enable Custom CSS and JS to apply the watermark.