Skip to main content

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**