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
- Add an Image source to a slot (tap + → Image)
- Select an image from your photo library or files
- Position and scale the overlay
- 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