# Splash screens — Progressive Web Apps

Source: https://www.geekswithgeeks.com/en/pwa/pwa-splash-screens

> Configure splash screens for a polished app launch experience.

## Splash screen purpose

**Splash screens** are shown during app startup while resources load. They provide branding and reduce perceived load time. Configure them in the manifest for iOS and Android.

## Configure splash screen images

Add screenshots field to manifest for splash screen display on iOS and Android.

```json
"screenshots": [
  {
    "src": "/images/screenshot-1.png",
    "sizes": "540x720",
    "type": "image/png",
    "form_factor": "narrow"
  },
  {
    "src": "/images/screenshot-2.png",
    "sizes": "1280x720",
    "type": "image/png",
    "form_factor": "wide"
  }
]
```

Output:

```
Splash screens configured for portrait and landscape orientations.
```

## A common trap

Splash screens should load quickly—keep images under 100KB. Use responsive images for different device sizes.