Blazorise Theme API
A set of classes that define and customize the visual appearance of Blazorise components.
On this page, you can explore the Theme API and its available classes. For more details on specific theming aspects, click the links below to access dedicated API documentation for colors, options, and palettes.
For examples and usage guidance, see the Theming documentation.
API
Parameters
Theme
| Parameter | Default | Type |
|---|---|---|
AlertOptions | null | ThemeAlertOptions |
Theme options to override the Alert component styles. | ||
BackgroundOptions | null | ThemeBackgroundOptions |
Used to override default background colors. | ||
BadgeOptions | null | ThemeBadgeOptions |
Theme options to override the Badge component styles. | ||
BarOptions | null | ThemeBarOptions |
Theme options to override the Bar component styles. | ||
Black | "#343a40" | string |
Defines the base theme dark color. | ||
BodyOptions | null | ThemeBodyOptions |
Defined the body options. | ||
BorderOptions | null | ThemeBorderOptions |
Used to override default border styles. | ||
BreadcrumbOptions | null | ThemeBreadcrumbOptions |
Theme options to override the Breadcrumb component styles. | ||
BreakpointOptions | null | ThemeBreakpointOptions |
Global options for media breakpoints. | ||
ButtonOptions | null | ThemeButtonOptions |
Theme options to override the Button component styles. | ||
CardOptions | null | ThemeCardOptions |
Theme options to override the Card styles. | ||
ColorOptions | null | ThemeColorOptions |
Used to override default theme colors. | ||
ContainerMaxWidthOptions | null | ThemeContainerMaxWidthOptions |
Define the maximum width of container for different screen sizes. | ||
DividerOptions | null | ThemeDividerOptions |
Theme options to override the Divider component styles. | ||
DockLayoutOptions | null | ThemeDockLayoutOptions |
Theme options to override the DockLayout component styles. | ||
DropdownOptions | null | ThemeDropdownOptions |
Theme options to override the Dropdown styles. | ||
Enabled | true | bool |
Globaly enable or disable the theme. | ||
InputOptions | null | ThemeInputOptions |
Theme options to override the Input component(s) styles. | ||
IsGradient | false | bool |
Enables the gradient background colors. | ||
IsRounded | true | bool |
Globaly enables rounded elements. | ||
ListGroupItemOptions | null | ThemeListGroupItemOptions |
Theme options to override the ListGroupItem component styles. | ||
LuminanceThreshold | 150 | byte |
The yiq lightness value that determines when the lightness of color changes from "dark" to "light". Acceptable values are between 0 and 255. | ||
ModalOptions | null | ThemeModalOptions |
Theme options to override the Modal dialog styles. | ||
PaginationOptions | null | ThemePaginationOptions |
Theme options to override the Pagination component styles. | ||
ProgressOptions | null | ThemeProgressOptions |
Theme options to override the Progress component styles. | ||
RatingOptions | null | ThemeRatingOptions |
Theme options to override the Rating component styles. | ||
SidebarOptions | null | ThemeSidebarOptions |
Theme options to override the Sidebar component styles. | ||
SnackbarOptions | null | ThemeSnackbarOptions |
Theme options to override the Snackbar component styles. | ||
SpacingOptions | null | ThemeSpacingOptions |
Theme options to override the spacing utilities. | ||
SpinKitOptions | null | ThemeSpinKitOptions |
Theme options to override the SpinKit component styles. | ||
StepsOptions | null | ThemeStepsOptions |
Theme options to override the Steps component styles. | ||
SwitchOptions | null | ThemeSwitchOptions |
Theme options to override the Switch component styles. | ||
TableOptions | null | ThemeTableOptions |
Theme options to override the Table component styles. | ||
TabsOptions | null | ThemeTabsOptions |
Theme options to override the Tabs component styles. | ||
TextColorOptions | null | ThemeTextColorOptions |
Used to override default background colors. | ||
ThemeColorInterval | 8f | float |
Set a specific jump point for requesting color jumps | ||
TooltipOptions | null | ThemeTooltipOptions |
Theme options to override the Tooltip component styles. | ||
ValidBackgroundColors | null | IEnumerable<ValueTuple> |
Gets the valid background colors. | ||
ValidBreakpoints | null | IEnumerable<ValueTuple> |
Gets the valid breakpoints. | ||
ValidColors | null | IEnumerable<ValueTuple> |
Gets the valid variant colors. | ||
ValidContainerMaxWidths | null | IEnumerable<ValueTuple> |
Gets the valid sizes for container. | ||
ValidTextColors | null | IEnumerable<ValueTuple> |
Gets the valid text colors. | ||
White | "#ffffff" | string |
Defines the base theme light color. | ||
Methods
Theme
| Method | Return | Parameters |
|---|---|---|
ThemeHasChanged | void | — |
Must be called to rebuild the theme.
| ||
ThemeGenerator
| Method | Return | Parameters |
|---|---|---|
GenerateStyles | string | Theme theme |
Generates a CSS styles based on the defined Theme options.
| ||
GenerateVariables | string | Theme theme |
Generates a CSS variables based on the defined Theme options.
| ||
ShadeColor | Color | Color baseColor, double weightPercent |
Sass shade-color($color, $weight) = mix(black, $color, $weight). (Not used by Bootstrap’s subtle, but handy.)
| ||
TintColor | Color | Color baseColor, double weightPercent |
Sass tint-color($color, $weight) = mix(white, $color, $weight).
| ||