> 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/getting-started/core-features-overview.md).

# Core features overview

***

## 🔹 [Variant Display (Shopify variants-based)](/swatch/variant-display/auto-image-swatch.md)

OPTIS Color Swatch reads your existing **Shopify product variants** (such as Color or Size) and converts them into visual swatches / buttons / dropdown menus

* Works directly with Shopify variants (no new variants are created)
* Allows swatches to be displayed on:
  * Product pages
  * Collection pages

## 🔹 [Product Group (Combine listings)](/swatch/product-groups/show-separate-products-as-variants-with-product-groups.md)

Product Group lets you group multiple products into a single variant-like experience.

* Each product acts as a variant option
* Clicking a grouped option redirects customers to the corresponding product page
* Useful when each color or style is a separate product in Shopify

## 🔹 [Variant Images](/swatch/variant-images/show-images-per-variant.md)

Controls how product images are shown based on the selected variant.

* Updates the product gallery when a variant is selected
* Displays only images assigned to the selected variant
* Improves visual clarity and user experience

## 🔹 [Styling](/swatch/styling/styling-overview.md)

Customizes the appearance of variant displays across your store.

* Adjust size, alignment, colors, spacing, and visibility
* Applies globally to all enabled displays
* Can be updated anytime without affecting product data

## 🔹 [Global Settings](/swatch/global-settings/global-settings-overview.md)

Controls global behaviors and advanced appearance settings for your store.

* Customize how [**out-of-stock**](/swatch/global-settings/out-of-stock-display.md) and [**non-existent**](/swatch/global-settings/non-existent-display.md) variants are displayed
* Turn on a store-wide [**Auto sold-out badge**](/swatch/global-settings/auto-sold-out-badge.md)
* Enable or disable **tooltips**
* Add [**custom CSS**](/swatch/global-settings/custom-css.md) for advanced styling needs