Mini Calendar Card
Compact sidebar month picker with today highlighted, event dots on three dates, and prev and next navigation.
Compact sidebar month picker with today highlighted, event dots on three dates, and prev and next navigation.
The Application Collection unlocks the source for every Application block. All Access unlocks every Collection.
Already purchased? Log in
Mini Calendar Card is the compact month picker sized for a sidebar panel. June 2026 fills a tight 7-column grid with two-letter weekday headers (Su through Sa). Today, Jun 13, is highlighted with a filled foreground circle. Three dates carry a small dot indicator below their number: Jun 9, Jun 17, and Jun 24. Out-of-month days from May and July are rendered at reduced opacity. Prev and next chevron buttons sit beside the month label.
The grid is built from the same three-array stitch as the full month view, scaled down with size-7 day buttons and size-1 event dots. The invisible aria-hidden dot on empty days keeps the grid stable without conditional height shifts.
Reach for this block as the date-context widget that sits in a sidebar alongside the week agenda or event list. Wire the day button click to set the active date in your calendar state.
A natural flow around it on an Application Pro page:
Before
After
One strong use is the date navigator beside a day or week view. Other mini calendar card uses:
Tip: the dot sits below the day number in its own flex row; using invisible instead of conditional rendering keeps every cell the same height.