Skip to content
Discebo.dk

§ 03

Screen pixel density (PPI)

Hvor mange pixels pr. tomme (PPI) har denne skærm, og hvor skarp regnes den for?

Answer: Pixels per inch (PPI) fortæller hvor tæt pixels sidder på en skærm, og regnes ud fra skærmens opløsning og den fysiske diagonal i tommer. Jo højere PPI, jo skarpere fremstår teksten og billederne — og jo mere sandsynligt er det, at skærmen bruger en device pixel ratio over 1x, så billeder skal leveres i højere opløsning end de vises i CSS.

Formula

PPI = √(bredde_px² + højde_px²) ÷ diagonal (tommer)

Eksempel: 1920×1080 px på 15,6" ≈ √(1920²+1080²)/15,6 ≈ 141 PPI

Symbols and units in the formula
SymbolMeaningUnit
bredde_pxOpløsning — breddepx
hoejde_pxOpløsning — højdepx
diagonal_tommerSkærmens diagonaltommer
=Pixeltæthed (PPI)PPI
=Samlet antal pixelsmegapixel

Validity and source

Source
Geometri (Pythagoras' læresætning)

Worked example

The calculator's own default values inserted. The figures are calculated with exactly the formula the tool uses.

Substituted

  • Opløsning — bredde1,920 px
  • Opløsning — højde1,080 px
  • Skærmens diagonal15.60 tommer

Giver

  • Pixeltæthed (PPI)141 PPI
  • Samlet antal pixels2.07 megapixel

Members only

The calculator itself is locked

Create a free user account to unlock all articles, calculators, templates and range — and get access to quizzes and classes. It takes less than a minute: name, email and a password. No payment card.

Create free user →Log in

Want to try something first? See what you can use without an account — the junior zone, the encyclopedia, the videos and more.

Sådan bruger du den

Når du tester et design på forskellige skærme, forklarer pixeltætheden, hvorfor det samme billede ser skarpt ud på én skærm og sløret på en anden. Høj PPI betyder en device pixel ratio over 1, og så skal billeder leveres i flere størrelser med srcset.

Step by step

  1. Find skærmens opløsning i pixels og diagonalen i tommer i databladet.
  2. Regn diagonalen i pixels med Pythagoras: √(bredde² + højde²).
  3. Del med diagonalen i tommer. Det er PPI.
  4. Over ca. 200 PPI bruger enheden typisk DPR 2 eller mere.

Typical errors

  • At tro at CSS-pixels er fysiske pixels. Med DPR 2 består hver CSS-pixel af 2 × 2 skærmpixels.
  • At teste billeder kun på en skærm med høj PPI. Der ser alt skarpt ud, mens en DPR 1-skærm afslører for tunge filer.
  • At bytte om på bredde og højde. Det giver samme PPI, men forkert sideforhold i dine noter.

Examples from everyday life

Kontorets bærbare

Kundens medarbejdere bruger bærbare med 15,6" skærm i 1920 × 1080.

Opløsning — bredde
1,920 px
Opløsning — højde
1,080 px
Skærmens diagonal
15.6 inches

It means: Tætheden er 141 PPI og skærmen har 2.07 megapixel. Den kører normalt med 125 % skalering i Windows, altså DPR 1,25.

En moderne iPhone

Du tester en webshop på en iPhone med 6,1" skærm og 1179 × 2556 px.

Opløsning — bredde
1,179 px
Opløsning — højde
2,556 px
Skærmens diagonal
6.1 inches

It means: Tætheden er 461 PPI. Telefonen bruger DPR 3, så et billede, der vises 390 CSS-pixels bredt, skal være ca. 1170 px for at se skarpt ud.

27" 4K-skærm

Designeren arbejder på en 27" skærm i 3840 × 2160.

Opløsning — bredde
3,840 px
Opløsning — højde
2,160 px
Skærmens diagonal
27 inches

It means: Tætheden er 163 PPI, og skærmen har 8.29 megapixel. Den kører typisk med 150 % skalering, så designet ser skarpere ud her end hos de fleste brugere.

Rule of thumb

Under ca. 120 PPI er en almindelig skærm (DPR 1), over ca. 200 PPI er en «retina»-skærm (DPR 2-3).

How to check the answer

Skriv window.devicePixelRatio i konsollen på enheden. Det viser den faktiske DPR.