Meine Bildschirmauflösung anzeigen
Die Bildschirmauflösung anzeigen: Welche Auflösung hat mein Bildschirm – und wie viel Platz hat eine Webseite im Browserfenster wirklich? Die Werte werden direkt in Ihrem Browser gemessen und ändern sich live, wenn Sie das Fenster verkleinern, zoomen oder das Gerät drehen.
Quelle: MDN Web Docs – Screen. Stand: .
So wird gerechnet
Bei der Bildschirmauflösung gibt es mehrere richtige Antworten: die echten Pixel des Displays, die CSS-Pixel, mit denen der Browser rechnet, und den Viewport – den Bereich, den eine Webseite tatsächlich zur Verfügung hat. Dieses Tool zeigt alle Werte nebeneinander.
Bildschirmauflösung herausfinden – so geht's
- Diese Seite öffnen: Auflösung in echten Pixeln und in CSS-Pixeln erscheinen sofort.
- Fenster verkleinern, zoomen oder das Gerät drehen – Viewport, Zoom und Breakpoint ändern sich live.
- devicePixelRatio, Seitenverhältnis und verfügbare Fläche ohne Taskleiste ablesen.
Beispiel: Ein Laptop mit 1920 × 1080 Pixeln und 125 % Windows-Skalierung meldet bei 100 % Browser-Zoom devicePixelRatio 1,25. In CSS-Pixeln sind das 1920 ÷ 1,25 = 1536 und 1080 ÷ 1,25 = 864, also 1536 × 864.
Was die Werte bedeuten
- Echte Pixel: Bildschirm in CSS-Pixeln × devicePixelRatio. Bei einem Full-HD-Laptop mit 125 % Skalierung meldet der Browser 1536 × 864 CSS-Pixel – × 1,25 ergibt die echten 1920 × 1080.
- devicePixelRatio: Wie viele echte Pixel auf ein CSS-Pixel kommen. 1 = klassischer Monitor, 2 oder 3 = Retina-/Handy-Display. Browser-Zoom und die Windows-Anzeigeskalierung verändern diesen Wert.
- Verfügbar: Bildschirm abzüglich Taskleiste oder Dock.
- Viewport: Innenmaß des Browserfensters (
innerWidth × innerHeight) – danach richten sich Media Queries und responsive Layouts. Der sichtbare Bereich (Visual Viewport) ist auf dem Handy kleiner, wenn Sie hineinzoomen oder die Tastatur offen ist. - Seitenverhältnis: exakt gekürzt (1920 × 1080 = 16:9) und, bei krummen Werten, das übliche Verhältnis (1366 × 768 ≈ 16:9).
- Breakpoint: Welche Stufe von Bootstrap 5 (sm ab 576, md ab 768, lg ab 992, xl ab 1200, xxl ab 1400 px) und Tailwind CSS (sm ab 640, md ab 768, lg ab 1024, xl ab 1280, 2xl ab 1536 px) bei der aktuellen Fensterbreite greift.
Typische Auflösungen
| Name | Pixel | Verhältnis |
|---|---|---|
| HD (720p) | 1280 × 720 | 16:9 |
| HD / WXGA | 1366 × 768 | ≈ 16:9 |
| Full HD (1080p) | 1920 × 1080 | 16:9 |
| WUXGA | 1920 × 1200 | 16:10 |
| QHD / WQHD (1440p) | 2560 × 1440 | 16:9 |
| UWQHD | 3440 × 1440 | ≈ 21:9 |
| 4K UHD | 3840 × 2160 | 16:9 |
Grenzen
Browser runden CSS-Pixel teils ab; die echten Pixel können deshalb um 1 abweichen (2561 statt 2560). Bei mehreren Monitoren zeigt der Browser den Bildschirm, auf dem das Fenster gerade liegt. Firefox kann mit aktiviertem Fingerprinting-Schutz (resistFingerprinting) absichtlich Standardwerte melden.
Weitere Browser-Checks: Browser und System zeigt Mein User-Agent, die öffentliche Adresse Wie ist meine IP-Adresse?, und passende Bildmaße rechnet der Seitenverhältnis-Rechner aus.
Häufige Fragen
Wie finde ich meine Bildschirmauflösung heraus?
Einfach diese Seite öffnen: Oben steht die Auflösung in echten Pixeln, darunter die Werte in CSS-Pixeln und die Größe des Browserfensters. Unter Windows finden Sie sie außerdem in Einstellungen → System → Bildschirm → Bildschirmauflösung.
Warum zeigt der Browser 1536 × 864 statt 1920 × 1080?
Weil Windows auf 125 % skaliert (oder der Browser-Zoom nicht auf 100 % steht). Der Browser rechnet dann in CSS-Pixeln: 1920 ÷ 1,25 = 1536. Die echten Pixel stehen oben – sie ergeben sich aus CSS-Pixeln × devicePixelRatio.
Was ist der Unterschied zwischen Bildschirmauflösung und Viewport?
Die Bildschirmauflösung ist die Größe des ganzen Displays. Der Viewport ist nur der Innenbereich des Browserfensters, ohne Tab-Leiste, Adressleiste und Taskleiste. Für Webdesign und Media Queries zählt der Viewport.
Was bedeutet devicePixelRatio 2 oder 3?
Das Display ist hochauflösend (Retina): Ein CSS-Pixel besteht aus 2 × 2 bzw. 3 × 3 echten Pixeln. Texte und Bilder wirken dadurch schärfer, Layouts bleiben aber gleich groß.
Werden meine Daten gespeichert?
Nein. Alle Werte werden nur in Ihrem Browser gelesen und angezeigt; es wird nichts gesendet oder gespeichert.
Quellen und Rechtsgrundlagen
- MDN Web Docs – Screen
- MDN Web Docs – Window.devicePixelRatio
- MDN Web Docs – Visual Viewport API
- MDN Web Docs – prefers-color-scheme
- Bootstrap 5.3 – Breakpoints
- Tailwind CSS – Responsive design
Stand: · So prüfen wir
Passende Werkzeuge
- Mein User-Agent anzeigen: Browser und SystemZeigt Ihren User-Agent-String, erkennt Browser, Version, Engine, Betriebssystem und Gerätetyp, liest Client Hints aus. Fremde UAs prüfen. Alles lokal.
- Wie ist meine IP-Adresse?Öffentliche IP-Adresse herausfinden: Ihre IPv4 und IPv6 sofort sehen, dazu ungefährer Standort, Internetanbieter und Browser-Daten. Nichts wird gespeichert.
- Webcam-Test: Kamera testenKamera-Test im Browser: Livebild, echte Auflösung, Megapixel und Bildrate, alle Stufen bis 4K durchprobieren, Helligkeit prüfen, Foto. Nichts wird hochgeladen.
- Tastatur-Test: Funktionieren alle Tasten?Tastatur online testen: Jede Taste leuchtet auf und bleibt markiert. Findet tote Tasten, Ghosting und Doppelauslösung – Ansichten für ISO, ANSI, Laptop und Mac.
- Subnetz-Rechner für IPv4: Netz, Broadcast, Hosts und SubnettingSubnetz-Rechner für IPv4 mit CIDR: Netzadresse, Broadcast, Host-Bereich, Subnetzmaske, Wildcard und Anzahl Hosts – binär erklärt, mit Subnetting.
- JavaScript minimierenJavaScript minimieren: Kommentare und Leerraum entfernen, den Code verkleinern und die Ersparnis in Byte sehen. Im Browser, ohne Upload.
- Syntax-HighlighterSyntax-Highlighter online: Code einfügen, Farbschema für JavaScript, JSON, HTML, CSS, SQL, Python oder Bash wählen und das eingefärbte HTML kopieren.
- CSS clamp RechnerCSS clamp Rechner für fluide Schriftgrößen und Abstände: Mindest- und Höchstwert plus Viewport-Bereich eingeben, fertigen clamp()-Wert kopieren.
- JSON escape / unescapeJSON escape und unescape online: Text in einen gültigen JSON-String mit maskierten Anführungszeichen, Backslashes und Umbrüchen umwandeln oder zurück.