templUI Pro coming soon  

50% OFF Join Waitlist

Date Picker

Calendar interface for selecting and formatting dates.

TailwindCSS
Alpine.js

Usage

1. Add the script to your page/layout:

// Option A: All components (recommended)
@utils.ComponentScripts()

// Option B: Just DatePicker
@components.DatePickerScript()

2. Use the component:

@components.DatePicker(components.DatePickerProps{...})

Examples

With Label

Custom Placeholder

Selected Date

Disabled

Formats

Form

Select a date from the calendar.

Select a valid date

© 2025 templui. Stupid code not excluded.