Choose a set of colors & font that strongly reflect your brand identity so users can instantly recognize your brand throughout their in-app experience.
You can customize color schemes for up to 11 specific elements in 5 main areas in the app. Click on each area to pick color and check the area affected in the preview screen.
App background
Customize the background color of your app. The color in this area serves as the canvas on which all other elements like text, buttons, images, and icons are displayed. Make sure it is well contrasted with other elements to ensure readability.
Header
This area remains visible on top of the screen as users browse within the app, and is used to display brand & in-app navigation. Make sure its background color is well-contrasted with the color of your logo & icons. You can customize up to 2 elements in this area:
Header background: Customize the background color of your in-app header.
Header icons: Customize the color of icons in your in-app header.
Primary button
A primary button is the button that guides users towards the most important action on the screen, such as “Add to cart”, “Continue”, etc. Make sure it stands out while still aligned with your brand color. You can customize up to 2 elements in this area:
Button background: Customize the background color of your in-app primary buttons & icons when selected in your in-app bottom menu.
Button text: Customize text color in your in-app primary buttons.
Menu
There are two menus in our mobile app: the bottom bar menu, and the side navigation menu — opened when users click on ☰ icon or swipe from the edge of the screen. As menus are for navigation purpose, it is recommended to prioritize readability in this area. You can customize up to 3 elements in this area:
Menu background: Customize background color of your in-app left menu & bottom menu.
Menu text: Customize text color in your in-app left menu & bottom menu
Menu icon: Customize color of icons in your in-app left menu & icons when not selected in your in-app bottom menu.
Product card
A product card is used on homepage & product listing pages to present the following information of a product: thumbnail, name, price, special price & review (if there is). Make sure the colors you set up can make the above details stand out! You can customize up to 3 elements in this area:
Card border color: Customize border color of your in-app product card.
Price: Customize text color for price in your in-app product card.
Special price: Customize text color for price with discounts or variants in your in-app product card.
2. App Font
Choose the most suitable font for each language available on your store. The number of languages displayed here is the number of languages published in your Shopify store. Consider carefully, as your favorite font might not work in another language. For best user experience, go for multilingual fonts that such as Roboto, Poppins, etc.
You can select from our system fonts, or upload fonts used for each language.
System fonts are fonts that are already supported by SimiCart. Once chosen, these fonts will be applied immediately in your demo app, or your live app.
In addition to our system fonts, you can upload a custom font of your choice. The uploaded font will be stored in Uploaded by you section. Please note that only one custom font can be stored at a time. We currently accept Google Fonts in .ttf or .otf file formats.
Click Add new font
Upload a Google font in .ttf or .otf format
Your font has been uploaded successfully in Uploaded by you section.
