Skip to main content
Documentation menu

Apps

Virtual Try-On

Brand basics and saved state

Use Brand basics for the shared look, then choose how a saved item is distinguished. The most useful check is whether a shopper can recognize both a save control and its saved state without guessing.

Set the shared defaults

  1. 1

    Open Display → Brand basics

    Choose Main wishlist icon: Heart, Bookmark or Star. Controls whose icon is set to inherit use this choice. A separately selected Card icon, Header icon or Floating button icon keeps its own shape.

  2. 2

    Set the accent and saved colour

    Enter your main colour in Brand accent color using the colour picker or a hex value such as #1F2937. Set Saved-state color to a distinguishable colour, or clear that optional value to use the accent.

    For example, a charcoal outline before saving and a red saved icon make the state change clear. Check that it is still visible over product photography.

  3. 3

    Style the count badge

    Set Count badge background and Count badge text. Clearing the optional text colour lets the app choose a readable foreground. Open the Product preview to inspect the small count on the access controls.

  4. 4

    Choose Button corners

    Choose Sharp, Rounded or Pill. This is a shared starting style; full-page action buttons also have their own Corners setting.

Understand empty colour fields

Optional fieldWhat an empty value uses
Saved-state colorBrand accent colour.
Header icon colorThe theme header's text colour.
Floating-button backgroundBrand accent colour.
Drawer backgroundWhite.
Drawer textA readable colour for the selected drawer background.
Card saved backgroundSaved-state colour.

An empty field is an automatic choice, not a transparent colour. If one element does not follow a changed accent, inspect that element's explicit colour fields before changing CSS.

Choose how the product button looks after saving

Expand Saved state & branding → Saved state on the product page button. Color the icon only changes the icon while keeping the button quieter beside Add to Cart. Fill the whole button changes the whole saved button. For fill mode, review Text on filled button or clear it for an automatic readable colour.

Card hearts have their own state

Product card hearts fill when saved. The product-button saved-state choice does not switch card hearts to an outline-only saved state.

Edit the credit line

In Saved state & branding, switch Show “Powered by Vensa” badge on or off. When enabled, Branding text lets you change the drawer's credit line. The full-page wishlist does not use this drawer credit.

Verify the changes

  • Save and refresh the storefront, then compare an unsaved and saved product.
  • Check a card on a light photo and a dark photo.
  • Check the header icon and count against your actual header background.
  • Check the drawer or full page on a narrow screen; readable preview colours can still clash with surrounding theme content.

Need help?

Open the chat bubble in the Shopify app, or contact us with your store address and what you are stuck on.