# Social Icon (Standalone)

### Walkthrough

#### Step 1: Add the Social Icon

1. Click the **+ Add Component** button.
2. Search for **Social Icon** and drag it onto your screen.

<figure><img src="https://3467607506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LhGHkPsv15svPIU5I7C%2Fuploads%2F8c9mBmerq8Xlv30LOoJ4%2FScreenshot%202026-02-26%20at%205.42.10%E2%80%AFAM.png?alt=media&#x26;token=02c9121f-edc4-46e5-9a49-1b67bf91bc7c" alt="" width="563"><figcaption></figcaption></figure>

#### Step 2: Configure the Icon

1. Select a **Platform** from the dropdown.
2. Add a **Link** (destination URL).
3. Set a **Click Action** (action triggered on tap).
4. Adjust the **Size** as needed — this is independently controllable, unlike icons in the Strip.

<figure><img src="https://3467607506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LhGHkPsv15svPIU5I7C%2Fuploads%2FpT4iOl62lNuuwrlRCr1U%2FSS5.gif?alt=media&#x26;token=d7ad13a0-0906-4d9b-b62c-0e3e630e4908" alt="" width="563"><figcaption></figcaption></figure>

You can also configure:

* **Use Platform Brand Colors** — Toggle ON to apply the official brand color automatically
* **Icon Color** — Set a custom color (only available if brand colors are OFF)

#### Step 3: Use Custom Platform (Optional)

Set **Platform → Custom** to unlock additional options:

* **Font Awesome icon name** — Enter the icon name (must match exactly)
* **Material icon** — Select a Material Design icon
* **Uploaded image** — Use your own image as the icon
* **Image rounding** — Control the corner radius of uploaded images
* **Custom icon color** — Set the color for custom icons

<figure><img src="https://3467607506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LhGHkPsv15svPIU5I7C%2Fuploads%2FfxW7YiGK5lF8pBMgIuiC%2FScreen%20Recording%202026-02-26%20at%205.59.55%E2%80%AFAM.gif?alt=media&#x26;token=9669ab00-5ef7-4952-949d-5be4e7665c7d" alt="" width="563"><figcaption></figcaption></figure>

{% hint style="warning" %}
Font Awesome icon names must match exactly. Do not include the `fa-` prefix. Only Free Font Awesome icons are supported.
{% endhint %}

### 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!

Do you have a tutorial or help doc request? [Let us know!](https://ideas.adalo.com/tutorial-requests)