Unreal Engine 5 inventory UI widgets for 3D item previews

steps

1. In the Unreal Engine content browser, create a folder named Widgets.
2. Right-click inside this folder and choose User Interface → Widget Blueprint. Select User Widget as the parent class.

The Unreal Engine editor displays the New Widget Blueprint parent class dialog with User Widget selected. — Unreal University

3. Name your widget blueprint, for example WidgetBlueprint_3DOverlay, and double-click to open it.
4. Drag a Canvas Panel from the Palette onto the designer canvas.
5. Add a Background Blur inside your Canvas Panel.

The widget designer is open with a Canvas Panel containing a Background Blur. — Unreal University

6. Select the Background Blur, set its anchors to the bottom-right preset, and set Offset values to zero on all sides to stretch it across the canvas.
7. Increase the Blur Strength property (e.g., 10) to soften the background under the preview.

steps

1. Open your character blueprint and locate the Begin Play event.
2. Create your overlay widget on Begin Play using the Create Widget node, then store it in a variable (e.g., 3DWidget).

The character blueprint Event Graph shows a Create Widget node wired into a variable set for the preview widget. — Unreal University

3. Add logic for the I key input: when pressed, check if the widget is visible.
   • If visible, Remove from Parent.
4. Compile the blueprint. Test in play mode: pressing I should open the blurry overlay, pressing again should close it.

steps

1. In your character or preview actor, add a SceneCaptureComponent2D.

Unreal Engine blueprint editor shows a character in the viewport with Scene Capture Component 2D selected in the Components panel. — Unreal University

2. Create a new folder named RenderTargets. Inside it, right-click → Texture → Render Target.
3. Open the Render Target asset and set its resolution to 1024 by 1024.

Unreal Engine displays a Render Target asset info panel with the resolution visible. — Unreal University

4. Assign the Render Target to the SceneCaptureComponent2D → Texture Target property.

steps

1. Return to your preview widget blueprint.
2. Add an Image widget to the Canvas Panel.
3. Set the Image widget size to 1024 x 1024 for consistency with your render target.
4. In the Details panel, set the Brush property of the Image to your Render Target asset.

The Widget Designer shows an Image widget selected with its settings open in the Details panel. — Unreal University

5. Use the widget preview to confirm the image (render target) appears in the UI.

// SceneCaptureComponent2D captures everything and outputs a render target.
// Image widget displays render target directly, background is black.

// SceneCaptureComponent2D uses Show Only Actor Components to capture only your mesh.
// Material applied to render target:
// - Material Domain: User Interface
// - Blend Mode: Translucent
// - Connect OneMinus(Alpha) node to Opacity to clear the background
// - Assign material to the Image widget Brush property