MARKETPLACE
PLUGINS
SIMPLE TIME PICKER
Simple Time Picker logo

Simple Time Picker

Published January 2025
   β€’    Updated May 2026

Plugin details

πŸ•’ Simple Time Picker is a versatile and stylish time input plugin for Bubble.io. It allows users to pick time effortlessly while offering the flexibility to toggle between 12-hour and 24-hour formats. This plugin ensures seamless integration into your app, providing a modern and user-friendly experience. πŸŽ‰
Key Features ✨:

⏳ 12/24-Hour Format Toggle: Allow users to easily switch between 12-hour and 24-hour time formats.

🎨 Dynamic Customization: Modify text size, color, border styles, and arrow designs to align with your app's aesthetics.

⏱ Adjustable Increments: Define time steps in minutes (e.g., 5, 10, 15) to fit your application's needs.

πŸ“± Responsive Design: Works flawlessly across desktop and mobile devices.

Perfect For πŸ’‘:

πŸ—“ Scheduling appointments

βœ… Creating to-do lists with time slots

🏨 Designing booking systems

πŸ•° Building any app with time-based inputs
Give your users an intuitive and sleek time selection experience with πŸ•’ Simple Time Picker! πŸš€


Demo page: https://ncv-demos4.bubbleapps.io/version-test/time_picker

Editor: https://bubble.io/page?id=ncv-demos4&tab=Design&name=time_picker&type=page

$10

One time

stars   β€’   0 ratings
6 installs  
This plugin does not collect or track your personal data.

Platform

Web

Contributor details

No-Code Venture logo
No-Code Venture
Joined 2017   β€’   214 Plugins
View contributor profile

Instructions

How To Use πŸ› οΈ: Insert the Time Picker πŸ•‘:

Drag and drop the Simple Time Picker element onto your Bubble app page.
Customize Settings ✍️:

Set the increment property to determine minute steps.
Choose initial hour and minute values dynamically or manually.
Enable Format Switching πŸ”„:

Add a toggle input element to your page and bind its value to the time picker's display_format property for real-time format switching.
Style Your Picker 🎨:

Use the editor to adjust colors, font sizes, weights, and arrow sizes to create the perfect fit for your app's design.
Preview and Refine πŸ”:

Test the functionality on your app to ensure it behaves as expected.

Demo page: https://ncv-demos4.bubbleapps.io/version-test/time_picker

Editor: https://bubble.io/page?id=ncv-demos4&tab=Design&name=time_picker&type=page

Types

This plugin can be found under the following types:

Categories

This plugin can be found under the following categories:
Small Business   β€’   Containers   β€’   Visual Elements

Resources

Support contact
Tutorial

Rating and reviews

No reviews yet

This plugin has not received any reviews.
Bubble