Blazorise SpinKit component
A component used to show loading indicators animated with CSS.
Installation
NuGet
Install extension from NuGet.Install-Package Blazorise.SpinKit
Imports
In your main _Imports.razor add:
@using Blazorise.SpinKit
Static files
Include CSS link into yourindex.html
or _Layout.cshtml
/ _Host.cshtml
file, depending if you’re using a Blazor WebAssembly or Blazor Server side project.
<link href="_content/Blazorise.SpinKit/blazorise.spinkit.css" rel="stylesheet" />
Basic example
A basic spinner with default settings.<SpinKit Type="SpinKitType.Plane" />
Color
The color can be changed with HEX value.<SpinKit Type="SpinKitType.Plane" Color="#ff4a3d" />
Size
Size can be changed using any unit type. In this example we’re usingpx
.
<SpinKit Type="SpinKitType.Plane" Size="20px" />
API
Attributes
Name | Description | Type | Default |
---|---|---|---|
Type |
Defines the spinner type. | SpinKitType |
Plane |
Color |
Defines the custom spinner color. | string |
null |
Size |
Defines the custom spinner size. | string |
null |
Centered |
Position the spinner to the center of its container. | bool |
false |