Components
Beautifully designed components built on primitives. Ready to use in your Blazor applications. Install via NuGet and start building.
Inputs & Forms
(67)Calendar
A date picker calendar component for selecting dates.
Cascaderv4
A hierarchy picker that shows nested options in side-by-side columns with full-path search.
Checkbox
A control that allows the user to toggle between checked and not checked.
Checkbox Group
A group of checkboxes with shared state and Select All support.
Color Picker
A visual color selection interface with color area, hue slider, and preset colors.
Combobox
Autocomplete input with a list of suggestions.
Currency Input
A locale-aware currency input with automatic formatting and currency symbols.
Date Inputv4
A segmented date input with keyboard-editable year, month, and day fields.
Date Picker
A date input with a calendar popover for selecting dates.
Date Range Picker
A date range selection interface with dual calendar view and preset ranges.
Date Time Picker
A combined date and time picker in a single popover.
Dynamic Form
Schema-driven form generation with validation and dynamic field rendering.
Field
Form field with label, description, and error message support.
Form Field Cascaderv4
A pre-composed form field with cascader, label, and validation.
Form Field Checkbox
A pre-composed form field with checkbox, label, and validation.
Form Field Checkbox Group
A pre-composed form field with checkbox group, label, and validation.
Form Field Combobox
A pre-composed form field with combobox, label, and validation.
Form Field Currency Input
A pre-composed form field with currency input, label, and validation.
Form Field Date Inputv4
A pre-composed form field with date input, label, and validation.
Form Field Date Picker
A pre-composed form field with date picker, label, and validation.
Form Field Date Range Picker
A pre-composed form field with date range picker, label, and validation.
Form Field Date Time Picker
A pre-composed form field with date time picker, label, and validation.
Form Field File Upload
A pre-composed form field with file upload, label, and validation.
Form Field Input
A pre-composed form field with input, label, and validation.
Form Field Input OTP
A pre-composed form field with OTP input, label, and validation.
Form Field Masked Input
A pre-composed form field with masked input, label, and validation.
Form Field Multi Select
A pre-composed form field with multi select, label, and validation.
Form Field Native Select
A pre-composed form field with native select, label, and validation.
Form Field Numeric Input
A pre-composed form field with numeric input, label, and validation.
Form Field Quantity Stepperv4
A pre-composed form field with quantity stepper, label, and validation.
Form Field Radio Group
A pre-composed form field with radio group, label, and validation.
Form Field Select
A pre-composed form field with select, label, and validation.
Form Field Switch
A pre-composed form field with switch, label, and validation.
Form Field Tag Input
A pre-composed form field with tag input, label, and validation.
Form Field Textarea
A pre-composed form field with textarea, label, and validation.
Form Field Time Inputv4
A pre-composed form field with time input, label, and validation.
Form Field Time Picker
A pre-composed form field with time picker, label, and validation.
Form Field Tree Selectv4
A pre-composed form field with tree select, label, and validation.
Form Section
Groups related form fields with an optional title, description, and separator.
Form Wizard
A multi-step form with validation, navigation, and progress tracking.
File Upload
A drag-and-drop file upload interface with previews and progress tracking.
Input
Displays a form input field or a component that looks like an input field.
Stepperv4
A horizontal or vertical progress indicator for a sequence of steps.
Input Field
An input with built-in label, description, and validation support.
Input Group
Input with prefix and suffix elements.
Input OTP
A one-time password input for verification codes.
Label
Renders an accessible label associated with controls.
Masked Input
An input with structured formats including phone, SSN, and custom patterns.
Multi Select
A component for selecting multiple options from a list.
Chipv4
An interactive pill for an attribute, a filter or a choice, with optional selection and dismiss.
Native Select
A styled native HTML select element for simple dropdowns.
Numeric Input
A numeric input with increment/decrement buttons and constraints.
Quantity Stepperv4
An integer quantity control with decrease and increase buttons for carts and orders.
Radio Group
A set of checkable buttons where no more than one can be checked at a time.
Range Slider
A dual-handle slider for selecting value ranges.
Rating
A star rating component with half-value support and custom icons.
Select
Displays a list of options for the user to pick from.
Signaturev4
A Blazor Blueprint component.
Slider
An input for selecting a value from a range.
Switch
A control that allows the user to toggle between checked and not checked.
Tag Input
An input for adding and managing tags or keywords.
Textarea
Displays a form textarea or a component that looks like a textarea.
Time Inputv4
A segmented time input with keyboard-editable hour, minute, and optional second fields.
Time Picker
A time selection interface with 12/24-hour format support.
Tree Selectv4
A searchable hierarchy picker that opens a tree in a popover, with single or multiple selection.
List Boxv4
A Blazor Blueprint component.
Pick Listv4
A Blazor Blueprint component.
Buttons & Toggles
(8)Button
Displays a button or a component that looks like a button.
Button Group
A group of buttons that work together with optional popover and select integration.
FABv4
A floating action button pinned to a corner for the screen's one main action.
Quantity Stepperv4
An integer quantity control with decrease and increase buttons for carts and orders.
Scroll to Topv4
A floating button that appears once a page or panel is scrolled and returns it to the top.
Split Button
A button with a primary action and a dropdown of secondary actions.
Toggle
A two-state button that can be on or off.
Toggle Group
A set of two-state buttons that can be toggled on or off.
Layout & Structure
(14)Accordion
A vertically stacked set of interactive headings that each reveal a section of content.
Aspect Ratio
Displays content within a desired ratio, useful for images and videos.
Card
Displays a card with header, content, and footer.
Collapsible
An interactive component which expands/collapses a panel.
Dashboard Grid
A drag-and-drop, resizable widget layout for composing dashboards.
Dock
An IDE-style docking container with draggable, floating, and tabbed panels.
Resizable
Resizable panel groups for creating flexible layouts.
Scroll Area
Augments native scroll functionality for custom styling.
Section Headerv4
A section title row with supporting text, trailing actions, and an optional separator.
Separator
Visually or semantically separates content.
Sidebar
A collapsible sidebar component with navigation menu.
Sortable
A drag-and-drop sortable list or grid with keyboard sorting and connected lists.
Tabs
A set of layered sections of content that are displayed one at a time.
Theme
An opt-in theme system with dark mode, palettes, radius, and density that persists to localStorage.
Navigation
(13)App Barv4
A compact top bar for mobile layouts with a back button, title, and trailing actions.
Bottom Navigationv4
A bottom navigation bar for mobile layouts with labelled destinations and an active state.
Breadcrumb
Displays the path to the current page with navigation links.
Command
Fast, composable, unstyled command menu for Blazor.
Linkv4
A styled anchor for a link inside text, with colour, underline, and external-link handling.
Menubar
A horizontal menu bar with dropdown menus, similar to desktop application menus.
Navigation Menu
A collection of links for navigating websites with dropdown support.
Pagination
Navigation controls for paginated content.
Responsive Nav
A responsive navigation that adapts between mobile drawer and desktop layout.
Scroll to Topv4
A floating button that appears once a page or panel is scrolled and returns it to the top.
Sidebar
A collapsible sidebar component with navigation menu.
Tabs
A set of layered sections of content that are displayed one at a time.
Tree View
A hierarchical tree view with expand/collapse, selection, and drag-and-drop.
Overlays & Popups
(12)Alert Dialog
A modal dialog that interrupts the user with important content and expects a response.
Command
Fast, composable, unstyled command menu for Blazor.
Context Menu
A menu that appears on right-click, providing contextual actions.
Dialog
A window overlaid on either the primary window or another dialog window.
Drawer
A panel that slides in from the edge of the screen.
Dropdown Menu
Displays a menu to the user with a list of options.
Exit Promptv4
Holds a navigation while there is unsaved work, and asks before letting it go.
Hover Card
For sighted users to preview content available behind a link.
Popover
Displays rich content in a portal, triggered by a button.
Sheet
Extends the Dialog component to display content that complements the main content.
Toast
A notification message that appears temporarily.
Tooltip
A popup that displays information related to an element on hover or focus.
Motion
(6)Motionv4
Animates content with built-in presets or custom keyframes on view, hover, focus, or from code.
Height Animationv4
Animates height when content expands, collapses, or changes size.
Page Transitionv4
Plays an entrance animation on new page content after a navigation.
Render State Providerv4
Cascades whether the subtree is interactive, so prerendered output can skip interaction-only UI.
Screen Transitionv4
Animates incoming content when an application-owned screen key changes.
Selection Indicatorv4
A highlight that slides behind the active item and follows hover and focus.
Data Display
(33)Avatar
An image element with a fallback for representing the user.
Badge
Displays a badge or a component that looks like a badge.
Barcodev4
A Blazor Blueprint component.
Carousel
A carousel with motion and swipe support for cycling through content.
Chart
Interactive charts built on ApexCharts with shadcn/ui theming support.
Chipv4
An interactive pill for an attribute, a filter or a choice, with optional selection and dismiss.
Copy Text
An inline click-to-copy value with tooltip feedback and a copied state.
Dashboard Grid
A drag-and-drop, resizable widget layout for composing dashboards.
Data Grid
High-performance data grid with sorting, filtering, and column management.
Data Grid Cell & Batch Editingv4
Row, cell, and batch editing for a DataGrid with drafts, validation, and staged saves.
Data Grid Hierarchy
Hierarchical tree data inside a DataGrid with expand/collapse, lazy loading, and cascading selection.
Data Grid Styling
Custom cell rendering, row styling, conditional formatting, and state templates for a DataGrid.
Data Table
Powerful table and datagrids built using primitives.
Data View
Flexible data presentation with list/grid toggle, filtering, and pagination.
Empty
Displays a placeholder when there is no data or content to show.
Event Calendar
A generic event calendar with month, week, and agenda views over your own event model.
Filter Builder
A visual query builder for constructing complex filter expressions.
Ganttv4
A Blazor Blueprint component.
Highlighterv4
Marks the parts of a string that match a search term, so a result list shows why each row matched.
Imagev4
An image with a fallback for a source that cannot be loaded, plus object-fit and lazy loading.
Item
A flexible item component for lists and menus.
Kbd
Displays keyboard shortcuts and key combinations.
Notification Badgev4
Overlays a count or an activity dot on the corner of an icon, button, or avatar.
Pagination
Navigation controls for paginated content.
Pivot Data Gridv4
A Blazor Blueprint component.
Progress
Displays an indicator showing the completion progress of a task.
QR Codev4
A Blazor Blueprint component.
Schedulerv4
A time-slot scheduler with day and week lanes, resources, drag and resize, and recurrence.
Skeleton
Use to show a placeholder while content is loading.
Spinner
A loading spinner indicator for async operations.
Timeline
A composable timeline for displaying chronological events with icons and connectors.
Tree View
A hierarchical tree view with expand/collapse, selection, and drag-and-drop.
Typography
Styled text components for consistent typography.
Feedback
(8)Alert
Displays a callout for important information or feedback.
Exit Promptv4
Holds a navigation while there is unsaved work, and asks before letting it go.
Notification Badgev4
Overlays a count or an activity dot on the corner of an icon, button, or avatar.
Progress
Displays an indicator showing the completion progress of a task.
Skeleton
Use to show a placeholder while content is loading.
Spinner
A loading spinner indicator for async operations.
Stepperv4
A horizontal or vertical progress indicator for a sequence of steps.
Toast
A notification message that appears temporarily.
Chat & AI
(4)Attachment
A file attachment chip with a preview, upload state, and actions for chat surfaces.
Bubble
A chat message bubble with alignment, visual variants, and reaction chips.
Marker
An inline status marker for tool-call lines, row separators, and labeled dividers.
Message
A chat message row with an avatar slot, a content column, and start or end alignment.
Editors
(2)Markdown Editor
A markdown editor with a formatting toolbar, write and preview tabs, and live rendering.
Rich Text Editor
A WYSIWYG editor built on Quill.js with a custom Blazor toolbar.
Enterprise
(17)Cascaderv4
A hierarchy picker that shows nested options in side-by-side columns with full-path search.
Dashboard Grid
A drag-and-drop, resizable widget layout for composing dashboards.
Data Grid
High-performance data grid with sorting, filtering, and column management.
Data Grid Cell & Batch Editingv4
Row, cell, and batch editing for a DataGrid with drafts, validation, and staged saves.
Data Grid Hierarchy
Hierarchical tree data inside a DataGrid with expand/collapse, lazy loading, and cascading selection.
Data Grid Styling
Custom cell rendering, row styling, conditional formatting, and state templates for a DataGrid.
Data View
Flexible data presentation with list/grid toggle, filtering, and pagination.
Dynamic Form
Schema-driven form generation with validation and dynamic field rendering.
Filter Builder
A visual query builder for constructing complex filter expressions.
Form Wizard
A multi-step form with validation, navigation, and progress tracking.
Ganttv4
A Blazor Blueprint component.
Pick Listv4
A Blazor Blueprint component.
Pivot Data Gridv4
A Blazor Blueprint component.
Schedulerv4
A time-slot scheduler with day and week lanes, resources, drag and resize, and recurrence.
Signaturev4
A Blazor Blueprint component.
Tree Selectv4
A searchable hierarchy picker that opens a tree in a popover, with single or multiple selection.
Tree View
A hierarchical tree view with expand/collapse, selection, and drag-and-drop.