Color Override

1. Product Filter (Backdrop)

The feature is used to set the color for the Product Filter of Product Backdrop.

**Requirement**:

Enable **Product Backdrop** to see the applied config.

    1. Go to **Features** > **General** > **Product List**
    2. Turn on **Enable Product Backdrop**
    3. Click **Update**

Setup on App Builder:

• Background:
  • System color: should be white color
  • Primary color: set the Product Filter background color as the Main Color of Theme & Logo feature
  • Light color: would be the same as the Primary Color Light of Theme & Logo feature
  • Color (selection)
  • Background Opacity
• Label:
  • Accent Color: would be the same as the Secondary Color of Theme & Logo feature
  • System Color: should be white color
  • Color (selection)

2. Stock Status

Change the color of Stock Status text on each Product Cards which are displayed on the app.

**Requirement****:**

Enable **Show Stock Status** on **Product Card Customize** to see the applied config.


    ![](/notion_imgs/1690865104.png)

3. Rating Color

This feature mainly sets the color of Linear Progress of Review on Product Detail screen.

Setup on App Builder:

• Primary Star: set color for the selected stars
• Border Star: set color for the unselected stars
• Primary Linear Progress: set color for the Linear Progress bars
• Background Linear Progress: set color for the background of Linear Progress bars

**Requirement:**

Enable **Review** on **Product Detail** screen to see the applied config:

1. Go to **Design** on the left menu
2. On simulator, click on a product
3. On the right panel, turn on **Enable Review**
4. Click **Update**