Skip to main content
This guide will help you get Vibrancy Continued up and running quickly. If you need detailed platform-specific instructions, see the Windows or macOS platform guides.

Prerequisites

  • Visual Studio Code 1.63.0 or newer
  • Windows 10/11 or macOS
  • Administrator/sudo access for initial setup

Installation

1

Install from Marketplace

Install Vibrancy Continued from the Visual Studio Code Marketplace.Or install directly in VS Code:
  1. Press Ctrl+Shift+X (Windows/Linux) or Cmd+Shift+X (macOS)
  2. Search for “Vibrancy Continued”
  3. Click Install
2

Enable Vibrancy

Activate the extension:
  1. Press F1 to open Command Palette
  2. Type “Reload Vibrancy”
  3. Select Reload Vibrancy
  4. Restart VS Code when prompted
You’ll see a warning that your installation appears corrupt. This is expected—click the cogwheel and select Don’t Show Again.
3

Windows Users: Fix Window Resizing

Windows users must complete this step to enable window resizing.
  1. Update your VS Code shortcut with --disable-gpu-compositing:
    "C:\Users\YourName\AppData\Local\Programs\Microsoft VS Code\Code.exe" --disable-gpu-compositing
    
  2. In VS Code settings, enable Disable frameless window (vscode_vibrancy.disableFramelessWindow)
  3. Press F1 and run Reload Vibrancy
See Windows Setup Guide for details.
4

Choose a Theme

Customize your appearance:
  1. Open Settings (Ctrl+, or Cmd+,)
  2. Search for “vibrancy theme”
  3. Select from 14 themes like:
    • Default Dark
    • Tokyo Night Storm
    • Catppuccin Mocha
    • GitHub Dark Default
Changes apply after running Reload Vibrancy again.
5

Customize (Optional)

Fine-tune your experience:Adjust Opacity:
{
  "vscode_vibrancy.opacity": 0.5
}
Range: -1 (theme default) to 1 (no transparency)Change Vibrancy Type (macOS):
{
  "vscode_vibrancy.type": "fullscreen-ui"
}
Options: auto, under-window, fullscreen-ui, and moreChange Vibrancy Type (Windows):
{
  "vscode_vibrancy.type": "acrylic"
}
See Configuration for all options.

Example Configurations

The simplest setup using default theme:
{
  "vscode_vibrancy.theme": "Default Dark",
  "vscode_vibrancy.opacity": -1
}

Fix Terminal Transparency

If your integrated terminal looks wrong, disable GPU acceleration:
  1. Open Settings (Ctrl+, or Cmd+,)
  2. Search for “gpu acceleration”
  3. Set Terminal › Integrated: Gpu Acceleration to off
Or add to your settings.json:
{
  "terminal.integrated.gpuAcceleration": "off"
}

Common Issues

This is a known issue. Simply run Reload Vibrancy a second time and restart VS Code.
You need to add --disable-gpu-compositing to your VS Code shortcut and enable the Disable frameless window setting. See Windows Setup Guide.
Run these commands in Terminal:
sudo chown -R $(whoami):staff "/Applications/Visual Studio Code.app/"
sudo chmod -R 755 "/Applications/Visual Studio Code.app/"
See macOS Setup Guide for more solutions.
Check:
  1. System transparency effects are enabled (not “Reduce transparency”)
  2. You’ve restarted VS Code after enabling Vibrancy
  3. Terminal GPU acceleration is off
  4. Your VS Code color theme matches the Vibrancy theme
See Troubleshooting for more help.

After VS Code Updates

Each time VS Code updates, you need to re-enable Vibrancy:
  1. Press F1
  2. Run Reload Vibrancy
  3. Restart VS Code
The extension will prompt you automatically when an update is detected.

Next Steps

Explore Themes

Browse all 14 built-in themes with screenshots

Configuration Reference

Learn about all available settings and customization options

Platform Guides

Detailed setup for Windows and macOS

Custom CSS

Create your own themes with custom CSS/JS

Build docs developers (and LLMs) love