Appearance
Customization: Colors
How color settings work across the app, and how to keep the wishlist on-brand.
Overview
Nearly every wishlist surface — buttons, icons, backgrounds, borders, notifications, and count badges — has its own configurable color, usually with a separate color for its "active" or "saved" state. Colors are set the same way everywhere: a visual picker plus a hex/RGBA text field.
Benefits
- Match the wishlist precisely to your store's brand palette
- Give shoppers a clear visual difference between "not saved" and "saved" states
- Consistent color controls mean no learning curve between settings screens
Where to Find It
Apps ↓ BRIX: Wishlist Plus ↓ Settings ↓ Any feature → Customize ↓ Color fields (in Icon, Appearance, Background, Border, or Text sections)
How to Use
- Open any Customize screen.
- Click a color field to open the visual picker, or type a hex/RGBA value directly.
- Use Reset to return a color to its default if needed.
- Repeat for the "active" or "error" state color where available.
- Check the live preview, then Save.
Available Settings
Color fields appear in these groups across different features:
| Group | Where It Appears |
|---|---|
| Icon color / Icon color (active) | Product grid, product page, and floating buttons; wishlist header icon |
| Background color / Background color (active) | Product grid and product page buttons; floating button |
| Border color | Product page button |
| Text color / Text color (active) | Product page button (label text) |
| Number/badge colors | Wishlist header icon (count badge) |
| Notification text/background colors, and separate error colors | Wishlist Notifications |
Best Practices
- Pick an "active" color that clearly contrasts with the default state — shoppers should instantly recognize saved vs. unsaved items.
- Reuse one or two brand colors across all wishlist surfaces rather than picking a different color per feature, for a cohesive look.
- Check contrast between text and background colors (especially for notifications) to keep messages readable.
Notes
- Some button sections (Background, Border, Text on the product page button) can be turned off entirely so the button inherits your theme's own native styling instead of app-set colors.
- Color changes apply immediately to all shoppers once saved — there's no A/B testing or gradual rollout built in.
Troubleshooting
A color I set doesn't look right on the storefront. Some themes apply their own CSS that can override certain color settings. If this happens, the Custom Code feature can be used to add more specific overrides.
I can't find where to change a specific color. Color options are grouped by section (Icon, Appearance, Background, Border, Text) on each feature's Customize screen — check each section's fields.