Back to Plugins
Theme Importer for Visual Studio Code

Theme Importer for Visual Studio Code

Import Visual Studio Code themes as Figma Variables to design efficiently.

themevisual studio codeswatchesfigma-to-codevariablesvscodekaleidocodejson to variablescolorstyles

Plugin Preview

Theme Importer for Visual Studio Code preview

About this plugin

How to useSelect the built-in Visual Studio Code themes you would like to import as Figma variables and press the `Import` button. Theme tokens can be previewed in the left hand pane in either list or grid views.How to add a custom Visual Studio Code theme to the pluginOpen Visual Studio Code.Install the desired color theme and switch to the theme in Visual Studio Code.Press Ctrl+Shift+P and run Developer: Generate Color Theme from current settings.Select the file's contents and copy.Open the Figma plugin and press the Create a new theme button.Paste into the Create a new theme dialog and press Save.Note: This plugin supports up to 10 custom themes.

Plugin Details

Version15
CreatedJuly 25, 2019
Last UpdatedMarch 20, 2025
CategoryImport & export plugins
CreatorKyle Anderson
Stats4002 installs, 110 likes
PricingFree

Technical Details

  • API:1.0.0
  • UI:dist/src/ui/ui.html
  • main:dist/src/code/code.js
  • Document Access:dynamic-page
  • Editor Types:
    figma
  • Allowed Domains:
    • none