Date Picker blocks
A date picker is a calendar rendered as an input: a grid of days a reader clicks instead of typing, with today, the picked day and the unavailable days each drawn differently.
Get Pro to installPro6 blocksReact, Vue and Figma
Every block in the set#
When to use#
- A form field whose value is a calendar day and the reader knows roughly which one.
- A report filter where the common answers are spans: last week, this month, last quarter.
- Booking, where availability differs day by day and the grid has to show which days still have room.
- A field where the neighbouring days carry information: days already committed, days blacked out.
The whole set, with its codePro
Pro opens the Code tab on every block here, in React and Vue, plus the Figma file and the MCP server for your editor.
