Tailles de viewport Android : Pixel, Galaxy, pliables, DPR et résolution
Comparez viewport CSS, résolution physique, DPR et année de sortie entre Pixel, Galaxy, pliables et téléphones Android populaires. Les valeurs peuvent varier selon l’échelle, l’interface du navigateur et les paramètres système.
État des données : Dernière mise à jour : 2026-02-08 (UTC)
Sources : Pages de spécifications officielles Apple, Google et Samsung
Méthode : Les valeurs iPhone et iPad sont principalement la résolution divisée par le DPR. Le viewport CSS et le DPR Android peuvent varier selon la mise à l'échelle de l'affichage, l'interface du navigateur et les paramètres système.
Réponse rapide : Utilisez ce tableau Android comme plage pratique pour les layouts Pixel, Galaxy, pliables et téléphones populaires ; le viewport CSS final peut changer avec l’échelle et l’interface du navigateur.
Tableau des tailles de viewport
| Modèle | Taille du viewport | Résolution d'écran | DPR | Année de sortie |
|---|---|---|---|---|
| Google Pixel 10 Pro XL | 414 × 921 | 1344 × 2992 | 3.25 | 2025 |
| Google Pixel 10 Pro | 410 × 914 | 1280 × 2856 | 3.125 | 2025 |
| Google Pixel 10 | 412 × 923 | 1080 × 2424 | 2.625 | 2025 |
| Google Pixel 10 Pro Fold (Cover / Main) | 412 × 923 / 692 × 717 | 1080 × 2424 / 2076 × 2152 | 2.625 / 3.0 | 2025 |
| Samsung Galaxy S25 Ultra | 412 × 891 | 1440 × 3120 | 3.5 | 2025 |
| Samsung Galaxy S25+ | 412 × 891 | 1440 × 3120 | 3.5 | 2025 |
| Samsung Galaxy S25 | 360 × 780 | 1080 × 2340 | 3.0 | 2025 |
| Huawei Mate 70 Pro | 411 x 885 | 1316 x 2832 | 3.2 | 2024 |
| Xiaomi 15 Pro | 412 x 914 | 1440 x 3200 | 3.5 | 2024 |
| OPPO Find X8 Pro | 395 x 869 | 1264 x 2780 | 3.2 | 2024 |
| vivo X200 Pro | 394 x 875 | 1260 x 2800 | 3.2 | 2024 |
| Honor Magic7 Pro | 400 x 875 | 1280 x 2800 | 3.2 | 2024 |
| Samsung Galaxy Z Fold6 (Cover / Main) | 323 × 792 / 619 × 720 | 968 × 2376 / 1856 × 2160 | 3.0 | 2024 |
| Samsung Galaxy Z Flip6 | 393 × 960 | 1080 × 2640 | 2.75 | 2024 |
| Samsung Galaxy S24 Ultra | 412 × 891 | 1440 × 3120 | 3.5 | 2024 |
| Samsung Galaxy S24+ | 412 × 891 | 1440 × 3120 | 3.5 | 2024 |
| Samsung Galaxy S24 | 360 × 780 | 1080 × 2340 | 3.0 | 2024 |
| Google Pixel 9 Pro XL | 414 × 921 | 1344 × 2992 | 3.25 | 2024 |
| Google Pixel 9 Pro | 410 × 914 | 1280 × 2856 | 3.125 | 2024 |
| Google Pixel 9 | 412 × 923 | 1080 × 2424 | 2.625 | 2024 |
| Google Pixel 8 Pro | 412 × 921 | 1344 × 2992 | 3.25 | 2023 |
| Google Pixel 8 | 412 × 915 | 1080 × 2400 | 2.625 | 2023 |
| Samsung Galaxy S23 Ultra | 412 × 915 | 1440 × 3088 | 3.5 | 2023 |
| Samsung Galaxy S23+ | 384 × 854 | 1080 × 2340 | 2.8125 | 2023 |
| Samsung Galaxy S23 | 360 × 780 | 1080 × 2340 | 3.0 | 2023 |
| Google Pixel 7 Pro | 412 × 892 | 1440 × 3120 | 3.5 | 2022 |
| Google Pixel 7 | 412 × 915 | 1080 × 2400 | 2.625 | 2022 |
| Samsung Galaxy S22 Ultra | 412 × 915 | 1440 × 3088 | 3.5 | 2022 |
| Samsung Galaxy S22+ | 384 × 854 | 1080 × 2340 | 2.8125 | 2022 |
| Samsung Galaxy S22 | 360 × 780 | 1080 × 2340 | 3.0 | 2022 |
| Google Pixel 6 Pro | 412 × 915 | 1440 × 3120 | 3.5 | 2021 |
| Google Pixel 6 | 412 × 915 | 1080 × 2400 | 2.625 | 2021 |
| Samsung Galaxy S21 Ultra | 384 × 854 | 1440 × 3200 | 3.75 | 2021 |
| Samsung Galaxy S21+ | 384 × 854 | 1080 × 2400 | 2.8125 | 2021 |
| Samsung Galaxy S21 | 360 × 800 | 1080 × 2400 | 3.0 | 2021 |
Comprendre les tailles de viewport
Bases du viewport
- Taille du viewport : La zone visible en pixels CSS que votre site peut utiliser
- Résolution d'écran : Le nombre réel de pixels physiques de l'appareil
- Ratio pixels/appareil (DPR) : Le rapport entre les pixels physiques et les pixels CSS
- Orientation : Les appareils Android supportent les modes portrait et paysage
Considérations de design
- Concevez pour différentes tailles et densités d'écran
- Considérez les différents rapports d'aspect
- Optimisez pour les interactions tactiles
- Utilisez les media queries appropriées
- Pensez aux appareils pliables
Questions fréquentes sur les viewports des appareils
La taille du viewport est la zone en pixels CSS utilisée par votre mise en page, tandis que la résolution d'écran est le nombre de pixels physiques de l'appareil. Ils sont liés par le DPR, mais l'interface du navigateur et la mise à l'échelle peuvent modifier le viewport effectif.
Des valeurs de DPR différentes, la mise à l'échelle de l'affichage système et le comportement du navigateur peuvent produire des largeurs de viewport CSS différentes même quand les résolutions physiques sont proches.
Utilisez ce tableau comme référence pour les appareils réels courants, puis définissez des points de rupture flexibles selon le comportement du contenu, pas selon des modèles spécifiques. Testez les plages clés comme 360, 390, 412, 768, 820, 834 et 1024 pixels CSS.
Les pliables peuvent basculer entre l'écran de couverture et l'écran principal avec des rapports de viewport très différents. Testez les deux états et la rotation, et évitez de coder en dur les mises en page pour une seule largeur exacte.
Nous mettons à jour ces données après les lancements majeurs d'appareils et les changements de spécifications. Vérifiez toujours les cas critiques de production sur de vrais appareils ou des laboratoires de test cloud.