# Markdown Renderer

## Before you begin

* Make sure to know the basics of markdown (<https://www.markdownguide.org/basic-syntax/>).
* A full specification of available styling options can be found [here](https://github.com/iamacup/react-native-markdown-display#syntax-support).
* You do not need a paid Adalo plan to use the feature

## Walkthrough

{% tabs %}
{% tab title="Simple" %}
**1.)** While in your Adalo app, click the big plus sign <img src="https://3467607506-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LhGHkPsv15svPIU5I7C%2F-MfE_AQhM8BcVaFsjCay%2F-MfEekjmLFwlx6oPUUw0%2Fadd%20button.png?alt=media&#x26;token=756245fd-14cc-4e4d-bf6e-22e4703663ba" alt="" data-size="line"> in the top left corner

**2.)**  Scroll down to the **Marketplace** section and click **Explore Marketplace**

**3.)**  Find **Markdown Renderer** in the component list and click **Install**

**4.)** Back in the components list, enter **Markdown Renderer** in the search bar, then click and drag the Markdown Renderer component onto the desired screen

**5.)** In the **Markdown formatted Text** input field, you can enter the markdown text that should be displayed in your app.&#x20;
{% endtab %}
{% endtabs %}

## Example

![](https://3467607506-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LhGHkPsv15svPIU5I7C%2F-MgpMjMzRoUJI_faZLka%2F-MgpMwXteQJrphyYA3iO%2Fmd_app_example.png?alt=media\&token=e0bf1f90-b17d-41f9-b672-5016d5aa7215)

## Learn More&#x20;

* You can also render magic text by clicking the [Magic Text](https://help.adalo.com/component-basics/inserting-dynamic-text) icon.

## Help

If you need additional help with this article, you can always ask in our[ community forum](https://forum.adalo.com/)! Be sure to paste the link to this article in your post as well!