TailwindSearch is a powerful and intuitive VS Code extension that allows developers to quickly search and explore Tailwind CSS classes directly within their editor. Enhance your workflow by effortlessly finding the exact utility classes you need, complete with detailed documentation links. Ideal for
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Tailwind Search is a Visual Studio Code extension that simplifies the process of searching for Tailwind CSS classes. With a user-friendly sidebar, this extension allows you to quickly find, copy, and view documentation for Tailwind CSS classes without having to remember all the class names.
Features
Search for Tailwind CSS Classes: Enter a search term in the search box to find relevant Tailwind CSS classes.
Class Actions: For each class found, you have two options:
Copy Class: Copy the class name to your clipboard for easy use in your code.
View Documentation: Open the official documentation for the class directly within VS Code.
Theme Selection: Change the theme of the extension's sidebar through a dropdown menu, with options for Light, Dark, and High Contrast themes.
Integrated Documentation: View class documentation as a webpage inside the VS Code editor.
Installation
Open VS Code.
Go to the Extensions view by clicking on the Extensions icon in the Activity Bar on the side of the window or pressing Ctrl+Shift+X.
Search for "Tailwind Search".
Click on the "Install" button.
Usage
Open the Sidebar: Use the command palette (Ctrl+Shift+P) and type "Tailwind Search: Open Sidebar" to open the sidebar.
Search for Classes: Enter your search query into the search box to find relevant Tailwind CSS classes.
Copy or View Documentation: Click on the appropriate button next to a class in the results to copy the class name or view its documentation.
Change Theme: Use the dropdown menu in the sidebar to select your preferred theme.
Theme Options
Light Theme: For a brighter, light-colored interface.
Dark Theme: For a darker, low-light interface.
High Contrast Theme: For improved visibility with high contrast colors.
Acknowledgements
Thanks to the Tailwind CSS team for their incredible utility-first CSS framework.
Special thanks to the VS Code team for creating such a versatile code editor.
For any issues or feature requests, please use the Issues page of the repository.
