Quickstart - Flowbite Blazor

Learn how to get started with the free and open-source Flowbite Blazor component library based on the utility classes from Tailwind CSS

Quickly scaffold a new Flowbite Blazor Web or Desktop application using the CLI

  1. If needed, download and install the .NET SDK
  2. Install the .NET Templates from NuGet. This allows you scaffold new projects
  3. 
    dotnet new install Flowbite.Blazor.Templates
    
    
  4. Scaffold a new a Standalone WASM Web Application (i.e. client-side only)
  5. 
    dotnet new flowbite-blazor-wasm -o MyUnicornApp && cd MyUnicornApp
    
    
  6. Before building, one must install the Tailwind CSS CLI application. Copy the commands below to download the standalone exe to the project's ./tools directory.
  7. 
    mkdir ./tools && cd ./tools && curl -sLO https://github.com/tailwindlabs/tailwindcss/releases/download/v3.4.15/tailwindcss-macos-arm64 && chmod +x tailwindcss-macos-arm64 && mv tailwindcss-macos-arm64 tailwindcss && cd ..
    
    
  8. Build and run the project via `watch` (to allow hot reloading). The build console output will state the URL being served (e.g. http://localhost:5269)
  9. 
    dotnet watch
    
    

What's Next?

Check out our components documentation to learn more about available components and their usage. For a more detailed setup guide, visit the introduction page.

AI Support? 🤖

Point your favorite AI coding assistant to our single file documentation page for it to quickly learn about the available .NET templates, Blazor components, and their usage.

An unhandled error has occurred. Reload 🗙