Pixels op het scherm meten in Windows

Kort antwoord: Windows heeft geen liniaal op het scherm. DevTools meten in de browser, beeldbewerkers op hun eigen canvas — gebruik voor al het andere een gratis tool zoals Schermlineaal: lijn de nullijn uit, sleep de markering, lees de afstand in pixels af en leg het venster als spook over de interface die je meet.

Waarom je op het scherm zou willen meten

  • CSS schrijven: is die zijbalk 320 px of 300 px? Meet in plaats van te gokken en zet het breakpoint goed.
  • Toegankelijkheid: raakdoelen horen minstens 44×44 px te zijn — de liniaal controleert beide maten in seconden.
  • Designreview: de afstanden van een ontwerp vergelijken met de live pagina, op het pixelniveau waarover ontwerpers discussiëren.
  • Presentaties en print: controleren welk gebied een afbeelding mag innemen bij de resolutie van de projector.
  • Nieuwsgierigheid met gevolgen: “hoe breed is dit venster eigenlijk?” — voordat je er iets voor script.

Methode 1: de browserhulpmiddelen (alleen in de browser)

F12 → Inspecteren → hover over een element om zijn box-model te zien. Perfect voor de DOM — nutteloos voor een videospeler, een desktop-app, een screenshot in een viewer of je eigen venster.

Methode 2: Schermlineaal — meet alles, overal

Gratis downloaden — ScreenRuler-Setup.exe

  1. Lijn de nul uit. Zet de linkerrand van de liniaal (horizontale modus) of de bovenrand (verticale) waar de meting begint.
  2. Sleep de markeringslijn naar het andere uiteinde; stel bij met de pijltjestoetsen — 1 px per druk, Shift voor ×10. De knop “Markering resetten” zet hem terug op nul.
  3. Maak er een spook van: transparantie op 40 % plus “Altijd op de voorgrond” leggen de doorschijnende liniaal precies op het element in kwestie. Lees de grote waarde af — ≈ 482 px.

Opmerkingen over nauwkeurigheid

Eén liniaaleenheid is één schermpixel — precies de px die CSS spreekt — bij 100 % beeldschermschaling. Bij een hogere Windows-schaling staat alles op het scherm, je metingen inbegrepen, in geschaalde pixels; heb je ongeschaalde getallen nodig, vergelijk dan bij 100 %. De zoom van een browser verandert wat je meet: meet bij 100 % zoom.

Veelgestelde vragen

Kan ik een schuine afstand meten?

Nee — meet de omhullende rechthoek (breedte in horizontale modus, hoogte in verticale): die gebruiken layoutsystemen toch al.

Werkt het op elke monitor of schaling?

Het venster verhuist naar elke monitor en meet de pixels van dat scherm; de schaling gedraagt zich zoals hierboven beschreven.

Wat is het verschil met “screenshot + editor”?

Snelheid en waarheid: geen opnamestap, geen zoomfouten — je meet het levende scherm precies zoals het nu wordt weergegeven.