> For the complete documentation index, see [llms.txt](https://mpithemes.gitbook.io/triumph/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/triumph/footer/utilities.md).

# Utilities

Displays additional store tools and information, such as localization settings, copyright text, and payment icons.

**Layout on desktop**\
Choose how utility items are arranged on desktop screens:

* **Vertical** – Stacks items in a column.
* **Horizontal** – Displays items in a row.

**Alignment on tablet and mobile**\
Controls how utility items are aligned on smaller screens to the left, center, or right.

**Country/region selector**

{% hint style="warning" icon="alarm-exclamation" %}
**Note!** Displays a country/region selector (requires store market setup).\
Read more information in the '[<mark style="color:$primary;">Markets</mark>](https://help.shopify.com/en/manual/markets-new)' help page.
{% endhint %}

> *Required steps:*
>
> 1. Apply settings in *Shopify admin -> Settings -> Markets*.
> 2. Turn on the optionin the current section.

**Language selector**

{% hint style="warning" icon="alarm-exclamation" %}
**Note!** Displays a language switcher (requires a translation app).\
Read the '[<mark style="color:$primary;">Localization and translation</mark>](https://help.shopify.com/en/manual/international/localization-and-translation)' help page for the details.

**Recommended app:** Shopify Translate & Adapt app
{% endhint %}

> *Required steps:*
>
> 1. Install the app.
> 2. Enable the option in the current section.

<figure><img src="https://4126621502-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkpREZeVZogNLjx09og4O%2Fuploads%2FBLDXu3gjx3zKyzxR6bSm%2Ffooter_utilities.png?alt=media&amp;token=6f546b5d-c713-45d8-bac4-311b02bb6311" alt=""><figcaption></figcaption></figure>

#### Colors

**Background**\
Sets the background color of the utilities area.

**Text**\
Controls the text color.

**Link hover**\
Changes the color of links when hovered.

#### Localization colors

The colors are applied to the *Country/region* and *Language* selectors.

**Button hover background**\
Sets the background color of the selectors on hover.

**Button hover text**\
Controls the text color of selectors when clicked.

**Dropdown background**\
Sets the background color of selectors.

**Dropdown links**\
Controls the color of links inside the selectors.

**Dropdown links active**\
Sets the color of the currently selected or active item.

**Dropdown links active background**\
Controls the background color of the active sector.

**Country filter background**\
Sets the background color of the country search/filter field.\
*Note: The filter appears automatically if more than 8 countries are available in the selector.*

**Country filter text**\
Controls the text color inside the country filter field.

**Country filter border**\
Sets the border color of the country filter field.

<figure><img src="https://4126621502-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkpREZeVZogNLjx09og4O%2Fuploads%2FLYuEXoznpNMrqPJm1XP3%2Ffooter_utilities%20colors.png?alt=media&amp;token=edcdb754-8f9a-46dc-be22-ebd81a0efba8" alt=""><figcaption></figcaption></figure>