I numeri grandi qui sopra sono la risoluzione del tuo display come la riporta il browser, insieme ai numeri di cui sviluppatori e designer hanno davvero bisogno: la dimensione della viewport del browser, il device pixel ratio (quanti pixel fisici si nascondono dietro ogni pixel CSS), il rapporto d’aspetto e la profondità di colore. Ridimensiona la finestra e i valori si aggiornano in tempo reale.
Tieni presente che su telefoni e portatili ad alta densità la risoluzione CSS è diversa da quella di marketing: un portatile “4K” di solito riporta 1920×1080 pixel CSS con un device pixel ratio di 2; qui vengono mostrati entrambi i numeri.
A cosa serve
Sviluppo web
Controlla a colpo d’occhio la viewport reale e il pixel ratio di qualsiasi dispositivo di test: i numeri che le media query CSS vedono davvero.
Assistenza e supporto remoto
Chiedi a un utente di aprire questa pagina e leggere i numeri ad alta voce: più veloce e più preciso che guidarlo nelle impostazioni di sistema.
Verifica del display
Conferma che un monitor stia davvero girando alla sua risoluzione nativa: una causa sorprendentemente comune di schermi sfocati dopo un cambio di cavo o di driver.
Domande frequenti
Perché il mio schermo 4K mostra 1920×1080?
Il sistema operativo usa il ridimensionamento dello schermo. Il browser riporta i pixel CSS; moltiplicali per il device pixel ratio mostrato qui per ottenere i pixel fisici: 1920×1080 con ratio 2 è esattamente 3840×2160.
Cos’è il device pixel ratio?
Il numero di pixel fisici dello schermo per ogni pixel CSS. Ratio 1 è un monitor classico, 2 è Retina/HiDPI, e i telefoni di solito vanno da 2,5 a 4.
Cosa significa il rapporto d’aspetto (ad esempio 1,78)?
Il rapporto d’aspetto è la larghezza dello schermo divisa per l’altezza. 1,78 è la forma decimale di 16:9, il formato widescreen standard; 1,60 è 16:10, e i monitor ultrawide mostrano circa 2,33 (21:9). Indica la forma del display, indipendentemente da quanti pixel ha.
Cos’è la profondità di colore (24 bit)?
La profondità di colore è quanti bit vengono usati per descrivere il colore di ogni pixel. 24 bit significa 8 bit ciascuno per rosso, verde e blu: circa 16,7 milioni di colori, lo standard di quasi tutti gli schermi moderni. I 30 bit (10 per canale) sono usati da alcuni display HDR e professionali per gradienti più fluidi.
Perché la mia viewport è più piccola dello schermo?
La viewport è solo l’area che il browser lascia alla pagina web, quindi è quasi sempre più piccola dello schermo intero: le schede del browser, la barra degli indirizzi e i segnalibri occupano spazio in alto, la barra delle applicazioni o il dock del sistema ne prendono altro, e la finestra potrebbe non essere massimizzata. Massimizza la finestra o premi F11 per lo schermo intero e la viewport cresce verso la dimensione CSS dello schermo.
Questa pagina invia i miei dati da qualche parte?
No: i valori vengono letti e mostrati localmente dal tuo browser. Nulla viene trasmesso o memorizzato.