TL;DR
All these extensions are available in this VSCode extension pack TailwindCSS Kit
1. Tailwind CSS IntelliSense
Tailwi...
For further actions, you may consider blocking this person and/or reporting abuse
Sure, here are some additional Visual Studio Code extensions that can be helpful when developing with Tailwind CSS:
Headwind: This extension automatically sorts and organizes Tailwind CSS classes in your code. It helps to improve code readability and maintainability by grouping classes together and removing duplicates.
Better Comments: This extension highlights different types of comments in your code with distinct colors and formatting. It can be used to visually distinguish Tailwind CSS classes from regular comments or code.
Bracket Pair Colorizer 2: This extension colorizes matching brackets in your code to make it easier to identify code blocks. This can be useful when working with Tailwind CSS classes that use nested brackets.
Turbo Console Log: This extension provides a shortcut for adding console.log statements to your code. It can help you quickly debug Tailwind CSS classes and their values.
These extensions can streamline your development workflow and make it easier to work with Tailwind CSS.
These are useful extensions. I have used headwind previously but I stopped using it because I did not like the way it sorted the classes. I actually created a plugin for ESLint that sort the classes in a way that I think is easier to read. You can find more about it here: dev.to/kalimahapps/increate-tailwi...
Tailwind now have their own sort plugin for prettier, which will sort utility classes according to generation order, so you can tell which utility will override which.
That is true. I used it first but then I changed my mind due to two reasons:
I am not against using the official prettier plugin but I don't feel it fits well with my workflow and coding style.
Food for thought
youtube.com/watch?v=IAwpB6I1c8Y
Thanks. Maybe check my other post in response to this.
dev.to/kalimahapps/goodbye-prettie...
Thank you for sharing your valuable insights on the 4 VSCode extensions you use when developing with Tailwind CSS. As a developer who also utilizes Tailwind CSS in my projects, I found your recommendations very helpful. Your article has saved me a lot of time and effort by providing me with the right tools for my Tailwind CSS workflow. Once again, thank you for sharing your knowledge and expertise with the community.
Glad I could help.
Wow, thanks for this useful tools.
Already install the first one, the others Will be installed soon
Great article, thanks for sharing.
thank you, very usefull
This is so awesome, and gonna save me a lot of time. Thank you so much
Thanks ! Very helpful ;)
Name: Headwind
Id: heybourn.headwind
Description: An opinionated class sorter for Tailwind CSS
Version: 1.7.0
Publisher: Ryan Heybourn
VS Marketplace Link: marketplace.visualstudio.com/items...
Recommend this too
Is anyone know how to use Tailwind Documentation on linux?
If you are referring to the extension, it should not be any different between Windows and Linux. The details of usage are included in the readme section.
This application have to be open with ctrl + alt + T, but it open the shell on linux..
The issue has already been addressed here: github.com/alfredbirk/tailwind-doc...
It seems that it won't change.
Thanks a lot, I did not see the answer before. It works now !
Great Thank you ;-)
I haven't seen these before. Great set of tools! Thanks for sharing.
Definitely needed this ✌️ thank you
Great
Did you try Tailus Snippets?
thank you, very usefull