Device Emulation

Simulate different devices by adjusting viewport size and device scale.

Mobile Screenshots

Capture a page as it appears on mobile:

# iPhone-sized viewport
curl "https://api.urlpix.com/v1/screenshot?url=https://example.com&width=390&height=844&deviceScale=3" \
  -H "X-API-Key: sk_live_YOUR_KEY" \
  -o mobile.png

Common Device Presets

Device	Width	Height	Device Scale
iPhone 14	390	844	3
iPhone 14 Pro Max	430	932	3
iPad Air	820	1180	2
Galaxy S23	360	780	3
Desktop HD	1920	1080	1
MacBook Pro	1440	900	2
4K Display	3840	2160	1

Tablet Screenshot

curl "https://api.urlpix.com/v1/screenshot?url=https://example.com&width=820&height=1180&deviceScale=2" \
  -H "X-API-Key: sk_live_YOUR_KEY" \
  -o tablet.png

Retina / High-DPI

The deviceScale parameter controls the device pixel ratio (DPR). Higher values produce sharper images at the cost of larger file sizes.

# 2x Retina
curl "https://api.urlpix.com/v1/screenshot?url=https://example.com&deviceScale=2" \
  -H "X-API-Key: sk_live_YOUR_KEY" \
  -o retina.png

• deviceScale=1 — Standard (default)
• deviceScale=2 — Retina (2x pixels)
• deviceScale=3 — Super Retina (3x pixels)

The output image dimensions will be width × deviceScale by height × deviceScale.

JavaScript Example

const devices = {
  iphone: { width: 390, height: 844, deviceScale: 3 },
  ipad: { width: 820, height: 1180, deviceScale: 2 },
  desktop: { width: 1920, height: 1080, deviceScale: 1 },
}

async function captureDevice(url, device, apiKey) {
  const params = new URLSearchParams({
    url,
    ...Object.fromEntries(
      Object.entries(devices[device]).map(([k, v]) => [k, String(v)])
    ),
    format: 'webp',
  })

  return fetch(`https://api.urlpix.com/v1/screenshot?${params}`, {
    headers: { 'X-API-Key': apiKey },
  })
}