Customizable  date format

The input value of the Vue DateRangePicker component can be customized to different, supported cultures.

Preset ranges

Establish predefined date ranges that are commonly used by end users for setting time intervals.

Specific date restrictions

Prevent dates beyond the minimum and maximum dates in the set range from being selected. Users will be unable to enter or select restricted dates.

Attractive customizable themes

The control features innovative design with built-in themes like Fluent, Tailwind CSS, Bootstrap, Material, and Fabric. Effortlessly  personalize DateRangePicker themes using the online Theme Studio tool.


The DateRangePicker allows users from various regions to customize the formatting of dates, currency, and numbering according to their preferences, enabling them to use the tool effectively.

Syncfusion Vue Date Range Picker

The Vue DateRangePicker is a lightweight component designed to be mobile-friendly. Users can easily   select start and end dates for a range through a calendar pop-up or by   directly entering values in the HTML input text box.