Cuál es mi resolución de pantalla
¿Qué resolución tiene mi pantalla y cuánto espacio recibe realmente una página web dentro de la ventana del navegador? Todos los valores se miden directamente en tu navegador y se actualizan en vivo al cambiar el tamaño de la ventana, hacer zoom o girar tu dispositivo.
Cómo se calcula
Hay más de una respuesta correcta a «cuál es mi resolución de pantalla»: los píxeles físicos de la pantalla, los píxeles CSS con los que trabaja el navegador, y el viewport, el área que realmente recibe una página web. Esta herramienta los muestra todos, uno junto a otro.
Qué significan los valores
- Píxeles físicos: tamaño de pantalla en píxeles CSS × devicePixelRatio. Un portátil Full HD con escalado al 125 % informa 1536 × 864 píxeles CSS; × 1,25 da los 1920 × 1080 reales.
- devicePixelRatio: cuántos píxeles físicos forman un píxel CSS. 1 = monitor clásico, 2 o 3 = pantalla Retina o de teléfono. Tanto el zoom del navegador como el escalado de pantalla de Windows cambian este valor.
- Disponible: la pantalla menos la barra de tareas o el Dock.
- Viewport: el tamaño interior de la ventana del navegador (
innerWidth × innerHeight); a esto responden las media queries y los diseños adaptables. El área visible (visual viewport) es más pequeña en teléfonos cuando haces zoom con dos dedos o el teclado está abierto. - Relación de aspecto: reducida de forma exacta (1920 × 1080 = 16:9) y, para valores atípicos, el nombre habitual (1366 × 768 ≈ 16:9).
- Breakpoint: qué nivel de Bootstrap 5 (sm desde 576, md desde 768, lg desde 992, xl desde 1200, xxl desde 1400 px) y de Tailwind CSS (sm desde 640, md desde 768, lg desde 1024, xl desde 1280, 2xl desde 1536 px) se aplica con el ancho actual de la ventana.
Resoluciones habituales
| Nombre | Píxeles | Relación |
|---|---|---|
| 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 |
Límites
A veces los navegadores redondean los píxeles CSS hacia abajo, así que los píxeles físicos pueden variar en uno (2561 en vez de 2560). Con varios monitores, el navegador informa la pantalla en la que está la ventana en ese momento. Firefox con la protección contra fingerprinting activada (resistFingerprinting) puede informar deliberadamente valores estándar.
Preguntas frecuentes
¿Cómo averiguo mi resolución de pantalla?
Basta con abrir esta página: la resolución en píxeles físicos aparece arriba, seguida de los valores en píxeles CSS y el tamaño de tu ventana del navegador. En Windows también la encuentras en Configuración → Sistema → Pantalla → Resolución de pantalla.
¿Por qué mi navegador muestra 1536 × 864 en vez de 1920 × 1080?
Porque Windows está escalado al 125 % (o el zoom del navegador no está al 100 %). El navegador entonces trabaja en píxeles CSS: 1920 ÷ 1,25 = 1536. Los píxeles físicos se muestran arriba: son los píxeles CSS × devicePixelRatio.
¿Cuál es la diferencia entre resolución de pantalla y viewport?
La resolución de pantalla es el tamaño de toda la pantalla. El viewport es solo el área interior de la ventana del navegador, sin la barra de pestañas, la barra de direcciones ni la barra de tareas. Para el diseño web y las media queries, lo que cuenta es el viewport.
¿Qué significa un devicePixelRatio de 2 o 3?
Tu pantalla es de alta densidad (Retina): un píxel CSS está formado por 2 × 2 o 3 × 3 píxeles físicos. El texto y las imágenes se ven más nítidos, mientras que los diseños mantienen el mismo tamaño.
¿Se guardan mis datos?
No. Todos los valores se leen y se muestran solo en tu navegador; nada se envía ni se guarda.
Fuentes y base legal
- 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
Última actualización:
Herramientas relacionadas
- Cuál es mi user agentDescubre tu cadena de user agent y detecta navegador, versión, motor, SO y tipo de dispositivo, con Client Hints. Analiza cualquier otra. Local.
- Cuál es mi dirección IPMuestra al instante tu dirección IP pública, detecta si es IPv4 o IPv6 y explica la diferencia. Gratis: tu IP no se guarda.
- Test de cámara web: probar tu cámaraTest de cámara web gratis en tu navegador: imagen en vivo, resolución y fotogramas reales, de 480p a 4K, modo espejo y foto. No se sube nada.
- Test de teclado: ¿funcionan todas las teclas?Test de teclado online gratis: cada tecla que pulsas se ilumina y queda marcada como probada. Muestra key, code y comprueba ghosting.
- Validar y calcular un dígito de LuhnValida números con el algoritmo de Luhn (módulo 10, ISO/IEC 7812-1) o calcula el dígito de control: solo comprueba el formato, en tu navegador.
- Calculadora de relación de aspectoCalcula la relación de aspecto a partir de ancho y alto (1920 × 1080 = 16:9), el lado que falta, el valor decimal, la proporción estándar más cercana y el CSS.