# Date, Time and Currency Formatter

When creating applications, it's often necessary to display dates, times and currencies to users in a format that's easily understandable. This feature allows us to convert dates and times from ISO format to a more human-readable format and converts numerical data into a currency format, ensuring that currency symbols, decimal separators match the conventions familiar to the user.

{% hint style="info" %}
**What is an ISO format?**\
\
**ISO 8601** is an international standard covering the worldwide exchange and communication of date and time-related data.

**ISO 4217:2015** specifies the structure for a three-letter alphabetic code and an equivalent three-digit numeric code for the representation of currencies.\
\
The most common ISO Date Format yyyy-MM-dd — for example, "2000-10-31". \
The most common ISO Date Time Format is yyyy-MM-dd'T'HH:mm:ss. SSSXXX — For example, "2000-10-31T01:30:00.000-05:00"\
An ISO currency example, The US dollar is represented as USD and Euro is represented as EUR.
{% endhint %}

## :point\_right: The tags

**📍 Where to add the tag:** A text element.

### Date and Time

Converts an IOS format to specific date and time formats.

```
[format:date:short:<value>] 31/01/2024
[format:date:medium:<value>] Jan 31, 2024
[format:date:long:<value>] January 31, 2024 at time X
[format:date:time:<value>] 11:30
```

If you're binding the text, use:

```
[format:date:short] 31/01/2024
[format:date:medium] Jan 31, 2024
[format:date:long] January 31, 2024 at time X
[format:date:time] 11:30
```

Example: \
\
For the date `2024-01-31` or `2024-01-31T10:30:00Z`, annotate it with <mark style="color:red;">`[format:date:medium:2024-01-31T10:30:00Z]`</mark> to display it as `Jan 31, 2024`.

### Currencies

Converts a number from API into a selected currency. All ISO currency format with 3 letters are supported.

```
[format:currency:<EUR|USD…>:] 
```

Example:&#x20;

For the amount 2500.5, annotate it with <mark style="color:red;">`[format:currency:USD]`</mark> to display it as `2.500,5 US$`

## :floppy\_disk: Example design file

{% embed url="<https://www.figma.com/community/file/1350143268643068761>" %}

Your feedback is valuable to us. If you have any suggestions or questions, please don't hesitate to reach out to us in the [community](https://community.bravostudio.app/home).


---

# 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.bravostudio.app/bravo-tags/components/date-time-and-currency-formatter.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.
