Blazorise Documentation

Build Blazor applications with a consistent set of components and the freedom to choose the design system that fits your project.

A new application might start with a few forms and a navigation bar, then grow to need data grids, charts, and more complex workflows. It might also need to fit an existing design system. Blazorise is built around those needs: familiar components you can use throughout your application, a choice of CSS frameworks, and additional features you can bring in as your project grows.

That idea shapes the whole library. Blazorise has three parts that work together: a shared core, providers for different CSS frameworks, and extensions for more specialized features. Understanding how they fit together makes it easier to choose what your application needs.

Extensions reuse the shared core. Your selected provider adapts how those components render.

One API, different design systems

If you have used a component library built around one design system, you are used to choosing its look along with its API. Blazorise separates those choices. You work with the same components, parameters, and events whether your application uses Bootstrap, Bulma, Ant Design, or another supported CSS framework.

For example, a button still uses the same Blazorise API to set its color, disable it, or respond to a click. The provider gives it the appearance and framework-specific rendering your application needs. You can carry the same component knowledge between projects, even when those projects use different design systems.

A shared core and separate providers

The Blazorise project is the common foundation. It defines everyday components such as buttons, inputs, tables, and modals, along with their shared behavior, events, validation, and layout utilities. Keeping this work in one place lets providers reuse it, so improvements to common behavior can benefit applications across CSS frameworks.

Each provider lives in a separate project, such as Blazorise.Bootstrap5. Its job is to adapt that foundation to a particular CSS framework, supplying the appropriate classes, styles, and any component markup or behavior that needs to differ. A provider therefore does more than change colors: it connects the shared Blazorise API to the conventions of the framework you choose.

This separation keeps the core independent of any one CSS framework. Providers can evolve with their frameworks while sharing the same foundation, and your application references the provider it uses. The integration guides explain the available providers and their setup.

Extensions built on the same foundation

A simple form and an analytics dashboard need different tools. Putting every feature into the core would make both applications take on the same set of dependencies. Blazorise keeps specialized features such as DataGrid, Charts, and Scheduler in separate extension packages, so you can add the capabilities and any supporting dependencies your project needs while keeping the core focused on the components those features share.

Most extensions are built by combining core Blazorise components. DataGrid, for example, uses the core table, inputs, buttons, and pagination components to provide its richer editing and navigation features. Those building blocks already use your selected provider, so the extension naturally follows the same visual conventions and theme as the rest of your application.

DataGrid adds advanced features using familiar components that already follow your provider and theme.

This is why extensions can offer more advanced behavior while still feeling like part of Blazorise. You keep working with familiar components and styling options as your application grows. Extensions that need a specialized rendering engine, such as Charts, keep that integration in their own package.

Getting started

Follow the quick start guide to add Blazorise to your application and create your first components. If you already have a CSS framework in mind, start with its integration guide.

If you work with an AI assistant, the MCP server guide shows how to give it access to Blazorise documentation and examples.

Templates

Start from a ready-made project with a Blazorise template. The templates guide explains how to choose and create a starting point for your application.

Migration

Moving an existing app to Blazorise 2.0? Use the migration CLI guide to analyze your solution and apply the required changes.

Analyzer

Get migration diagnostics in your IDE and build output with Blazorise.Analyzers. Follow the analyzer guide to install and configure it.

Examples

Explore the component documentation for focused examples of forms, layouts, navigation, and other everyday UI elements. The extension documentation covers more specialized features as you need them.

Live Demo Applications

Open a demo below to see Blazorise components and extensions in action. Compare the providers to see how the same component API fits different visual styles, and explore the examples to find patterns for your own application.