Separator Component
Visually or semantically separates content.
Horizontal
Default separator spanning the full width.
BlazorUI
A Blazor UI component library
Components
Pre-built, production-ready components
Vertical
Separator for horizontally arranged content.
Decorative vs Semantic
Control ARIA attributes for accessibility.
Decorative (Default)
role="none" - Hidden from screen readers (purely visual)
Section 1
Section 2
Semantic
role="separator" with aria-orientation - Announced to screen readers
Settings
Configure your account
Privacy
Manage privacy settings
Custom Styling
Override styles with the Class parameter.
Default separator
Thicker separator
Colored separator
Dashed separator
In Lists
Separating list items or menu options.
Profile Settings
Manage your account
Preferences
Customize your experience
Notifications
Configure alerts
Security
Password and authentication
API Reference
Orientation
Type: SeparatorOrientation
The orientation of the separator. Default: Horizontal
Decorative
Type: bool
When true (default), the separator is purely decorative and hidden from screen readers. Set to false for semantic separators that convey content structure.
Class
Type: string?
Additional CSS classes to apply to the separator element.