Détecteur de Taille d'Écran
Détectez instantanément la taille de votre viewport et la résolution d'écran. Les dimensions se mettent à jour en temps réel lors du redimensionnement. Gratuit, 100% dans votre navigateur.
Référence
Viewport vs résolution d'écran — quelle est la différence ?
Le viewport est la zone visible d'une page web à l'intérieur de la fenêtre du navigateur, mesurée en pixels CSS (window.innerWidth × window.innerHeight). Il change lorsque vous redimensionnez le navigateur ou ouvrez les DevTools. La résolution d'écran est le nombre total de pixels de votre écran physique (screen.width × screen.height) — elle est fixée par votre matériel et vos paramètres d'affichage. Pour le design web responsive, c'est le viewport qui compte — il détermine quelles media queries et breakpoints CSS sont actifs.
Qu'est-ce que le ratio de pixels de l'appareil (DPR) ?
Le Device Pixel Ratio (DPR) indique combien de pixels physiques (matériels) correspondent à un pixel CSS. Un DPR de 1 signifie un mappage 1:1 (écrans standard). Un DPR de 2 signifie un écran Retina/HiDPI — chaque pixel CSS est rendu avec 4 pixels physiques (2×2), produisant du texte et des images plus nets. Un DPR de 3 est courant sur les smartphones haut de gamme. Cela importe pour : servir des images @2x/@3x aux écrans à DPR élevé, comprendre pourquoi les captures d'écran sur les écrans Retina font le double de la résolution attendue, et déboguer les problèmes de mise en page apparaissant uniquement sur certaines valeurs de DPR.
Cas d'utilisation de la détection d'écran
Test de design responsive — vérifiez que les breakpoints CSS se déclenchent aux bonnes largeurs de viewport sans ouvrir les DevTools. Rapports de bugs — partagez les dimensions exactes du viewport, la résolution d'écran et le DPR lors du signalement de problèmes d'affichage aux développeurs. Planification de captures d'écran — connaissez les dimensions exactes avant de prendre des captures pour la documentation ou les fiches d'app stores. Dimensionnement de publicités et bannières — vérifiez que les dimensions du viewport correspondent aux tailles d'emplacements publicitaires requises.
Confidentialité
Les dimensions sont lues localement depuis les API de votre navigateur. Aucune donnée n'est envoyée à un serveur.