The Blazor Calendar component provides an intuitive interface for date selection and navigation. It offers a comprehensive set of features including multiple view modes, multi-selection, week number and accessibility support for building robust date-picking experiences.

The Calendar component supports multiple view modes including month, year, and decade views. Users can switch between different views using the Start and Depth properties to control the initial view and navigation depth.

The Min and Max properties used to control date selection by setting minimum and maximum selectable dates. This ensures users can only select dates within the specified range, making it ideal for booking systems and date-restricted scenarios.

The IsMultiSelection property enable users to select multiple non-consecutive dates. This is useful for scheduling events, selecting date ranges, or marking multiple important dates.

Customize specific dates in a Blazor Calendar by handling the DayCellRendering event. This event fires for each day cell as it is created, allowing the addition of CSS classes and, if needed, disabling particular dates. The following example highlights two sets of days in the current month with custom styles using the personal-appointment and official-appointment classes, and updates a label on selection via ValueChange event.

The Blazor Calendar component supports displaying the Islamic (Hijri) Calendar. The Hijri Calendar is a lunar Calendar with 12 months and 354 or 355 days per year. To render the Islamic Calendar, set the CalendarMode property to CalendarType.Islamic. This switches the Calendar system used for display and selection.

The WeekNumber property is used to display week numbers alongside the Calendar dates. This feature is particularly useful for business applications that reference ISO week numbers for planning and reporting purposes. Configure how the first week of the year is determined by using the WeekRule property (aligned with .NET CalendarWeekRule semantics).

The Calendar provides an option to change the first day of the week by using the FirstDayOfWeek property. Generally, the day of the week starts from 0 (Sunday) and ends with 6 (Saturday).