BlazorStrap screenshot

BlazorStrap

Author Avatar Theme by Chanan
Updated: 18 May 2025
931 Stars

Bootstrap 4 Components for Blazor Framework

Overview

BlazorStrap is a set of Bootstrap 4/5 components for Blazor that can be easily installed using NuGet packages. This tool provides components for both Blazor WebAssembly and Blazor Server-Side applications to enhance the user interface design and functionality.

Features

  • Bootstrap Components: Offers a wide range of Bootstrap components for Blazor applications.
  • Core Package: Handles all logic and JSInterop functionalities for Blazor applications.
  • Version Support: Supports Bootstrap 4 and Bootstrap 5 versions with pre-release packages available.

Installation

For Blazor WebAssembly

  1. Download BlazorStrap package from NuGet: nuget.
  2. Download BlazorStrap.V5 package from NuGet: nuget.
  3. Ensure both packages are of the same version.
  4. Modify your index.html:
    • Inside the <head>, add:
      <link href="YourAssemblyName.styles.css" rel="stylesheet">
      <link href="path_to_bootstrap.min.css" rel="stylesheet" integrity="if_needed">
      
    • At the end of the <body>, add:
      <script src="_content/BlazorStrap/popper.min.js"></script>
      
  5. In Program.cs, add:
    builder.Services.AddBlazorStrap();
    
  6. In _Imports.razor, add:
    @using BlazorStrap.V5
    

For Blazor Server-Side

  1. Download BlazorStrap package from NuGet: nuget.
  2. Download BlazorStrap.V5 package from NuGet: nuget.
  3. Ensure both packages are of the same version.
  4. Modify your _host.cshtml:
    • Inside the <head>, add:
      <link href="YourAssemblyName.styles.css" rel="stylesheet">
      <link href="path_to_bootstrap.min.css" rel="stylesheet" integrity="if_needed">
      
    • At the end of the <body>, add:
      <script src="_content/BlazorStrap/popper.min.js"></script>
      
  5. In Program.cs or Startup.cs, add to your build pipeline:
    services.AddBlazorStrap();
    
  6. In _Imports.razor, add:
    @using BlazorStrap.V5
    

Summary

BlazorStrap is a comprehensive tool that provides Bootstrap components for Blazor applications, with support for both Bootstrap 4 and Bootstrap 5 versions. By following the installation steps outlined above, users can easily enhance the UI and functionality of their Blazor WebAssembly and Blazor Server-Side projects.