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