PPI

Pixels Per Inch—a measure of screen resolution indicating pixel density, with higher values producing sharper displays. Understanding PPI helps prepare appropriate image resolutions for different device types. Design at 1x and provide 2x assets for retina and high-DPI screens.

Related terms

Related terms

  • Retina Display

    Media

    High-resolution screens with twice or more the standard pixel density, displaying sharper text and images. Retina displays require higher resolution images—typically 2x the displayed size—to appear crisp. Framer automatically serves appropriate image sizes for different display densities.

  • Resolution

    Media

    The number of pixels displayed on screen, typically expressed as width by height, affecting image sharpness and detail. Higher resolution requires appropriately sized assets to appear crisp. Design with resolution independence in mind using vector graphics where possible.

  • DPI

    Media

    Dots Per Inch—a measure of print resolution indicating how many ink dots fit in one inch, affecting print quality and file size. Higher DPI produces sharper prints but larger files. For web, focus on PPI (pixels per inch) and responsive images rather than DPI.