MARKETPLACE
PLUGINS
NWD DATE/TIME PICKER (MULTI-MODE)
NWD Date/Time Picker (Multi-Mode) logo

NWD Date/Time Picker (Multi-Mode)

Published May 2026
   •    Updated this week

Plugin details

NWD Date/Time Picker (Multi-Mode) is the date and time input Bubble was always missing. Built to replace the native element and go far beyond what most plugins offer, it brings single, multiple, and range date selection together with a fully integrated time picker in one polished component. Fully customizable through 100+ properties, giving you complete control over every visual and behavioral detail.
This plugin is maintained by GCS Studios and is part of the NWD UI - Input family, form controls built from scratch for Bubble, inspired by a personal component library originally built for React. Each one is carefully designed and tested in real applications before release, for the level of control, polish and reliability that native Bubble inputs often do not provide. See more plugins on the GCS Studios contributor page.






Key Features

Flexible Selection
✅ Single, multiple, and range date selection in one component
✅ Integrated time picker with hour, minute, and second columns
✅ Configurable step intervals for hours, minutes, and seconds
✅ Disable specific dates, weekdays, and time ranges
✅ Set minimum and maximum dates and time limits
✅ Maximum selection limit for multiple and range modes

Locale & Timezone
✅ Built-in locale support for dates, month names, weekday and time labels
✅ System or custom IANA timezone with automatic fallback
✅ 12h and 24h time formats with AM/PM tab control
✅ Weekday labels with configurable capitalization

Fully Customizable
✅ 100+ properties for complete visual and behavioral control
✅ Circle or square selection shape for calendar days and time picker options
✅ Glassmorphism effect with six intensity levels
✅ Custom placeholder, icon placement, and display formats for date and time
✅ Fully customizable item states: available, hovered, selected, and disabled
✅ Seamless integration with native Bubble styles while preserving a consistent appearance across browsers and matching your app design
✅ Advanced visual customization including custom scrollbars, modern glass effects, and a built in icon library

Smooth User Experience
✅ Configurable tooltip on hover showing all selected dates
✅ Smooth animation types with smart directional positioning that adapts beautifully to any screen
✅ Keyboard ready with support for Tab, Enter, Space, and Escape
✅ Screen reader ready with an accessible label and description, and reduced motion support
✅ Handles required and invalid states with customizable styling that integrates with Bubble styles

Workflow Friendly
✅ Exposed states for selected values in all selection modes, validity, focus, and active locale and timezone
✅ Required field validation with touch-aware invalid state
✅ Focus action that can be triggered from anywhere for full workflow control
✅ Reset action with flexible behavior that integrates with native Bubble actions or custom workflows
✅ Value changed event for seamless Bubble integration
✅ Powered by Luxon for locale and timezone support

Reliable & Production-Ready
✅ Built with lightweight CSS and JavaScript for fast, reliable performance
✅ Designed around practical use cases and real Bubble development needs
✅ Tested in real-world applications before being released publicly
✅ Created to extend Bubble with functionality and customization beyond what native Bubble elements typically offer



How to test this plugin almost for free?
Subscribe and test it for a few days to see if the plugin meets your needs. Subscriptions are billed prorated, so if you cancel after a short period, you'll only pay for the days used.

Explore Our Other Plugins
Check out our complete collection of plugins, including elements, inputs, client-side actions, server-side actions, and APIs. Built to extend native capabilities or introduce new features, based on real-world applications.



Get in Touch
We'd love to hear from you! If you need help, have any questions about our plugins, want to provide feedback, or suggest a feature, please contact us directly.

$36

One time  •  Or  $12/mo

stars   •   0 ratings
9 installs  
This plugin does not collect or track your personal data.

Platform

Web

Contributor details

GCS Studios logo
GCS Studios
Joined 2021   •   19 Plugins
View contributor profile

Instructions

Basically, all plugin properties have a detailed description within the plugin element itself. But in short, follow the steps below and check the documentation for more information.

1️⃣ 𝗜𝗻𝘀𝗲𝗿𝘁 𝘁𝗵𝗲 𝗲𝗹𝗲𝗺𝗲𝗻𝘁 𝗼𝗻 𝘁𝗵𝗲 𝗽𝗮𝗴𝗲
Place the plugin element wherever you need it.

2️⃣ 𝗖𝗼𝗻𝗳𝗶𝗴𝘂𝗿𝗲 𝘁𝗵𝗲 𝗽𝗿𝗼𝗽𝗲𝗿𝘁𝗶𝗲𝘀
Choose the mode (date, time or datetime), the selection type (single, multiple or range), the locale and timezone, and the display format. Everything else starts with a working default.

3️⃣ 𝗖𝗼𝗻𝗻𝗲𝗰𝘁 𝘁𝗼 𝘆𝗼𝘂𝗿 𝘄𝗼𝗿𝗸𝗳𝗹𝗼𝘄𝘀
Use the value changed event to capture confirmed selections, and read the exposed states according to the selection type you chose.

Types

This plugin can be found under the following types:
Element   •   Event   •   Action

Categories

This plugin can be found under the following categories:
Technical   •   Ecommerce   •   Calendar   •   Analytics   •   Productivity   •   Input Forms

Resources

Support contact
Documentation
Tutorial

Rating and reviews

No reviews yet

This plugin has not received any reviews.
Bubble