> For the complete documentation index, see [llms.txt](https://manual.bubble.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://manual.bubble.io/help-guides/design/elements/web-app/input-forms/text-and-numbers.md). # Text and number input elements (web) Text and number inputs let users type text and numbers into your app. Learn how the input element's content formats work, and when to use the multiline input or Rich Text Editor. Text and number inputs let your users provide their own text strings and numbers to your app, which can then be saved in the database or used in other ways. There are a few different elements that are useful in various scenarios, and those elements can be set up to handle different kinds of formatting and user experiences. ## Input {% hint style="info" %} This is the user manual article on the **Input** element, which gives an overview of how the element works. If you want the technical reference that describes all the properties of this element, check out the reference entry: **Reference:** [Input element](/core-resources/bubble-elements/element-properties/web-element-properties/input-form-properties/input-element.md) {% endhint %} Input elements are used for single-line plain text, but they allow you to specify a content format from a wide range of different options. The *Field type returned* in the list below specifies what kind of database field format the input will return.
How Bubble stores text formatting Bubble uses a markup language called BBCode to store text formatting such as bold, italics, and bullet points. The BBCode is generated and applied automatically as you add formatting to your text. BBCode is simpler and safer to use than HTML because it has more limited capabilities and only allows a select number of tags. This stops your users from being able to upload malicious code, such as CSS or JavaScript, that might break the app. **External link:** [Guide to BBCode](https://www.bbcode.org/how-to-use-bbcode-a-complete-guide.php)\ **External link:** [BBCode tags reference](https://www.bbcode.org/reference.php) ### I want to use HTML instead Sometimes it's useful to be able to store formatted text as HTML, such as when you want to pass formatted text to an email sending service that only supports this format. None of the built-in Bubble text editors supports HTML formatting, but there are multiple [plugins](https://bubble.io/plugins) that allow you to store text with formatting as HTML instead of BBCode. Searching the Bubble Marketplace for *Rich Text Editor* is likely to give you some results that support this. Regular text elements don't support HTML either. If you want to display text formatted with HTML, you can use the built-in **HTML** element.
{% hint style="info" %} Because of the predictive text functionality on **Android devices**, some content formats involving masks have a slightly different UX. This applies to US Phone, Percentage, Currency, Date, Euro date, and Text (numbers only). On Android devices, the input allows users to type anything and validates the content against the mask only after the user stops typing. This doesn't affect the final data generated by the input. {% endhint %} ### Text The input will accept any text value. **Field type returned:** text
Text input showing the placeholder Jane Doe.

An input with the Text format accepts any text.

### Email The input will only accept text values that are formatted like an email address. **Field type returned:** text
Text input showing the placeholder email@email.com.

The Email format only accepts text formatted like an email address.

### Password The input will accept any kind of text value, but the characters written will be replaced by asterisks. **Field type returned:** text
Text input with its characters masked as asterisks.

The Password format hides each character as the user types.

### Integer The input will only accept whole numbers. Use this when you need to collect numerical values that can later be used for calculations (as opposed to numbers saved as text). You can specify a dynamic minimum and maximum value when this option is selected. **Field type returned:** number
Text input containing the whole number 256.

The Integer format accepts whole numbers.

### Decimal The input will accept any whole number or decimal number. You can specify a minimum and maximum value, as well as the number of decimals to include. You can also set the input to automatically include thousands separators as the user types. This property is only aesthetic and doesn't affect the final value. **Field type returned:** number
Text input containing the decimal number 29.99.

The Decimal format accepts whole and decimal numbers.

### Address A geographic address. With this option, the input automatically validates the address with Google Maps. Note that the input doesn't automatically search for valid addresses as the user types, so the user has to provide an already valid address (for example, by copying and pasting it from Google Maps). If you want the user to be able to see Google Maps search results as they type, you may want to look into using the **Search box** element instead. **Field type returned:** address
Text input containing the address Eiffel Tower, Avenue Anatole France, Paris, France.

The Address format validates the address with Google Maps.

### US phone This input will accept correctly formatted US phone numbers. The value is saved as text.
Text input containing a US phone number formatted as (123) 123-1231.

The US Phone format guides the user to enter a correctly formatted US phone number.

**Field type returned:** text ### Percentage This input will format the user's input as a percentage and accept input such as 20%. Bubble will automatically save it as the numerical equivalent of the percentage. For example, 20% will be saved as the number 0.2 and 150% will be saved as 1.5.
Text input containing the value 25%.

With the Percentage format, a value of 25% is saved as the number 0.25.

**Field type returned:** number ### Currency The input will accept any whole number or decimal number, and it will automatically format the input in the chosen currency, such as *$20*. You can specify a minimum and maximum value, as well as the number of decimals to include. You can also set the input to automatically include thousands separators as the user types. The currency and thousands separators properties are only aesthetic and don't affect the final value.
Text input containing the value $29.99.

The Currency format shows a currency symbol, but the value is saved as a plain number.

**Field type returned:** number ### Date The input will accept any date, but doesn't include time. It automatically formats the input's value as mm/dd/yyyy while the user types, guiding the user to provide the date in the right way. You can specify a given time zone for the input, and Bubble will automatically calculate any offset from the user's current time zone. If no time zone is provided, the user's current time zone will be used. Dates are saved at 12 AM (00:00) on the given date.
Text input containing the date 01/31/1970.

The Date format uses the mm/dd/yyyy pattern.

**Field type returned:** date ### Euro date The input will accept any date, but doesn't include time. It automatically formats the input's value as dd/mm/yyyy while the user types, guiding the user to provide the date in the right way. You can specify a given time zone for the input, and Bubble will automatically calculate any offset from the user's current time zone. If no time zone is provided, the user's current time zone will be used. Dates are saved at 12 AM (00:00) on the given date. The difference between this content format and the *Date* format is purely visual.
Text input containing the date 31/01/1970.

The Euro date format uses the dd/mm/yyyy pattern.

**Field type returned:** date ### Text (numbers only) This input will only accept whole numbers, and the result will be saved as text. This is useful when you want to save numerical values that need to remain exactly as the user typed (without losing leading zeros, for example) and won't be used for any type of calculation, such as international phone numbers, zip codes, and order numbers.
Text input containing the number 256.

The Text (numbers only) format accepts whole numbers but saves them as text.

**Field type returned:** text
Storing numbers as text versus storing them as numbers ### What is the difference between the two? The Bubble database offers two different field types that can both be used to save numerical values: text and number. There are a few scenarios where it makes sense to save a number as a text string: #### When you need to include leading zeros In an integer (or number), a leading zero represents no value and is disregarded when saved to the database. After all, 045 and 45 are the same thing from a mathematical point of view, and the zero only adds confusion and increases the total size of the database. Sometimes leading zeros are necessary. For example, a phone number or zip code might start with a zero, and it must be stored as text to preserve the complete value. #### When you need to pass the data as text Sometimes when you communicate with an external system through an API, that system may expect a numerical value to be passed as text. In that case, it can be useful to store it as text in the database to avoid having to convert it later. ### When to use what **Text** should be used when you're working with numerical values that will remain static and won't be included in any calculations. For example: * Phone numbers * Zip codes * Postal codes * Product and part numbers **Numbers** should be used when you're working with values that may need to be calculated or aggregated, such as: * Year of birth * Age * Counts and totals (such as the number of items in a cart and the cart's total value) * Financial numbers * Enumerated values, such as the values used to represent the days of the week (for example, Sunday = 0 and Monday = 1)
## Multiline input As the name suggests, the **Multiline input** element allows you to set up a text input element that allows for multiple lines of text. Like the regular text input, this element supports plain text only and doesn't provide any custom formatting.
Multiline input containing two paragraphs of placeholder text.

The Multiline input element accepts several lines of plain text.

Use the **Multiline input** element when you need the user to be able to supply multiple lines of text, but you don't want them to be able to add formatting such as bold, italics, and headers. **Field type returned:** text ## Rich Text Editor {% hint style="info" %} The Rich Text Editor is a plugin. It's made by Bubble, but it needs to be installed in your app before you can use it. **Plugin:** [Rich Text Editor](https://bubble.io/plugin/rich-text-editor-1580238841425x582072028873097200) {% endhint %} The Rich Text Editor is another multiline input element that lets users type rich text with formatting such as colors, fonts, bullet points, and links.
Rich Text Editor with a formatting toolbar above a heading and two paragraphs of text.

The Rich Text Editor plugin lets your users add advanced formatting to their text.

### Hidden toolbar The Rich Text Editor element comes with a property that gives it a more minimalistic design, where the toolbar is only visible when you select some text.
Rich Text Editor with a dark floating toolbar shown below a selected word.

With the toolbar hidden, it only appears when the user selects text.

You can also choose to show fewer formatting options than the ones above. The screenshot shows the full suite of available options. ## More ways to learn
Core reference: text input **Reference:** [Input element](/core-resources/bubble-elements/element-properties/web-element-properties/input-form-properties/input-element.md)
Video lessons * [How to use the text input element](https://youtu.be/C7Yg9JbVQsI) * [How to use text transform operators](https://www.youtube.com/watch?v=kmvmYAlrjUk\&t=5s)