Come misurare i pixel sullo schermo in Windows

Risposta breve: Windows non ha un righello su schermo. I DevTools misurano dentro il browser, gli editor di immagini dentro la loro tela — per tutto il resto usa uno strumento gratuito come Righello dello schermo: allinea il bordo zero, trascina il marcatore, leggi la distanza in pixel e posa la finestra fantasma sopra l'interfaccia che stai misurando.

Perché misurare sullo schermo

  • Scrivere CSS: quella barra laterale è 320 px o 300 px? Misura invece di indovinare, poi imposta il breakpoint correttamente.
  • Accessibilità: le aree toccabili dovrebbero essere almeno 44×44 px — il righello verifica entrambe le dimensioni in pochi secondi.
  • Controllo di design: confrontare le spaziature di una bozza con la pagina dal vivo, al pixel di cui discutono i designer.
  • Presentazioni e stampa: verificare quale area può occupare un'immagine alla risoluzione del proiettore.
  • Curiosità con conseguenze: «quanto è larga davvero questa finestra?» prima di scriverci uno script.

Metodo 1: gli strumenti del browser (solo nel browser)

F12 → Ispeziona → passa su un elemento per vederne il box model. Perfetto per il DOM — inutile per un lettore video, un'app desktop, uno screenshot in un visualizzatore o la tua finestra.

Metodo 2: Righello dello schermo — misura qualsiasi cosa, ovunque

Scarica gratis — ScreenRuler-Setup.exe

  1. Allinea lo zero. Metti il bordo sinistro del righello (modo orizzontale) o il bordo superiore (verticale) dove inizia la misura.
  2. Trascina la linea marcatore fino all'altro estremo; rifinisci con le frecce — 1 px per pressione, Shift per ×10. Il pulsante «Reimposta il marcatore» lo riporta a zero.
  3. Rendilo fantasma: opacità al 40 % più «Mantieni in primo piano» posano il righello traslucido proprio sopra l'elemento in questione. Leggi il valore grande — ≈ 482 px.

Note sulla precisione

Un'unità del righello è un pixel dello schermo — lo stesso px che parla il CSS — con scala al 100 %. Con una scala di Windows superiore, tutto sullo schermo, misure comprese, è in pixel scalati; se ti servono numeri non scalati, confronta al 100 %. Lo zoom del browser cambia ciò che misuri: misura al 100 % di zoom.

Domande frequenti

Posso misurare una distanza in diagonale?

No — misura il rettangolo che la racchiude (larghezza in modo orizzontale, altezza in verticale): è quello che i sistemi di layout usano comunque.

Funziona su qualsiasi monitor o scala?

La finestra si sposta su qualsiasi monitor e misura i pixel di quello schermo; la scala si comporta come descritto sopra.

Che differenza c'è con «screenshot + editor»?

Velocità e verità: niente passaggio di cattura, niente errori di zoom — misuri lo schermo vivo così com'è renderizzato adesso.