> For the complete documentation index, see [llms.txt](https://docs.globo.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.globo.io/product-variant-swatch/configure-swatch-style.md).

# Configure swatch style

- [Choose swatch type](https://docs.globo.io/product-variant-swatch/configure-swatch-style/choose-swatch-type.md): We offer various types to display variant options. You can choose from the options below to customize how the variants appear.
- [Set color HEX code for each value](https://docs.globo.io/product-variant-swatch/configure-swatch-style/set-color-hex-code-for-each-value.md): Use color hex as swatch, you can setup up to 2 color codes for the same variant option value.
- [Use custom image for each value](https://docs.globo.io/product-variant-swatch/configure-swatch-style/use-custom-image-for-each-value.md)
- [Use image of product variant](https://docs.globo.io/product-variant-swatch/configure-swatch-style/use-image-of-product-variant.md)