# Date Input

## Date Input Overview

A Date Input component is helpful when you want the user of your app to easily select a specific date using the native Android or iOS date picker

![Native Android Date Picker on the left and iOS on the right](/files/-LnTo9AJqy55zEn2QNWQ)

## Getting Started&#x20;

The Date Input component needs no set-up (Woohoo!). Just drag and drop the component into your project. As a bonus, the current date will automatically show up as a label.

When a user of your app taps on the Date Input, it will automatically launch the native Android or iOS date pickers.

## Set the Date Format

You can set the format of the date by choosing an option from the `Style` property. Currently supported styles are:

* YYYY-MM-DD
* MM/DD/YYYY
* M/D/YY
* Month Day, Year
* Mth. Day, Year

![](/files/-MOgFB0c48TarOvYYm61)

## Save the Date

The date that a user selects will show up automatically in the Date Input label but if you want to save the date somewhere to be uploaded later, you'll need to add a block like the one below.&#x20;

![](/files/-MWj1VJ1NuaCUAtxwjLf)

| Event     | Output                                                 |
| --------- | ------------------------------------------------------ |
| Get Date  | Date in whichever format you specify e.g. `YYYY-MM-DD` |
| Get Year  | Year in 4 digit format e.g. `2019`                     |
| Get Month | Numerical month from `1-12`                            |
| Get Day   | Day of the month from `1-31` (depending on the month)  |

## Events

### Date Picked

![](/files/-MWdA1uH__kEF6072Xxp)

## Functions

### Get Date&#x20;

![](/files/-MWdAhGTOQx-WGCokRJs)

### Get Day&#x20;

![](/files/-MWdAiVLU7JxA18syGRC)

### Get Month&#x20;

![](/files/-MWdAjkHYVUIsDwP5zZg)

### Get Year&#x20;

![](/files/-MWdAl-Eu3k3_ZMB3ULP)

### Launch Picker

![](/files/-MWdAm_370RLIyru1RM8)

## &#x20;Properties

### Background Color&#x20;

![](/files/-MWdBEs8JFDeI-7q9HgH)

### Color&#x20;

![](/files/-MWdBG-iE3DAHcDhWeGg)

### Computed Height and Width&#x20;

![](/files/-MWdBH2myOXi1LyF--WG)

### Font Size&#x20;

![](/files/-MWdBIb-SsH7l-Mf5rKG)

### Font Style&#x20;

![](/files/-MWdBJwzuRuLDzob-lpi)

### Font Weight&#x20;

![](/files/-MWdBL5wzfqAlH0f1emE)

### Style&#x20;

![](/files/-MWd9wq8u1YaEPEKSsQb)

### Text Align&#x20;

![](/files/-MWdBMDcmzf_7DoW2ltZ)

### Visible

![](/files/-MWdBNHANpBGuvf1ctSA)


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.thunkable.com/snap-to-place/date-input.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
