CSS Variables (Archived)

Please vote/rate and star this project to show your support. ❤️

     
  

Archive Notice

Hi everyone! Thanks so much for all the support over the years — I really appreciate it. 🙏 I want to share that I no longer have the time or interest to continue maintaining this project. I started this project to help out my friend and never expected for it to get this much attention. All thanks to @jjenzz for sharing this extension.

I learned a lot working on this, and I’m grateful for the experience. If you’re looking for an actively maintained VS Code extension for CSS custom variables, check out: https://github.com/vunguyentuan/vscode-css-variables

💡 Features:

This extension helps provide autocompletion IntelliSense for globally shared CSS Variables and more.

How the extension works:

• When adding a new CSS declaration property value, press --.
• This opens a completion list dropdown, with all the CSS variables in the list.
• Select and add the variable of your choice, to autocomplete.

Auto Completion, Color swatches, Goto Definition

This extension has in-built support for parsing: css, scss, less, js, jsx, ts, tsx source file extensions and providing CSS variable suggestions from them.

Details can be read in Customization Doc.

Customization

If your project uses sass or styl or some other custom source file extension, and you are facing issues to setup this VSCode extension, please read Customization Doc.

Theme Support

Read more about Theming here

CSS Level 4 color spec support

Limited support to keep bundle size small.
Except for color() api, every other CSS color is supported. Please find details for CSS colors here in MDN Docs

🔖 Appendix:

• Extension setting details
• Extension Customization
• Theming Support
• Debugging the extension