Skip to content
| Marketplace
Sign in
Visual Studio Code>Themes>Toggle VSCode ColoursNew to Visual Studio Code? Get it now.
Toggle VSCode Colours

Toggle VSCode Colours

Woolersuk

| (0) | Free
Set window colours to distinguish multiple windows. Keywords: window colours peacock colourise
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

VSCode Window Colour

Toggle VSCode Colours is a VS Code extension designed to make your Visual Studio Code window more personal and visually distinct.

  • This is a fork of https://github.com/lennardv2/vscode-window-color with thanks
  • I have simplified this and "Britified" it too with the spelling of colour, not color. (pedantic but to me, annoying)

Features

  • Customisable Colours:
    Personalise the colours of the activity bar, title bar, status bar, and other UI elements. Adjust contrast and transparency for better readability.

  • User-friendly Configuration Panel:
    Use the settings panel to customise colours.

  • Live Updates:
    All changes are applied instantly without needing to reload your editor.

  • Toggleable Options:
    Decide which parts of the UI to colourise:

    • Activity Bar
    • Title Bar
    • Status Bar
    • Active Items (buttons, tabs, etc.)

Adds a small button on the status bar that you can click to change the window colour if you're not happy with the one it's created

Window Colour Settings

Settings

This extension adds the following settings to your window:

  • windowColour.mainColour: The primary colour for UI customisations.
  • windowColour.isActivityBarColoured: Enable/disable colouring of the activity bar.
  • windowColour.isTitleBarColoured: Enable/disable colouring of the title bar.
  • windowColour.isStatusBarColoured: Enable/disable colouring of the status bar.
  • windowColour.isActiveItemsColoured: Enable/disable colouring of active UI elements.

How to Use

  1. Open Settings.
  2. Search for Toggle VSCode Colours.
  3. Customise your window colour and toggles.

Development

Prerequisites

  • Node.js (v16 or higher)
  • npm

Setup

  1. Clone the repository:

    git clone https://github.com/woolersuk/vscode-window-colors-name.git
    cd toggle-vscode-colour
    
  2. Install dependencies:

    npm install
    

Compile

To compile the TypeScript code:

npm run compile

Test

To run the test suite:

npm test

This will:

  • Compile the TypeScript code
  • Run ESLint for code quality checks
  • Execute the test suite

Watch Mode

To compile in watch mode (automatically recompile on file changes):

npm run watch

Package

To create a VSIX installer package:

npm run package

The .vsix file will be created in the project root and can be installed in VS Code via:

  • Extensions > Install from VSIX...
  • Or via command line: code --install-extension toggle-vscode-colour-1.0.7.vsix

Keywords: window, colours, peacock, colourise, theme, personalisation, customisation, activity bar, title bar, status bar, window name, UI, settings, dynamic, live updates, toggleable, contrast, transparency, readability, integrated, user-friendly, interactive, settings panel, active items, buttons, tabs, primary colour, colour settings, themes, override, personal, visually distinct, organisation, recognition, multiple windows.

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2026 Microsoft