Time Pickers
Alarm time picker
Best for
A reminder setting that turns on, takes a note and picks a number of minutes
Anatomy
Card head with title, sub-label, badge and Switch · note field · Set Alarm select · minute wheel card with stepper bubble · Cancel / Reset / Save
Get a heads-up before the Friday standup.
Range time picker
Best for
Availability windows, quiet hours, opening times — several From / To spans per day
Anatomy
Card head with Switch · From / To chips with a remove button per row · error hint at the limit · Add New Range, dark while empty
The hours you can be booked for on Fridays.
Date & time wheels
Best for
Booking a slot in one card — a week of dates, then hour and minute wheels
Anatomy
PICK DATE head · month button · seven dates with a line indicator · PICK TIME head · Hour and Min wheels with edge fade · Back and the round next button
Pick date
Choose the day for your session.
Pick time
Scroll the wheels to the start time.
Date & time ruler
Best for
The same booking flow with a glanceable time — the picked day named, the minute read out over a ruler
Anatomy
PICK DATE head · month button · date pills, the picked one ringed with its weekday · PICK TIME head · 24px time read-out · minute ruler with the brand orb · Back and next
Pick date
Choose the day for your session.
Pick time
Slide the ruler to the minute.
12:30 PM
Pop-over time picker
Best for
Durations and countdowns set in place — a compact trigger that opens hour, minute and second steppers
Anatomy
Alarm trigger showing 00 : 00 : 00 · tailed pop-over · Hours / Minutes / Seconds columns with up and down · Cancel / Reset / Save
Be first in,
and 10% off.
Join the list and we’ll email you the moment the code library and MCP server go live — with a 10% discount code to use whenever you decide to buy.
One email when it ships. No spam, and you can unsubscribe anytime.Time Pickers
Alarm time picker
Best for
A reminder setting that turns on, takes a note and picks a number of minutes
Anatomy
Card head with title, sub-label, badge and Switch · note field · Set Alarm select · minute wheel card with stepper bubble · Cancel / Reset / Save
Get a heads-up before the Friday standup.
Range time picker
Best for
Availability windows, quiet hours, opening times — several From / To spans per day
Anatomy
Card head with Switch · From / To chips with a remove button per row · error hint at the limit · Add New Range, dark while empty
The hours you can be booked for on Fridays.
Date & time wheels
Best for
Booking a slot in one card — a week of dates, then hour and minute wheels
Anatomy
PICK DATE head · month button · seven dates with a line indicator · PICK TIME head · Hour and Min wheels with edge fade · Back and the round next button
Pick date
Choose the day for your session.
Pick time
Scroll the wheels to the start time.
Date & time ruler
Best for
The same booking flow with a glanceable time — the picked day named, the minute read out over a ruler
Anatomy
PICK DATE head · month button · date pills, the picked one ringed with its weekday · PICK TIME head · 24px time read-out · minute ruler with the brand orb · Back and next
Pick date
Choose the day for your session.
Pick time
Slide the ruler to the minute.
12:30 PM
Pop-over time picker
Best for
Durations and countdowns set in place — a compact trigger that opens hour, minute and second steppers
Anatomy
Alarm trigger showing 00 : 00 : 00 · tailed pop-over · Hours / Minutes / Seconds columns with up and down · Cancel / Reset / Save
Be first in, and 10% off.
Join the list and we’ll email you the moment the code library and MCP server go live — with a 10% discount code to use whenever you decide to buy.
One email when it ships. No spam, and you can unsubscribe anytime.