Overview
In the Tab Bar Icons section, you can upload custom icons for your mobile app’s navigation (iOS and Android), including both active and passive states. This applies to the Home, Rewards, Order, More, and Scan to Pay tabs. Multiple file formats are supported, and you can update the icons at any time, as no new app build or store submission is required for the changes to reflect in the live apps.
Prerequisites
It's recommended to collect icon files from the client. If no custom icons are uploaded, the app will display the default icons instead.
There are no strict technical prerequisites - icons can be uploaded at any time, as long as the file format and size meet the requirements. However, it’s recommended to upload the desired icons before the launch to ensure they load properly and display as expected in the app.
Supported icon formats: JPG, JPEG, PNG, SVG, WEBP, GIF
Supported size: up to 2 MB
Limitations
No big limitations except in sizing and supported formats. However, we advise you to test if the uploaded icons load properly
Tab Icons setup
There are 5 tabs for which we can set active and passive icons state: Home, Rewards, Order, More, and Scan to Pay. The active state of an icon is how it appears when the tab in the mobile app is selected, while the passive state is its default look when the tab is not in use.
To set the tab icons, log into the client's dashboard and in the left sidebar,
Select Design
Select Mobile App
Select Tab Bar Icons
Select the tab for the icon you want to set
Upload a file or drag & drop it into the field. If the format and size requirements are met, you will be able to proceed
Select the Save button
You can upload both the active and passive icon states for a tab at the same time, and there is no need to upload them one by one. However, you cannot switch between tabs and upload icons for multiple tabs before saving. Each tab's icons must be uploaded and saved individually. After uploading icons for a tab, make sure to click Save to apply the changes.
Remove or Replace Icons
If you want to remove the icons,
Navigate to the Tab bar icons
Find the Icon you want to remove
Select the X (remove) button
Select the Save button
Verification Steps
To ensure you can upload the new icons for the tabs
Navigate to the Tab Bar icons section
Try to add icons and upload the icons
Ensure you can see them uploaded
Try to upload an icon in a format that is not supported, and, make sure you see the error message, and the icon can be uploaded
Try to upload an icon that is more than 2MB in size ,and make sure you see the error message and the icon can be uploaded
To ensure the new icons you uploaded are loading on the mobile apps,
Download or access the client’s app for both iOS and Android versions
Open both apps using either:
A physical device, or
A mobile emulator
Tap through each navigation tab (e.g., Home, Rewards, Order, Scan to Pay, More) to:
Trigger both active (selected) and inactive (unselected) icon states
Verify that the correct icons appear and display properly
If any icons fail to load or appear distorted:
Try uploading a different set of icons
This helps determine whether the issue is:
With the original icon files, or
With the uploader or the way the app renders the icons
Support & Escalation Path
If the icons do not load or can't be uploaded, and their size and format meet the requirements, and you have run additional verification steps described above. If the issue is persistent, submit a bug request