Color Override

1. Product Filter (Backdrop)

What it is:

The Product Filter (Backdrop) controls the background and text colors of the product list and product filter screens.

How to use:

1. Open your app on FluxBuilder.
2. Go to Features → General → Product List
3. Turn on the option Enable Product Backdrop.
4. Go to Features, in Branding, open Color Override.
5. In the Product Filter (Backdrop) section, you can set:
   • Background: choose System / Primary / Light / Custom Color.
   • Background Opacity: drag the slider to make it more solid (1.0) or transparent (0.0).
   • Label: choose the text color (Accent / System / Custom Color).
6. Click Save to confirm.

Tips:

• Use a soft background color so products stand out.
• Keep label text color high contrast for readability.

---

2. Stock Status

What it is:

The Stock Status colors controls the color of the product status text inside the app.

How to use:

1. Open your app on FluxBuilder.
2. Go to Features → Branding → Color Override.
3. In the Stock Status section, update colors for:
   • In Stock → recommended Green.
   • Out of Stock → recommended Red.
   • Backorder → recommended Yellow or Orange.
4. Click the color box, select from the picker or enter HEX code, then Save.

Tips:

• Use universal colors (Green = available, Red = not available).
• This makes it easier for customers to understand at a glance.

---

3. Rating Colors

What it is:

The Rating Colors customize stars and rating bars color in reviews.

How to use:

1. Open your app on FluxBuilder.
2. Go to Features → Branding → Color Override.
3. In the Rating Colors section, you can set:
   • Primary Star → the color of filled stars (usually Gold/Yellow).
   • Border Star → the outline of stars (often Gray or Black).
   • Primary Linear Progress → the main color of the rating progress bar.
   • Background Linear Progress → the background of the progress bar.
4. Choose colors, then click Save.

Tips:

• Gold or Yellow stars look familiar to users.
• Make sure the progress bar matches your brand theme.

---

4. Variant Colors

What it is:

The Variant Colors let you re-set colors for product color attributions.

How to use:

1. Open your app on FluxBuilder.
2. Go to Features → Branding → Color Override.
3. In the Variant Colors section, set colors for product attributes (for example: Blue T-shirt, Red T-shirt).
4. Select a color from the picker or enter a HEX code.
5. Click Save.

Tips:

• Match the variant colors with the real product colors.
• Keep colors consistent across all product listings.