PPI Calculator

About PPI Calculator

PPI (pixels per inch) measures screen pixel density, indicating how many pixels fit in one inch of display space. Higher PPI values produce sharper, more detailed images with less visible pixelation. This calculator computes PPI and dot pitch from screen resolution and diagonal size.

PPI Calculation Formula

PPI is calculated using the Pythagorean theorem to find the diagonal resolution in pixels:

PPI Calculation:

Step 1: Calculate diagonal resolution (pixels)
  diagonal_pixels = √(width² + height²)

Step 2: Divide by screen diagonal (inches)
  PPI = diagonal_pixels / screen_diagonal

Step 3: Calculate dot pitch (mm)
  dot_pitch = 25.4 / PPI

Example: 1920×1080 at 24 inches
  diagonal_pixels = √(1920² + 1080²)
                  = √(3,686,400 + 1,166,400)
                  = √4,852,800
                  = 2,202.9 pixels

  PPI = 2,202.9 / 24
      = 91.79 pixels per inch

  dot_pitch = 25.4 / 91.79
            = 0.277 mm

JavaScript Implementation

function calculatePPI(width, height, diagonal) {
  // Validate inputs
  if (!width || !height || !diagonal || diagonal <= 0) {
    throw new Error("Invalid input values");
  }

  // Calculate diagonal resolution using Pythagorean theorem
  const diagonalPixels = Math.sqrt(width * width + height * height);

  // Calculate PPI
  const ppi = diagonalPixels / diagonal;

  // Calculate dot pitch in millimeters
  // 1 inch = 25.4 mm
  const dotPitch = 25.4 / ppi;

  return {
    ppi: ppi.toFixed(2),
    dotPitch: dotPitch.toFixed(3),
    diagonalPixels: diagonalPixels.toFixed(1)
  };
}

// Usage examples:
calculatePPI(1920, 1080, 24);   // 91.79 PPI, 0.277mm
calculatePPI(3840, 2160, 27);   // 163.18 PPI, 0.156mm
calculatePPI(2560, 1440, 27);   // 108.79 PPI, 0.233mm

Common Resolution PPI Reference

Device PPI Comparison

Retina / HiDPI Thresholds

"Retina" (Apple) and "HiDPI" refer to displays where pixels are indistinguishable at normal viewing distance for 20/20 vision:

PPI and Dot Pitch Relationship

Dot pitch is the physical distance between adjacent pixel centers, measured in millimeters:

PPI to Dot Pitch Conversion:
  dot_pitch_mm = 25.4 / PPI

Dot Pitch to PPI Conversion:
  PPI = 25.4 / dot_pitch_mm

Reference Table:
  PPI     | Dot Pitch (mm) | Quality
  --------|----------------|------------------
  72      | 0.353          | Standard (old CRT)
  96      | 0.265          | Standard LCD
  110     | 0.231          | Entry laptop
  144     | 0.176          | Good quality
  200     | 0.127          | High density
  300     | 0.085          | Retina class
  400     | 0.064          | Premium smartphone
  500     | 0.051          | Cutting edge phone

Design Considerations for HiDPI

When designing for HiDPI/Retina displays:

• 2x assets: Provide images at 2x resolution for crisp rendering on Retina displays
• CSS pixels: Web design uses CSS pixels (96 PPI reference), not physical pixels
• Vector graphics: Use SVG for icons and illustrations to scale infinitely
• Font hinting: High PPI reduces need for aggressive font hinting
• Touch targets: Minimum 44×44 CSS pixels for touch accessibility

Common Use Cases

• Display Comparison: Compare pixel density when shopping for monitors or TVs
• UI/UX Design: Design at correct scale for target device PPI
• Asset Production: Determine required image resolutions for different devices
• Print Design: Convert between screen PPI and print DPI requirements
• Accessibility: Ensure text remains readable at various PPI levels
• Game Development: Optimize texture resolution for target display density

PPI vs DPI

Limitations

• Assumes square pixels: Calculation assumes square pixel layout; some displays use different arrangements
• Doesn't account for subpixel layout: RGB stripe, PenTile, and other subpixel arrangements affect perceived sharpness
• Viewing distance varies: Actual perceived sharpness depends on individual viewing distance
• Doesn't measure color accuracy: PPI only measures density, not color gamut or accuracy
• Ignores anti-aliasing: Software rendering can affect perceived edge sharpness