# Date Picker

This topic covers details about the date picker in C1Ribbon.

## Content

A date picker allows a user to choose a specific date from a drop-down calendar or enter a specific date in the numeric box. The user can click the DatePicker's calendar icon to select a date.

![Date picker](https://cdn.mescius.io/document-site-files/images/5560dc72-88a5-4eeb-a384-981194dfc831/images/datepicker.png)

### Adding DatePicker in Designer

The **Ribbon DatePicker** can be added at design-time using the **Ribbon Group Floating Toolbar** or **RibbonGroup Items Collection Editor**. Also, you can customize the look of the Ribbon DatePicker by using the **Ribbon DatePicker Floating ToolBar** or editing the properties in the **Properties** window. Refer this [topic](/componentone/docs/win/online-ribbon/concepts/designtimesupport/floatingtoolbar) for more information on floating toolbars.

This image below shows the floating toolbar of DatePicker.

![Floating toolbar](https://cdn.mescius.io/document-site-files/images/5560dc72-88a5-4eeb-a384-981194dfc831/images/dp_ft.png)

### Adding DatePicker through Code

The date picker item can also be added to the **C1Ribbon** control through the code using the <span data-popup-content="This class is available in \u003ca href=\u0022/componentone/docs/win/online-ribbon/\u0022\u003e.NET\u003c/a\u003e and \u003ca href=\u0022/componentone/docs/win/online-ribbon/\u0022\u003e.NET Framework\u003c/a\u003e." data-popup-title="RibbonDatePicker" data-popup-theme="ui-tooltip-green qtip-green">RibbonDatePicker</span> class. This is depicted in the code below:

```vbnet
' Add DatePicker ribbon item
Dim datePicker As RibbonDatePicker = New RibbonDatePicker()
datePicker.Format = "yyyy/MM/dd"
formatGroup.Items.Add(datePicker)
```

```csharp
// Add DatePicker ribbon item
RibbonDatePicker datePicker = new RibbonDatePicker();
datePicker.Format = "yyyy/MM/dd";
formatGroup.Items.Add(datePicker);
```