How to Add a Transparent Image to OBS

The basic steps to add a transparent image in OBS

To add a transparent image to OBS, import it as an image source, then adjust its properties in the scene. OBS supports PNG files with transparency (alpha channel) — the transparent areas will show whatever is behind them in your scene, whether that's another source, a color, or nothing at all.

Start by opening OBS and selecting the scene where you want the image. In the Sources panel at the bottom, click the plus icon and choose Image. Browse to your PNG file on your computer and select it. The image will appear in your scene preview. If the transparent parts aren't working, check that your file is actually a PNG with an alpha channel, not a JPG or flattened image.

Once the image is in your scene, you can resize it by dragging the corners, move it by clicking and dragging, and adjust its opacity using the Opacity slider in the source properties. Right-click the source and select Transform to access more detailed positioning options if you need pixel-perfect placement.

Key Takeaways

OBS only preserves transparency for PNG files with an alpha channel — JPG files will show a solid background color instead.
Add an image source through the plus icon in the Sources panel, then browse to your PNG file on your computer.
Resize and position the image by dragging it in the preview, or use the Transform menu for exact coordinates and dimensions.
Adjust opacity with the Opacity slider in the source properties if you want the image to be partially see-through.
If transparency isn't showing, right-click the source and check that Blend Mode is set to Normal, not a different mode.

Preparing your image file before importing

The most common reason transparency doesn't work in OBS is that the image file itself doesn't have transparency. If you're starting with a JPG or a PNG that was flattened in Photoshop or GIMP, you'll need to recreate it with a transparent background first.

In most image editors, create a new file with transparency enabled (sometimes called "transparent background" or "alpha channel"). Place your image content on that transparent layer, then export as PNG. Make sure the export settings preserve the alpha channel — some editors default to flattening the image on export. In Photoshop, use File > Export As and choose PNG format. In GIMP, use File > Export As, select PNG, and confirm that the transparency option is checked.

If you're using an online tool like Photopea or Canva, download the file as PNG, not JPG. If you already have an image with a solid background and want to remove it, use a free tool like Remove.bg, which outputs a PNG with transparency, or use the eraser tool in your image editor to manually delete the background layer.

Resizing and positioning the image in your scene

Once your image is in OBS, you can adjust its size and location in several ways. The simplest is to click the image in the preview window and drag the corner handles to resize it. Hold Shift while dragging to maintain the aspect ratio so the image doesn't stretch or squash.

To move the image, click anywhere on it (not on a corner handle) and drag it to a new position. If you need exact placement — for example, positioning a logo at specific pixel coordinates — right-click the source in the Sources panel and select Transform. This opens a menu where you can enter exact X and Y positions, width and height, rotation, and crop values.

You can also use the Align tools in the Transform menu to snap the image to the center of your scene, align it to the left or right edge, or distribute multiple images evenly. These tools are useful if you're layering several transparent images and want them perfectly aligned.

Adjusting opacity and blending modes

By default, OBS displays your image at full opacity — 100 percent solid. To make it partially transparent, find the Opacity slider in the source properties panel on the right side of OBS. Drag it left to reduce opacity, or click the number field and type a value between 0 (invisible) and 100 (fully visible).

Opacity is different from the transparency built into your PNG file. If your PNG has semi-transparent areas (like a soft shadow or gradient edge), those will respect their original transparency regardless of the Opacity slider. The slider affects the entire source uniformly.

Below the Opacity slider, you'll see a Blend Mode dropdown set to Normal. In most cases, leave this alone. If you're layering images and want special effects like screen blending (which makes dark areas disappear) or multiply blending (which darkens everything), you can experiment with other modes. For standard use, Normal is correct.

Layering multiple transparent images

OBS stacks sources in the order they appear in the Sources panel — sources at the bottom appear behind sources at the top. To layer multiple transparent images, add each one as a separate image source. The image at the top of the list will appear in front of the others in your scene.

Drag sources up and down in the Sources panel to change their stacking order. If you want a background image behind everything, place it at the bottom of the list. If you want a logo or watermark on top, place it at the top. You can also right-click a source and select Order to move it forward or backward in the stack.

When layering, remember that each image's transparency is preserved. If you have a logo with a transparent background on top of a background image, you'll see both — the logo won't cover the background where the logo's transparency is. This is the intended behavior and is what makes layering transparent images useful.

Troubleshooting transparency issues

If your image appears with a white, black, or colored background instead of transparency, the file itself doesn't have an alpha channel. Export it again from your image editor as PNG and confirm the transparency option is enabled. If you're not sure whether your file has transparency, open it in an image viewer that supports transparency — the background should show a checkerboard pattern, not a solid color.

If the image is in OBS but the transparent areas show a solid color, check the Blend Mode. Right-click the source, look at the Blend Mode dropdown, and make sure it says Normal. If it's set to something else, change it back to Normal.

If the image looks correct in OBS but appears with a background when you stream or record, the issue is usually in your output settings or encoder, not the image itself. This is rare and usually only happens if you've changed advanced streaming settings. For most setups, if it looks right in OBS, it will look right in your stream.

Frequently Asked Questions

Can I use a JPG file with transparency in OBS?

No. JPG files don't support transparency — they always have a solid background. You must convert your image to PNG format with an alpha channel. If you have a JPG, open it in an image editor, create a transparent background, and export as PNG.

Why does my transparent image have a white box around it?

The file you're using is likely a JPG or a PNG that was flattened. The white box is the solid background that was added when the file was created or exported. Re-export the image as PNG with transparency enabled, or recreate it in an image editor with a transparent background layer.

How do I make part of my image semi-transparent?

Use the Opacity slider in the source properties to make the entire image partially see-through. If you want only certain parts to be semi-transparent, you'll need to edit the PNG file itself in an image editor — use the eraser tool with reduced opacity, or paint semi-transparent areas directly onto the transparent background layer.

Can I animate a transparent image in OBS?

OBS doesn't animate static images natively. If you want movement, you can use a video file instead of an image — export your animation as an MP4 or MOV with transparency (some codecs support this), then add it as a Media Source instead of an Image Source. Alternatively, use OBS filters like Move or Rotate to apply simple animations to a static image.

What's the best image size to use for OBS?

Match your stream resolution — typically 1920x1080 for 1080p or 1280x720 for 720p. You can use larger images and scale them down in OBS, but starting with the right size keeps file sizes smaller and avoids quality loss. If your image is smaller than your stream resolution, it will look pixelated when enlarged.

This guide is for general information only and is not medical, financial, legal, or other professional advice. For decisions specific to your situation, consult a qualified professional. See our Editorial Policy.