Como usar
- Leia Tela (pixels CSS): o tamanho da tela inteira, como o navegador a conta.
- Compare Tela (pixels físicos) com o número da caixa do monitor ou das configurações do sistema. Ele é o tamanho em CSS multiplicado pela Razão de pixels do dispositivo.
- Verifique Tela HDR e Taxa de atualização. Clique em Medir de novo com esta aba em primeiro plano, e feche outros programas que usam a tela.
Pixels CSS e pixels físicos
Um site mede a tela em pixels CSS, uma unidade da página e não do painel. Em uma tela de alta densidade, um pixel CSS é desenhado com vários pixels físicos: a razão de pixels do dispositivo mostra quantos ao longo de cada lado. Um telefone com 390 pixels CSS de largura e razão 3 tem 1.170 pixels físicos na largura.
A janela do navegador é menor que a tela quando não está maximizada. O tamanho muda ao vivo enquanto você a redimensiona, e muda também quando você aplica zoom, porque o zoom altera o número de pixels CSS que cabem.
Proporção, profundidade de cor e HDR
A proporção é a largura dividida pela altura, reduzida a uma fração: 1.920 por 1.080 é 16:9. Algumas telas têm nomes comuns: 16:9 e 16:10 são widescreen, 4:3 é o padrão antigo, e 21:9 e 32:9 são ultrawide. Quando a fração tem termos grandes, a página mostra a proporção comum mais próxima, marcada como cerca de.
A profundidade de cor é o número de bits usados em cada pixel. Com 24 bits, uma tela pode mostrar 16.777.216 cores. HDR quer dizer que a tela mostra uma faixa mais ampla de brilho e de cor; a página informa se o seu navegador diz que há uma tela assim, usando o recurso de faixa dinâmica do CSS (dynamic-range).
A taxa de atualização
A taxa de atualização é quantas vezes por segundo a tela é redesenhada: 60 Hz é comum, e 120 Hz ou 144 Hz aparecem em jogos e telas mais novas. A página conta os quadros de animação que o navegador desenha em um segundo e usa a distância típica entre eles, então alguns quadros perdidos não mudam a resposta. Os navegadores não informam a taxa do painel diretamente, por isso ela é uma medição.
Exemplo: um notebook 1080p com escala de 125%
Um painel de notebook de 1.920 por 1.080 pixels com escala do Windows em 125% dá uma razão de pixels do dispositivo de 1,25. O navegador então informa uma tela de 1.536 por 864 pixels CSS, e o tamanho físico é de novo 1.920 por 1.080.
Os números abaixo são o que a página mostra nesse caso: a proporção é 16:9 e a tela tem cerca de 1,3 megapixels em termos de CSS.
| Medida | Valor |
|---|---|
| Tela (pixels CSS) | 1.536 × 864 |
| Tela (pixels físicos) | 1.920 × 1.080 |
| Razão de pixels do dispositivo | 1,25 |
| Proporção | 16:9 · widescreen |
| Megapixels | 1,3 |
Perguntas frequentes
Qual é a diferença entre pixels CSS e pixels físicos?
Pixels físicos são os pontos do painel. Pixels CSS são a unidade que uma página da web usa, e o navegador os associa aos pixels físicos pela razão de pixels do dispositivo. Em uma tela de alta densidade, o tamanho em CSS é menor que o tamanho físico.
Por que o navegador diz que a minha tela tem 1.536 pixels de largura em um monitor de 1.920 pixels?
O dimensionamento do Windows deixa a tela com aparência maior, então ela tem menos pixels CSS. Com escala de 125%, 1.920 pixels físicos são 1.536 pixels CSS; o tamanho físico continua sendo 1.920.
Qual é uma boa taxa de atualização?
60 Hz é a taxa usual para trabalho de escritório e vídeo. Taxas maiores, como 120 Hz ou 144 Hz, deixam o movimento mais suave em jogos e na rolagem, e muitos telefones mudam de taxa para economizar bateria.
Por que a página mostra Não para HDR no meu monitor HDR?
O navegador informa HDR só quando o sistema operacional e a tela o ativam para o navegador, então um monitor HDR pode mostrar Não quando o HDR está desligado nas configurações do Windows ou do macOS.
A página consegue ver o modelo do meu monitor?
Não. Ela lê só os números que o navegador informa: tamanho, razão de pixels, profundidade de cor, orientação e a marca de HDR. Nomes de modelo e números de série não estão disponíveis para páginas da web.
Os dados da tela são enviados a algum servidor?
Não. Todos os números são lidos e medidos no navegador, e nada é enviado para nós nem guardado.
Fontes
- Wikipédia (em inglês): Display aspect ratio
- Wikipédia (em inglês): List of common display resolutions
- MDN: requestAnimationFrame (em inglês)
- MDN: dynamic-range media feature (em inglês)
- MDN: Screen.colorDepth (em inglês)
Números e texto verificados pela última vez em terça-feira, 10 de novembro de 2026.