# Featured Collection: How to Show Individual Variants in the Product Grid

The "Show individual variants" setting allows you to display each product variant as a separate item in the collection grid, rather than just showing the default product.

### How It Works

When enabled:

* Each variant of a product will appear as its own card in the grid
* If a variant has its own image assigned, that image will be displayed
* If a variant doesn't have a specific image, the product's default image will be used
* The variant title will appear above the product title

### Use Cases

This setting is particularly useful for:

* Products with visually distinct variants (e.g., different colors, patterns, styles)
* Collections where you want to showcase the full range of options available
* Fashion/apparel collections where seeing each color variant is important
* Products where variants have unique images assigned to them

### Example

For a t-shirt product with 3 color variants:

* Without this setting: Shows one grid card with the default t-shirt image
* With this setting: Shows three separate grid cards, one for each color variant

### Notes

* Only variants that are available for purchase will be displayed
* The number of items shown in the grid will multiply based on the number of variants
* Consider adjusting the "Products to show" setting when using this feature to avoid showing too many items

### Best Practices

* Use this setting when variants have distinct visual differences
* Ensure variant images are assigned in your product settings for best results


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://design-packs.gitbook.io/docs/fundamentals/section-tutorials/featured-collection-how-to-show-individual-variants-in-the-product-grid.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
