I want to use a time picker for desktop only. It's not for mobile.

A few options I have are:

A. use 2 dropdowns with format HH:MM for start and end time with 30 minute slots B. use 2 time pickers from Material Design or similar that allows selection from the dial

https://m3.material.io/components/time-pickers/overview (accessibility is also taken into account)

What can be the criteria to prefer one to the other?

1 Answer 1


To start with, if all time slots are 30-minute intervals, you don't need to display the end time. Instead, just list the start time options (e.g., 9:00, 9:30, 10:00) and indicate the duration elsewhere.

When comparing A and B, the Material design certainly has a modern and refreshing appearance, while the dropdown is more basic. However, it's important to consider consistency across the app and determine whether the Material design fits the overall design language or is overkill. Setting the design aspect aside, a dropdown is more flexible in terms of adding functionality and enhancing the app's usefulness. For instance, you might find adding a day picker in front of the time dropdown useful, the dropdown saves space while making app more scalable.

Also, note that the implementation of the dial picker is currently only planned stated in the the website, so it's something to keep in mind. I have a mockupenter image description here

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.