> For the complete documentation index, see [llms.txt](https://palo-alto.presidiocreative.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://palo-alto.presidiocreative.com/theme-settings/settings/swatches.md).

# Swatches

{% hint style="info" %}
Our companion app for Palo Alto, [Presidio+](https://presidiodev.com/presidio-plus), simplifies setting up swatches.We created Presidio+ help setup advanced features such as swatches. It creates metafields automatically and guides you through setup.The app is free during Early Access and swatch integrations will always remain free. Presidio+ users also benefit from access to a premium support inbox.​[​​](https://presidiodev.com/install-presidio-plus)

[![](https://891064830-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fz8oqtXqtdhOM4CxRzekr%2Fuploads%2FxgiNDu8FfNv9x8HBhqd3%2Fimage.png?alt=media\&token=239f75fb-b8b7-42e7-99fc-a67a0b36a3f5)](https://apps.shopify.com/carbon)
{% endhint %}

Under swatches, you can toggle color swatches and enable them to be shown on hover.

<figure><img src="https://891064830-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fz8oqtXqtdhOM4CxRzekr%2Fuploads%2FrJXWDdBEFWazeqyXRneh%2Fswatches-theme-settings.gif?alt=media&amp;token=232bd606-9933-4ba8-a9b2-54c3d4fe63d7" alt=""><figcaption></figcaption></figure>

<table><thead><tr><th width="192.90618896484375">Settings</th><th width="104.86810302734375" align="center">Type</th><th>Description</th></tr></thead><tbody><tr><td>Type</td><td align="center"><code>select</code></td><td>Choose the type of swatch functionality used in your store: <code>Theme</code>, <code>Native</code>, or <code>None</code>.</td></tr><tr><td>HEX codes and files</td><td align="center"><code>textarea</code></td><td>Set custom color swatch values.</td></tr><tr><td><strong>Appearance</strong></td><td align="center"></td><td></td></tr><tr><td>Style</td><td align="center"><code>select</code></td><td>Controls the shape of the swatch elements. Optional: <code>Circle</code> or <code>Rectangle</code>. <a href="https://palo-alto.presidiocreative.com/products/palo-alto-product-pages/custom-color-swatches">Learn more</a></td></tr><tr><td>Metaobject type</td><td align="center"><code>text</code></td><td>Set a custom siblings metaobject.</td></tr><tr><td>Show images</td><td align="center"><code>checkbox</code></td><td>Display product images or swatch colors.</td></tr></tbody></table>