> For the complete documentation index, see [llms.txt](https://oranthemes.gitbook.io/nimbus-theme/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://oranthemes.gitbook.io/nimbus-theme/theme-settings/product-cards.md).

# Product cards

{% hint style="success" %}
**Steps:** 

1. In the theme editor (**Customize**), click **Theme settings**
2. Locate **Product cards**
3. Make necessary changes
4. **Save**
   {% endhint %}

<figure><img src="/files/0Oiizfn9QPenfC21z21k" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/QS5kkSzYU9MbfQGNmBY8" alt=""><figcaption></figcaption></figure>

* **Show vendor** - Display vendor on the product card

* **Show secondary image on hover** - Display the second product image when hovering over the product image

* **Show quick buy** - To allow customers to preview detailed product information without visiting the product page

* **Show product rating** - Display the product's rating

* **Color type**  - Display : Color swatch, Count, Variant image, Native color swatch

* **Product Image size** - Determines the aspect ratio of the product card images.

  * Adapt to image
  * Square (1:1)
  * Portrait (3:4)
  * Landscape (4:3)
  * Landscape (5:3.5)
  * Wide (16:9)

* **Media fit** - Display Fill or Contain of product card image

* **Product info alignment** - feft, center, right

`Badges`

* **Sale badge type** - Choose type with Sale, Save amount, Save percentage
* **Badge position**

`Product labels`

<figure><img src="/files/U65G6iAo9tBpfDldXzJN" alt=""><figcaption></figcaption></figure>

* Theme settings > Product Card > Product Labels:

Use product tags to display labels on product cards.

<figure><img src="/files/jiHy3VbIz8xfg33Snb4w" alt=""><figcaption></figcaption></figure>

In admin product&#x20;

<figure><img src="/files/ADXT6rlMWshtIMKYF2O0" alt=""><figcaption></figcaption></figure>