Windi CSSWindi CSS Intellisense for VS Code
Windi CSS IntelliSense enhances the Windi development experience by providing Visual Studio Code users with advanced features such as autocomplete, syntax highlighting, code folding, and building.
Installation
Install via the Visual Studio Code Marketplace →
Install via the Open VSX Registry →
This plugin packs a windicss compiler, so you can use it without installing windicss, and it also supports the configuration file (tailwind|windi).config.(js|cjs|ts).
Features
Autocomplete
Intelligent suggestions for utilities and variants.
Hover Preview
See the complete CSS for a class name by hovering over it.
Syntax Highlighting
Highlight utilities, variants and importants.
Color Preview
Preview color and spectrum.
Code Folding
Fold overly long classes to increase readability.
Compile Commands
Built-in commands, one-key operation.
Extension Settings
| Settings | type | default | description |
|---|---|---|---|
windicss.enableColorDecorators | boolean | true | Enable Color Decorators. |
windicss.enableHoverPreview | boolean | true | Enable hover className to show preview of CSS. |
windicss.enableCodeCompletion | boolean | true | Enable/Disable all code completions. |
windicss.enableUtilityCompletion | boolean | true | Enable Utility Completion. |
windicss.enableVariantCompletion | boolean | true | Enable Variant Completion. |
windicss.enableDynamicCompletion | boolean | true | Enable Dynamic Utilities Completion like p-${int}. |
windicss.enableRemToPxPreview | boolean | true | Enable Rem to Px Preview. |
windicss.enableCodeFolding | boolean | true | Enable ClassNames Code Folding. |
windicss.foldByLength | boolean | false | Folding code by length. Default option is false, will fold by utility count. |
windicss.foldCount | number | 3 | Used by foldByCount. |
windicss.foldLength | number | 25 | Used by foldByLength |
windicss.hiddenText | string | ... | Placeholder used when folding code. |
windicss.hiddenTextColor | string | #AED0A4 | Placeholder Color. |
windicss.sortOnSave | boolean | false | Runs class sorting on file save. |