vscode-theme-css-variables

VSCode Theme CSS Variables is a VSCode extension that provides CSS variables snippets for VSCode themes.

⏬ Install

VSCode Extensions Select VSCode Theme CSS Variables

📖 Use

📦 Add

Add base css variables. themeing.ts#L68

• vscode-font-family
• vscode-font-weight
• vscode-font-size
• vscode-editor-font-family
• vscode-editor-font-weight
• vscode-editor-font-size

Add escape style css variables.

/* variable */
/* diffEditor.move.border */
/* testing.message.error.decorationForeground */

/* base */
--vscode-diffEditor-move-border
--vscode-testing-message-error-decorationForeground

/* escape style */
--vscode-diffEditor-move\.border
--vscode-testing-message\.error\.decorationForeground

⚙ Options

• vscodeThemeCSSVariables.activationLanguages: Activation languages
  • default: [ "css", "less", "scss", "sass", "stylus", "html", "svelte" ]

Default Activation Language

• css
• less
• scss
• sass
• stylus
• html
• svelte

🎉 Thanks

connor4312/vscode-css-theme-completions