Welcome to Syncfusion® Blazor Components

3 Mar 202615 minutes to read

Syncfusion^® Blazor Components is an enterprise-grade, native UI components library for creating Blazor WebAssembly and Blazor Server applications. Built specifically for Blazor, the components are lightweight, responsive, and touch-friendly to support modern web applications. The library is engineered for performance, keyboard-first accessibility, and global reach, with rich data visualization and productivity components.

Ready to streamline your Syncfusion^® Blazor development? Discover the full potential of Syncfusion^® Blazor components with Syncfusion^® AI Coding Assistant. Effortlessly integrate, configure, and enhance your projects with intelligent, context-aware code suggestions, streamlined setups, and real-time insights—all seamlessly integrated into your preferred AI-powered IDEs like VS Code, Cursor, Syncfusion^® CodeStudio and more. Explore Syncfusion^® AI Coding Assistant

Why teams choose us?

• Enterprise coverage: A wide range of UI, data visualization, and editor components to cover dashboards, forms, documents, and line-of-business workflows.
• Built for performance: Virtualization, lazy loading, lightweight payloads, and efficient rendering patterns for large datasets.
• Production UX: Responsive layouts, high DPI rendering, touch support, and extensive keyboard interactions.
• Global by default: Localization, internationalization, and right-to-left (RTL) support.
• Accessible: WCAG-compliant semantics, ARIA attributes, and contrast-aware theming.
• Tooling and docs: Extensive samples, API reference, and guidance to get productive quickly.

What’s included

• Data bound components like DataGrid, TreeGrid, Charts, Scheduler, Pivot Table, and more.
• Form inputs, Editors, Pickers, Menus, Navigation, and Layout components.
• Rich visualization: 2D/3D Charts, Gauges, Maps, Heatmaps, and Sparklines.
• File processing via companion .NET libraries for PDF, Word, and Excel (server-side usage).
• Theming system with multiple built-in themes and CSS variables for fine grained component.

How it fits into Blazor

• Works across Blazor Server, Blazor WebAssembly, and Blazor Web App (.NET 8, .NET 9, and .NET 10) render modes.
• Plays well with dependency injection, routing, and cascading values.
• Uses JavaScript interop only where it adds value (DOM/canvas/complex layout), keeping your app primarily in C# and Razor.

How to best read this user guide

• The best way to get started is to read the Getting Started section of the documentation for the component intended for use. The Getting Started section covers the essential concepts to know before writing code. This is the only section recommended to read end-to-end before coding; other topics can be referenced as needed. Ensure the required SDKs and the supported .NET/Blazor versions are installed.

• After becoming familiar with the basics of a component, integrate it into the application. A practical next step is to review the code snippets in the online sample browser, which contains hundreds of examples. It is likely there is a sample that matches the intended usage scenario.

Components List

GRIDS DataGrid Pivot Table TreeGrid Multicolumn ComboBox FILE VIEWERS & EDITORS Rich Text Editor Markdown Editor Image Editor Block Editor LAYOUT Dialog Predefined Dialog ListView Tooltip Splitter Dashboard Layout Card Avatar Media Query Timeline Smart AI Smart Paste Button Smart TextArea

DATA VISUALIZATION Chart 3D Chart Sankey Stock Chart Circular Gauge Linear Gauge Diagram HeatMap Maps Range Selector Smith Chart Sparkline Chart Accumulation Chart Barcode TreeMap Bullet Chart Kanban BUTTONS Button Button Group Dropdown Menu Progress Button Split Button Chips Icons Floating Action Button Speed Dial

CALENDARS Scheduler Gantt Chart Calendar DatePicker DateRangePicker DateTime Picker TimePicker INPUTS TextBox Input Mask Numeric TextBox RadioButton CheckBox Color Picker File Upload Range Slider TextArea Toggle Switch Button Signature Rating OTP Input Speech To Text FORMS In-place Editor Query Builder Data Form Interactive chat AI AssistView Chat UI

DROPDOWNS AutoComplete ListBox ComboBox Dropdown List Dropdown Tree MultiSelect Dropdown Mention NAVIGATION Accordion Breadcrumb Carousel Context Menu Menu Bar Sidebar Tabs Toolbar TreeView File Manager Ribbon Pager AppBar Stepper NOTIFICATION Toast Progress Bar Spinner Badge Skeleton Message

Getting Help

• If information is not found in the self-help resources mentioned above, contact support by creating a ticket in the support site or ask a question on Stack Overflow using the syncfusion-blazor tag.

• If a feature is not available, request it in the feedback portal.

See also

• Product Development

  • Product Development Life Cycle
• Visual Studio
  • Getting started with Syncfusion^® Blazor Components in Web App
  • Getting started with Syncfusion^® Blazor Components in Server App
  • Getting started with Syncfusion^® Blazor Components in WebAssembly App
• .NET CLI
  • Getting started with Syncfusion^® Blazor Components in Web App
  • Getting started with Syncfusion^® Blazor Components in Server App
  • Getting started with Syncfusion^® Blazor Components in WebAssembly App

• Visual Studio for Mac

  • Getting started with Syncfusion^® Blazor Components in Server App

  • Getting started with Syncfusion^® Blazor Components in WebAssembly App