/vscode-tailwind-suggestions-for-csser

Visual Studio Code Tailwind CSS Suggest Extension for CSSer

Primary LanguageJavaScriptMIT LicenseMIT

TailwindCSS Suggestion for CSSer

All Contributors

You don't have to remeber all the Tailwind Utility Class Names. Just use this!

result-min

Features

  • Suggesting TailwindCSS ClassName from vanilla CSS

Active Conditions of Suggestion

  • inside class attributes
  • after @apply

Extension Settings

  • tailwindCSSForCSSer.suggestions.classAttributes: Enable autocomplete suggestions in class attributes.

  • tailwindCSSForCSSer.suggestions.atApply: Enable autocomplete suggestions after @apply.

  • tailwindCSSForCSSer.additionalLanguages.classAttributes: Enable features in languages that are not supported by default in class attributes.

  • tailwindCSSForCSSer.disableLanguages.classAttributes: Disable features in languages that are supported by default in class attributes. (e.g. html typescriptreact etc..)

  • tailwindCSSForCSSer.additionalLanguages.atApply: Enable features in languages that are not supported by default after @apply.

  • tailwindCSSForCSSer.disableLanguages.atApply: Disable features in languages that are supported by default after @apply. (e.g. html typescriptreact etc..)

{
  // default settings below
  "tailwindCSSForCSSer.suggestions.classAttributes": true,
  "tailwindCSSForCSSer.suggestions.atApply": true,
  "tailwindCSSForCSSer.additionalLanguages.classAttributes": [],
  "tailwindCSSForCSSer.disableLanguages.classAttributes": [],
  "tailwindCSSForCSSer.additionalLanguages.atApply": [],
  "tailwindCSSForCSSer.disableLanguages.atApply": []
}

Known Issues

Not all TailwindCSS class names are supported (complicated shadow css ..etc)

TODO

  • suggestion in class attribute
  • suggestion after @apply
  • limit active condition more precisely
  • support arbitrary value
  • support colors

Contributors

Iguchi Tomokatsu
Iguchi Tomokatsu

💻
Gyo Tamura
Gyo Tamura

💻
ym-darake
ym-darake

💻