Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>Theming DevToolsNew to Visual Studio Code? Get it now.
Theming DevTools

Theming DevTools

Preview

Elio Struyf

|
474 installs
| (0) | Free
An extension that helps you out with theming in VS Code. It includes a preview of all the CSS variables and their values. If you are a theme or extension developer, this is a great way to check if your theme is working as expected.
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

🎨 Theme DevTools for VSCode

Visual Studio Marketplace Number of installs Ratings Buy me a coffee

An extension that helps you out with theming in VS Code. It includes a preview of all the CSS variables and their values. If you are a theme or extension developer, this is a great way to check if your theme is working as expected.

⬛️ Dark theme example

Dark theme

⬜️ Light theme example

light theme

✨ Features

  • Show all CSS variables and their values
  • On the fly theme changes
  • Filtering of theme properties
  • Allow theme comparison with any other theme you got installed

Important: This is limited to the colors defined in the theme. It means that not all colors are provided, but gives you already a good indication of what the theme colors are, and allows you to compare them with other themes.

🚀 Usage

  1. Install the extension to VS Code
  2. Run the Theming: Open Theme DevTools command

Theme command

🔑 License

MIT



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