# Web App Icons — Progressive Web Apps

Source: https://www.geekswithgeeks.com/hi/pwa/pwa-web-icons

> PWA installation और home screen display के लिए web app icons को create और optimize करें।

## Icon Requirements

PWA installation के लिए कम से कम 192x192 और 512x512 PNG icons प्रदान करें। Icons को home screens, app switchers और loading screens पर use किया जाता है। Text और important details के लिए safe areas के साथ square formats का उपयोग करें।

## Manifest Icon Configuration

Manifest.json में अलग-अलग contexts के लिए purpose field के साथ icons को configure करें।

```json
"icons": [
  {
    "src": "/images/icon-192.png",
    "sizes": "192x192",
    "type": "image/png",
    "purpose": "any"
  },
  {
    "src": "/images/icon-512.png",
    "sizes": "512x512",
    "type": "image/png",
    "purpose": "any"
  },
  {
    "src": "/images/icon-maskable-192.png",
    "sizes": "192x192",
    "type": "image/png",
    "purpose": "maskable"
  }
]
```

Output:

```
Icons properly configured for installation and display across devices.
```

## एक आम गलती

Icons के लिए transparent backgrounds का उपयोग न करें—वे different platforms पर गलत display हो सकते हैं। Solid colors का उपयोग करें या maskable versions प्रदान करें।

## Icon Design Best Practices

सभी devices और contexts पर काम करने वाले adaptable, scalable icons बनाएँ।