Badge

The Radzen Blazor Badge component is a small graphic that displays important information, like a count or label, within a user interface. It's commonly used to draw attention to something or provide visual feedback to the user.

Badge Style link

To set a predefined badge style, use the BadgeStyle property, e.g. BadgeStyle="BadgeStyle.Primary".

Primary Secondary Info Success Warning Danger Light Dark

Badge Shade link

Each badge style, except Light and Dark, comes with a set of shades. Use the Shade property, e.g. Shade="Shade.Lighter".

Primary Secondary Info Success Warning Danger

Badge Variant link

Each badge style and shade can be used with different badge variants. Use the Variant property, e.g. Variant="Variant.Outlined".

Flat Outlined Text

Pill link

Use IsPill="true" for pill-shaped badges.

Flat Outlined

Child Content link

Define custom content with ease.

bug_report No Bugs Found

Introducing Radzen Blazor Studio

Radzen Blazor Studio is a desktop tool that empowers developers to create beautiful business Blazor apps. Develop your Blazor Server and WebAssembly applications visually with familiar WYSIWYG interface.

open_in_new Try Now play_circle_outline See in Action

New

Radzen
Blazor Studio

Radzen Blazor Studio is a desktop tool that empowers developers to create beautiful Blazor apps.

Develop your Blazor Server and WebAssembly applications visually with familiar WYSIWYG interface.

open_in_new Try Now play_circle_outline See in Action

Overview
Dashboard
Get Started
Support
UI Fundamentals
- Themes
- Colors
- Typography
- Icons
- Borders
- Shadows
- Ripple
- Breakpoints
- Spacing
DataGrid Updated
- Data-binding
- Virtualization
  - IQueryable support
  - LoadData support
- Columns Updated
- Filtering Updated
- Hierarchy Updated
- Selection Updated
- Sorting
- Paging Updated
- Grouping Updated
- Density
- Custom Header
  - Header with button
  - Header with column picker
- GridLines
- Cell Context Menu
- Save/Load settings Updated
  - IQueryable New
  - LoadData binding New
- InLine Editing
- Conditional formatting
- Export to Excel and CSV
- Cascading DropDowns
- Empty Data Grid
Data Updated
- DataList
  - IQueryable New
  - OData service New
- DataFilter
- Pager
- Scheduler Updated
- Tree
Images
- Gravatar
- Image
Layout
- Layout
- Stack
- Row
- Column
- Card Updated
- Dialog
- Panel
- Splitter
- Popup New
Navigation
- Accordion
- BreadCrumb
- ContextMenu
- Link
- Login
- Menu
- PanelMenu
- ProfileMenu
- Steps
- Tabs
Forms
- AutoComplete
- Button
- CheckBox
- CheckBoxList
- ColorPicker
- DatePicker
- DropDown
  - Single selection Updated
  - Multiple selection Updated
  - Virtualization Updated
  - Filtering Updated
  - Grouping Updated
  - Custom objects binding Updated
- DropDownDataGrid
- Fieldset
- FileInput
- FormField New
- HtmlEditor
  - Default Tools
  - Custom Tools
- ListBox
- Mask
- Numeric
- Password
- RadioButtonList
- Rating
- SelectBar
- Slider
- SpeechToTextButton New
- SplitButton
- Switch
- TemplateForm
- TextArea
- TextBox
- Upload
Data Visualization
- Chart Updated
  - Series
  - Area Chart
  - Bar Chart
  - Column Chart
  - Donut Chart
  - Line Chart
  - Pie Chart
  - Stacked Bar Chart
  - Stacked Column Chart
  - Axis
  - Legend
  - ToolTip
  - Trends
  - Annotations
  - Interpolation New
  - Styling Chart
- Arc Gauge
- Radial Gauge
- Styling Gauge
- Timeline New
- GoogleMap
Feedback
- Badge
- Notification
- Alert
  - Alert Configuration
  - Alert Styling
- ProgressBar Updated
- ProgressBarCircular New
- Tooltip
Validators