Splash screen / launch screen

The first frame the OS draws over app boot, usually your logo on a brand color, so tapping the icon feels instant instead of frozen.

the loading logo when you tap openthe screen before the screensplashscreenlaunch imagestartup screenapp opening screenboot logothat logo that flashes for a second when the app starts

See it

Live demo coming soon

What it is

The launch screen is the frame the operating system draws for you between the tap and your first rendered UI. You get one on every launch whether you designed it or not; skipping the work just means the OS shows a blank rectangle. It is not your code: iOS renders a static storyboard (or an asset from your Info.plist) before the app process is ready, and Android 12+ animates your app icon out of a solid background via the SplashScreen API. So 'static' is not quite the rule. iOS launch content genuinely is static, Android allows a constrained system-driven icon animation, and neither one will run your logic: no network calls, no auth checks, no branching.

Design it so a fast boot looks like a flicker and a slow boot looks intentional, and keep it dumb. The classic pattern is a centered logo on your brand background, then a short cross-fade into a branded loading screen you actually control, where spinners, skeletons, and auth checks live. Cross-platform stacks (Expo, Flutter, Capacitor) generate both platform assets from one config and give you a hide() call so you decide the exact handoff moment.

Gotchas: do not pad the splash with an artificial delay to show off your logo, since Apple's guidelines want the launch screen to resemble the first real screen and reviewers notice marketing splashes. Launch assets are also aggressively cached by the OS, so a changed splash sometimes only appears after a reinstall, and forgetting to call hide() leaves users staring at a logo forever.

Ask AI for it

Build this in two separate layers, and do not blur them together. Layer one is the native launch screen the OS owns: a centered logo (transparent PNG or vector, max 40% of screen width) on a solid brand-color background, no text, no spinner, no app logic. Generate the iOS launch storyboard and the Android 12+ SplashScreen theme (windowSplashScreen background plus icon), keeping each within what its platform allows, and let it hand off as soon as my first UI renders. Layer two is an in-app loading view I control, styled to match layer one exactly so the transition is invisible: this is the only place that waits on fonts, auth, or initial state, and the only place allowed to show a spinner or skeleton. Route to the real screen from there with a 200ms fade, never on a fixed timer, and make sure a failed load shows a retry rather than sitting on the logo forever.

You might have meant

app iconsafe area notch insetscross platform appapp lifecycleapp review rejection