App Icons & Splash — White-Label Branding
Both mobile apps (rider + driver) ship with placeholder art you replace with
your own brand. Asset paths and the icon background colour are env-overridable
in app.config.ts, so a buyer's build injects its own artwork without editing
code — set the env vars (in .env / EAS build profile) or drop replacement
files at the default paths.
⚠️ The default
assets/icon.pngis a placeholder and is identical across the rider and driver apps. Ship distinct, real icons before publishing — app stores reject two apps with the same icon, and users can't tell them apart.
Env overrides (per app: mobile/rider, mobile/driver)
| Env var | Purpose | Default |
|---|---|---|
APP_ICON |
iOS/base app icon | ./assets/icon.png |
APP_ADAPTIVE_ICON |
Android adaptive foreground | ./assets/adaptive-icon.png |
APP_SPLASH |
Splash image | ./assets/splash-icon.png |
APP_ICON_BG |
Splash + adaptive-icon background colour | #ffffff (set to your brand accent) |
APP_NAME |
Display name | Kashvi Ride / Kashvi Driver |
(These sit alongside the existing white-label vars — APP_SCHEME,
IOS_BUNDLE_ID, ANDROID_PACKAGE, EAS_PROJECT_ID — documented in each app's
ENV.md.)
Asset spec
Produce these per app (rider and driver should look related but distinct — e.g. same mark, different accent, or a driver badge):
| File | Size | Format | Notes |
|---|---|---|---|
icon.png |
1024×1024 | PNG, no alpha | iOS icon; square, no rounded corners (the OS masks them). |
adaptive-icon.png |
1024×1024 | PNG with transparency | Android adaptive foreground; keep the mark within the centre ~66% safe zone (the OS crops to circle/squircle/etc.). Background comes from APP_ICON_BG. |
splash-icon.png |
~1284×2778 (or a centered logo on transparent) | PNG | Shown with resizeMode: contain on the APP_ICON_BG background. |
favicon.png |
48×48 | PNG | Web only. |
Tips:
- Set
APP_ICON_BGto your brand accent (matches the in-app welcome gradient, which is already derived from the marketprimaryColor). - Keep the splash mark simple and centered — it renders briefly before the JS loads.
- After replacing assets, run
npx expo prebuild --clean(or a fresh EAS build) so the native projects pick up the new icons.
Generating the set
You only need one high-res square master (1024×1024). Tools like
@expo/image-utils or any icon generator produce the
platform variants. Expo also auto-generates the required iOS/Android icon sizes
from icon.png at build time — you don't hand-cut every density.