Lumeo

TimePicker

A time selection input with hour, minute, and optional second columns.

Installation

dotnet add package Lumeo

One-time app setup (AddLumeo(), CSS & JS) is covered in the installation guide.

Usage

@using Lumeo

<TimePicker />

When to Use

  • Standalone time selection for scheduling or alarm settings
  • Forms where only time input is needed without a date
  • Configuring time-based intervals like business hours or reminders
  • Time-of-day inputs with customizable step intervals

Selected: 14:30

Only times between 09:00 and 17:00 are selectable.

00
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
00
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59

API Reference

TimePicker

Min and Max apply to the List variant only — the Wheel variant has no bounds parameters and ignores them.

Density falls back to an ancestor DensityScope, then Comfortable — see the Density guide.

  • DatePicker — Date selection when you also need a calendar
  • DateTimePicker — Combined date and time picker in a single control
  • Input — Basic text input for manual time entry