Date Picker

Back to What's New

Choose a date

DD/MM/YYYY

March 2026

Mon

Tue

Wed

Thu

Fri

Sat

Sun

23

24

25

26

27

28

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

1

2

3

4

5

The Date Picker is now part of CDS — a form input that combines a text field for direct entry with a calendar popup for visual selection, so users can complete the task with either keyboard-first or pointer-first behaviour.

Reach for the Date Picker when the user needs to select a specific calendar date (a test-drive day, an appointment slot, an expiry date), when the date is in the near future or recent past and calendar context improves selection confidence, when the input must be constrained to a valid date range, or when downstream processing requires a consistent date format. Skip it when only a month or year is required, when the interaction is relative (“in X days”) rather than absolute, or when there’s no persistent visible label associated with the field.

The component meets WCAG 2.1 AA. Keyboard interaction covers the field, the popup trigger, month navigation, and individual day cells; focus moves into the popup on open and returns to the trigger on close; day cells expose full dates via aria-label; manual text input is mandatory and cannot be removed.

Full anatomy, schemes, and accessibility guidance live on the Date Picker documentation page.