> For the complete documentation index, see [llms.txt](https://docs.optis.me/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.optis.me/swatch/frequently-asked-questions/how-does-the-optis-swatch-app-work.md).

# How does the OPTIS Color Swatch app work?

The OPTIS Color Swatch app lets you **customize the look and feel** of your **native Shopify product options.**

Instead of using the default dropdowns or buttons from your theme, you can display options as clickable **swatches, buttons, or dropdowns**, right on the product page, and **even on collection pages.**

Plus, you have full control over styling: easily adjust the **color, size, shape, spacing**, and more to **match your brand’s design.**<br>

#### 🖼️ **Image Changing based on option Swatch Selection Behavior**:

Because it works directly with **Shopify variants**, it automatically uses Shopify’s built-in behavior:

When a customer clicks on a swatch (e.g., Color: Red), the **main product image will change** to the image assigned to that variant in your Shopify Products admin.

So essentially, the app keeps the power of Shopify's variant system, but **gives you full control over how it's presented visually**, making it more interactive and easier for customers to browse.
