0

tailwind.config.js file

I have some custom colors defined, VSCode does not show color previews and I have to manually check to remember which one to use, even with color naming. Are there any settings/extensions that allow me to preview the HSL colors defined in the values?

rioV8
  • 24,506
  • 3
  • 32
  • 49
semi_92
  • 105
  • 1
  • 8
  • Does this answer your question? [how to bring the vscode css color picker feature into js file with string that match color name format?](https://stackoverflow.com/questions/50532485/how-to-bring-the-vscode-css-color-picker-feature-into-js-file-with-string-that-m) – starball Jun 10 '23 at 21:54

2 Answers2

0

I found the extension called Color Highlight. https://github.com/enyancc/vscode-ext-color-highlight

semi_92
  • 105
  • 1
  • 8
0

Since vscode v1.78 you can do this (note that is in a js file):

enter image description here

Make sure these two settings are enabled:

Editor: Color Decorators
Editor: Default Color Decorators

That second setting means that non-css type files, like javascript, will also get a color decorator. An extension could specifically provide a ColorDecorator or if not use the default color decorator (i.e., the one that provides a color decorator for css-type files.

Mark
  • 143,421
  • 24
  • 428
  • 436
  • (I might be missing something, in which case I apologize) why didn't you dupe vote to https://stackoverflow.com/a/76067075/11107541 ? – starball Jun 10 '23 at 21:55
  • the `ColorDecorator` is missing on the API Ref doc page – rioV8 Jun 10 '23 at 22:00