The first seconds decide whether your app feels like an app: the icon on the home screen, the launch screen, and colors that match your site. All three are set in the Configuration tab, and a new build applies them.
App icon
Upload a square PNG of 512×512 pixels, or let the AI generate one when you launch. We use it for the app icon on Android, iOS and desktop, and for the store listing.
- Keep the logo centered, with some margin: Android may crop the icon to a circle.
- Use a plain background rather than transparency.
- If the build stops on an icon error, upload a square PNG and relaunch.
Launch screen
| System | What people see |
|---|---|
| Android | Your logo, held for up to about 3 seconds while your site loads |
| iOS | Your logo, centered on your primary color, for builds since 31 October 2026. Then a blank page until your site loads |
| Android TV | The same as Android, plus a TV banner |
| Desktop | Your site opens directly in its window |
The launch screen only stays for a short moment, so the speed of your first page matters more than the picture. A fast home page is the best launch screen.
Colors and theme
By default, the app takes its colors from your website. You can also set them yourself in the Shell Designer, with one set for light mode and one for dark mode:
- Primary color, and the text color on top of it
- Background and surface colors
- Active tab, inactive tab and tab bar background
- Status bar color
- Corner radius of the side menu
Dark mode
The native shell follows the phone's setting. If your site is always dark, turn on Force dark mode so that the shell doesn't show a white header above a dark page. This only affects the native parts: your website keeps its own theme.
Status bar
The status bar style sets the color of the clock and battery icons: auto, light or dark. If you need it to change from page to page, the status bar plugin does that from JavaScript.
Logo in the header
You can add a separate logo for the header in the Shell Designer, as a PNG. It takes priority over your icon inside the app, including on the launch screen.
Check before you build
The preview next to the settings shows your navigation and colors. It can't show hidden site elements, because your site is loaded from another address there. The test build or a real build is the final check.
Only paid builds use your own logo. The free test build carries the SaasToStore logo.