> For the complete documentation index, see [llms.txt](https://mpithemes.gitbook.io/unicorn-shopify-theme/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://mpithemes.gitbook.io/unicorn-shopify-theme/dynamic-theme-sections/blocks/header/icon.md).

# Icon

**Spacing above**\
Adjust the distance above the icon using a scale from 0 to 60 pixels.

**Placement**\
Choose where the icon is displayed within the section.

* **"Default"**. Displays in its default position based on the layout.
* **"Bottom"**. Places at the bottom of the section.
* **"Bottom on mobile"**. Places at the bottom of the section on mobile devices only.
* **"Bottom on tablet"**. Places at the bottom of the section on tablet devices only.

**Icon SVG**\
The field is designed to link SVG icons that come with the theme or paste HTML to display a custom SVG icon:

* To display the built-in theme graphics, add an icon name to the field. Learn how to use the theme SVG icons [<mark style="color:blue;">here</mark>](/unicorn-shopify-theme/svg-icons.md#built-in-theme-svg-icons).
* Use the provided field to paste the HTML code of your custom SVG icon. Refer to the following [<mark style="color:blue;">help page</mark>](/unicorn-shopify-theme/svg-icons.md#integrate-custom-svg-icons-into-the-theme) for step-by-step instructions on the required modifications.

**Icon image**\
Optionally use an image instead of an SVG icon.\
Connect an image using the source selector. An image can be added from the store library or uploaded from your device.

**Icon color**\
Changes the icon color. Works for SVG icons.
