Concepts

Dots Per Inch (DPI)

  • Measures how many individual pixels ("dots") fit into a 1-inch line on a screen or printed output.

  • It describes the density of pixels in a given physical space.

  • Higher DPI = Sharper, More Detailed Display :

    • A screen with 300 DPI packs 300 pixels into 1 inch, making images/text appear smoother.

    • A screen with 72 DPI has fewer pixels per inch, so details may look more pixelated.

  • DPI vs. Resolution :

    • Resolution (e.g., 1920x1080) = Total number of pixels on a screen.

    • DPI = How tightly those pixels are packed (depends on screen size).

      • Example: A 24-inch 4K monitor has ~184 DPI, while a 5-inch phone with a 1080p screen has ~440 DPI (much sharper).

  • Why DPI Matters in Font Rendering :

    • Fonts are vector-based (infinitely scalable), but screens are pixel-based.

    • If DPI is ignored, text may appear too small (on high-DPI screens) or too large (on low-DPI screens).

    • Proper DPI-aware rendering ensures text is physically consistent (e.g., 12pt font looks the same size on a phone and a monitor).