The Time component provides an intuitive time picker for collecting specific times from respondents. It supports both 12-hour (AM/PM) and 24-hour formats, with configurable minute intervals.
When to use Time
Section titled “When to use Time”Time is useful for:
- Appointment time preferences
- Event start/end times
- Schedule availability
- Delivery time windows
- Any question requiring a specific time
Adding a Time component
Section titled “Adding a Time component”-
Open your form in the editor
-
Drag the Time component from the left sidebar onto your form
-
Click the component to select it and configure its settings
Configuration options
Section titled “Configuration options”Question label
Section titled “Question label”The main question or prompt displayed above the time picker.
Examples:
- “Preferred appointment time”
- “What time works best for you?”
- “Event start time”
- “When should we call?”
Supporting content
Section titled “Supporting content”Add helper text, an example image, or a divider between the question’s title and its input: drag a Text, Image, or Divider component onto the question and drop it on the line that appears under the title. Supporting text comes with full formatting and answer piping. Learn more in Supporting content.
Time format
Section titled “Time format”Choose how times are displayed:
| Format | Example | Common In |
|---|---|---|
| 12-hour | 2:30 PM | US, UK, Australia |
| 24-hour | 14:30 | Europe, military, technical |
Choose the format most familiar to your audience.
Minute step
Section titled “Minute step”Control the granularity of minute selection:
| Step | Available Minutes | Best For |
|---|---|---|
| 1 | 00, 01, 02… 59 | Precise timing |
| 5 | 00, 05, 10… 55 | General scheduling |
| 10 | 00, 10, 20… 50 | Rough estimates |
| 15 | 00, 15, 30, 45 | Quarter-hour slots |
| 30 | 00, 30 | Half-hour slots |
| 60 | 00 | Hour-only selection |
Time limit
Section titled “Time limit”Restrict the selectable times to a range (earliest and latest).
Required
Section titled “Required”Toggle whether a time must be selected before the form can be submitted.
When enabled:
- An asterisk (*) appears next to the question label
- Users must select a time to submit
- A validation message appears if no time is selected
Time picker interaction
Section titled “Time picker interaction”Selecting time
Section titled “Selecting time”
The time picker allows selection of:
- Hour: Select from available hours
- Minutes: Select from available minute intervals
- AM/PM: Toggle between morning and afternoon (12-hour format)
Input methods
Section titled “Input methods”- Click/tap: Select from dropdown or picker
- Type: Enter time directly in the component
- Scroll: Scroll through options on mobile
Validation
Section titled “Validation”The Time component validates:
- Time is in valid format
- Component is not empty (if required)
Accessibility
Section titled “Accessibility”The Time component is built with accessibility in mind:
- Keyboard navigation support
- Screen reader compatible
- Clear focus states
- Time format is announced
- AM/PM toggle is accessible
Handling responses
Section titled “Handling responses”Time responses in your form results:
- Display in the configured format
- Can be sorted chronologically
- Are included in exports
- Store the time value consistently
Time zones
Section titled “Time zones”The Time component collects a time value without timezone information. Consider:
- Specify timezone in the supporting text: “All times are in Pacific Time”
- Ask for timezone separately: Add a dropdown for timezone selection
- Use respondent’s local time: Clarify that times are in their local timezone
