{"repo":"tesar-tech/BlazorAndTailwind","free":true,"listed":false,"github":"https://github.com/tesar-tech/BlazorAndTailwind","clone":"git clone https://github.com/tesar-tech/BlazorAndTailwind.git","description":"Tips and notes about Blazor and Tailwind","language":"HTML","stars":120,"topics":["blazor","tailwindcss"],"license":null,"category":"ui-components","readme_excerpt":"Blazor and Tailwind CSS Blazor, a powerful framework for building interactive client-side web UI with .NET, and Tailwind CSS, a highly customizable, low-level CSS framework, come together to provide a streamlined development experience. This guide is designed for developers who are interested in exploring the synergy between Blazor and Tailwind CSS. It provides insights and practical steps to integrate these technologies effectively, enhancing both the aesthetics and functionality of your web applications. Quick setup - For a quick and easy way to experiment with Tailwind CSS in your Blazor project, simply incorporate Tailwind's Play CDN link into your index.html (or App.razor ) file. This approach offers a straightforward method to start using Tailwind without the need for extensive setup. Your integration would look something like this: - Then just add the Tailwind classes to your HTML elements. For example: - This approach is not suitable for production use. For a more robust solution, see the next section. - You can use tailwind cli. It enables you to run tailwind without npm. - On Windows you can obtain it by winget install -e --id TailwindLabs.TailwindCSS - Add the following to your app.css file. - Add a tailwind.config.js file to your project root. You can run tailwindcss init command in your terminal to create it. - Add razor files to the content array in tailwind.config.js : - Run the tailwindcss -i .\\wwwroot\\app.css -o .\\wwwroot\\app.min.css -w where the tailwind.con","default_branch":null,"files":null,"tree":[],"storefront":"/r/tesar-tech","claimed":false,"request_supported":{"post":"https://gitbuyer.com/r/tesar-tech/BlazorAndTailwind/request-supported","requests":0},"note":"indexed from public GitHub; nothing is for sale on this page. Clone it from GitHub. Paid listings live at /search."}