Images and Logos

Image overlays let you place static graphics on top of your program output — logos, watermarks, sponsor graphics, and any other image.

Adding an image overlay

  1. Add an Image source to a slot (tap +Image)
  2. Select an image from your photo library or files
  3. Position and scale the overlay
  4. Toggle it on when you want it visible

Supported formats

  • PNG — Recommended for logos and graphics (supports transparency)
  • JPEG — For photos and non-transparent images
  • Other formats — Any image format supported by iOS

Transparency

PNG images with an alpha channel are fully supported. Transparent areas show the program video underneath — perfect for:

  • Logos with transparent backgrounds
  • Watermarks with partial transparency
  • Borders and frames with cutouts
  • Bug graphics (corner logos)

Framing modes

Mode Description
Fit Scale the image to fit within the overlay area, preserving aspect ratio
Fill Scale the image to fill the overlay area, cropping if necessary
Free Stretch the image to exactly fill the overlay area (may distort)

Layering modes

Mode Description
Full Screen The image fills the entire output frame
Overlay The image is positioned and scaled as a floating overlay

Use Overlay mode for logos and watermarks. Use Full Screen for full-frame graphics like title cards or holding slides.

Opacity

Image overlays have an opacity control (0–1). Use partial opacity for subtle watermarks or semi-transparent branding.

Controlled via OSC: /pmix/overlay/{n}/opacity

Editing with live preview

Tap an image source in the grid to open its editor panel. All changes update the preview monitor in real time:

  • Opacity — Adjust transparency and see the result instantly
  • Rotation — Rotate the image
  • Framing — Switch between Fit, Fill, and Free
  • Layering — Switch between Full Screen and Overlay modes
  • Background color — Set a background behind the image

Positioning with gestures

When editing an image overlay, you can reposition and resize it directly on the preview monitor:

  • Drag — Move the image to a new position
  • Pinch — Scale the image up or down

The preview shows a checkerboard pattern behind transparent areas, making it easy to see where the image ends and the background begins.

Tips

  • Prepare images at output resolution — A 1920x1080 image looks sharpest at 1080p output
  • Use PNG for logos — JPEG doesn’t support transparency
  • Corner bug placement — Position a small logo at (0.05, 0.05) with a small scale for a top-left corner bug, or (0.95, 0.95) for bottom-right