# Variant swatch style
### Prerequisites \*
Before setting up color swatches, make sure:
* **Your products have variants** (e.g. Color: Red, Blue, Green; Size: X, M, L, XL).
* If newly added variants are not appearing, **sync your product data** in the Globo Swatch app.
Add variants for product
## Choose variant swatch style
* Go to admin GLOBO Color Swatch -> **Dashboard**, in **Options list** -> column "**Display style**" you can choose style swatch each variant and **Save**
## List of available variant style
### 1. Swatch
{% hint style="info" %}
Image or color swatch with hover animation featured
{% endhint %}
### 2. Pill swatch
{% hint style="info" %}
Pre-styled image or color swatch for a compelling design
{% endhint %}
### 3. Swatch dropdown
{% hint style="info" %}
Elaborate the dropdown design with swatches on each option
{% endhint %}
### 4. Variant image dropdown
{% hint style="info" %}
Elaborate the dropdown design with image on each option
{% endhint %}
### 5. Button
{% hint style="info" %}
Text base options with variety of customized button styles
{% endhint %}
### 6. Button without border
{% hint style="info" %}
Plain text without background well suited for a minimal style
{% endhint %}
### 7. Pill button
{% hint style="info" %}
A modern and user-friendly button design for encouraging interaction
{% endhint %}
### 8. Button with price
{% hint style="info" %}
Highlight the price on button with standout style
{% endhint %}
### 9. Dropdown
{% hint style="info" %}
Flexible styling dropdown to fit your brand's look
{% endhint %}
***
## **Advanced settings appearance**
* If you need change more for variant type -> go to GLOBO Color Swatch -> **Appearance page**
* In **Appearance page,** choose type variant you need change setitng and click **set up** button
* You can select the **On product page** or **On collection page** tab to set up separately
