> For the complete documentation index, see [llms.txt](https://raoufr.gitbook.io/mobile-app-ui-docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://raoufr.gitbook.io/mobile-app-ui-docs/typography/text.md).

# Text

{% hint style="warning" %}
It is possible to pass custom styles directly to the Text component through the `style` prop. However, to maintain consistent typography throughout the app, **it is not recommended to do so**. When needed, you can create a Higher Order Component which wraps the Text component and use that instead. See [Custom Fonts](/mobile-app-ui-docs/typography/custom-fonts.md) for more details.
{% endhint %}

### Example

{% embed url="<https://snack.expo.dev/@rrizk/mau---typography---text>" %}

### Props

| Name      | Type                                                          | Description                                                                             |
| --------- | ------------------------------------------------------------- | --------------------------------------------------------------------------------------- |
| inversed  | boolean                                                       | If true, inverses the color of text.                                                    |
| muted     | boolean                                                       | If true, renders the text as muted.                                                     |
| small     | boolean                                                       | If true, renders the text with small font size.                                         |
| variant   | body1 \| body2 \| caption \| button \| subtitle1 \| subtitle2 | Determines the variant of the text.                                                     |
| font      | primary \| secondary \| string                                | Font family to use. See [Custom Fonts](/mobile-app-ui-docs/typography/custom-fonts.md). |
| italic    | boolean                                                       | Renders the text in italics.                                                            |
| weight    | light \| regular \| semiBold \| bold                          | Weight fo the font.                                                                     |
| alignment | left \| center \| right                                       | Determines the alignment of the text. Can be left, center or right.                     |