> For the complete documentation index, see [llms.txt](https://sf-studio.gitbook.io/unreal-assets/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://sf-studio.gitbook.io/unreal-assets/hologram-ui/hologram-ui-material.md).

# Hologram UI Material

## Quick Guide

Add an animated hologram effect to images in Unreal Engine widgets.

### Getting started

1. Create a Material Instance from `M_Hologram_UI`, or duplicate the supplied `MI_Hologram_UI_01`.
2. Open your instance, enable the overrides you want to edit, and assign your image to **Base Texture**. Use an image with transparency to preserve its silhouette.
3. In your Widget Blueprint, add an **Image** and assign the material instance to its **Brush → Image**.
4. Adjust the line settings, colors and optional effects. The main texture stays stationary while the scanlines and noise animate.

Set enable controls to **0** for off or **1** for on. For runtime changes, call **Get Dynamic Material** on the Image, then set its scalar, vector or texture parameters by name.

### Overview Map

Open `Content/SF_Studio/HologramUI/Maps/HologramUI_Overview` in the SF\_Studio project and press **Play**. The existing level blueprint creates `WBP_HologramTest` and adds it to the viewport automatically. The gallery contains 12 labeled presets: Portal, Skull, Flame and Shadow each have their own column with three variants from top to bottom. Each preview has dark, light and checkerboard regions behind the material so you can inspect its transparency.

<figure><img src="https://2766202746-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F6OZbtN11G9CPqo8IlfSN%2Fuploads%2FwnJbnbPBF2QMqBugHeFl%2Fimage.png?alt=media&amp;token=83318b1e-43bd-46fe-9074-9c5344e1104b" alt=""><figcaption></figcaption></figure>

For a gameplay UI, assign an instance to your own Image. Keep the Image tint white and its render opacity at 1 when evaluating material colors and opacity.

### Material properties

<figure><img src="https://2766202746-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F6OZbtN11G9CPqo8IlfSN%2Fuploads%2FZIPJnYCM56F5ObbCBkQy%2Fimage.png?alt=media&amp;token=05d5f737-f75f-4b56-a811-40e3dd32f681" alt=""><figcaption></figcaption></figure>

#### Base Texture

<table><thead><tr><th width="193">Name</th><th>Description</th></tr></thead><tbody><tr><td>Base Texture</td><td>The image displayed by the widget. Its alpha defines transparent areas.</td></tr><tr><td>Color</td><td>Base image tint. Its alpha also controls overall transparency.</td></tr><tr><td>Base Texture Tiling X</td><td>Horizontal image repetition. <strong>1</strong> displays the image once.</td></tr><tr><td>Base Texture Tiling Y</td><td>Vertical image repetition. <strong>1</strong> displays the image once.</td></tr></tbody></table>

#### Fade

<table><thead><tr><th width="193">Name</th><th>Description</th></tr></thead><tbody><tr><td>Enable Fade</td><td>Enables a vertical fade, starting from the bottom by default.</td></tr><tr><td>Fade Amount</td><td>Fade start position. Higher values hide more of the image.</td></tr><tr><td>Smoothness</td><td>Height of the fade transition. Higher values create a broader, softer fade.</td></tr><tr><td>Flip UVs</td><td><strong>1</strong> moves the fade to the top; <strong>0</strong> keeps it at the bottom.</td></tr></tbody></table>

#### Glow

<table><thead><tr><th width="193">Name</th><th>Description</th></tr></thead><tbody><tr><td>Glow Intensity</td><td>Brightness of the bright scanline highlights. Does not change dark-band replacement colors or add scene bloom.</td></tr></tbody></table>

#### Line Config 1 & 2

The paired names below control the corresponding line layer.

<table><thead><tr><th width="240">Name</th><th>Description</th></tr></thead><tbody><tr><td>Enable Second Line Config</td><td>Enables an additional line pattern with separate settings.</td></tr><tr><td>Line Strength</td><td>Scanline contrast for the selected layer. <strong>0</strong> disables that layer's pattern contribution and custom color.</td></tr><tr><td>Size </td><td>Line period as a percentage of widget height. <strong>2</strong> gives about 50 lines.</td></tr><tr><td>Spacing </td><td>Bright portion of each line period. Higher values leave smaller dark gaps.</td></tr><tr><td>Scroll Speed </td><td>Animation speed in cycles per second. <strong>0</strong> stops the selected layer; negative values reverse it.</td></tr><tr><td>Line Color</td><td>Replacement color for the selected layer's dark bands. Color alpha controls replacement strength.</td></tr></tbody></table>

#### Noise

<table><thead><tr><th width="193">Name</th><th>Description</th></tr></thead><tbody><tr><td>Use Noise Texture</td><td>Enables texture-based noise for a less uniform hologram.</td></tr><tr><td>Noise Texture</td><td>Texture used to create the noise pattern.</td></tr><tr><td>Noise Strength</td><td>Amount of noise modulation. <strong>0</strong> removes the noise effect.</td></tr><tr><td>Noise Tiling X</td><td>Horizontal repetition of the noise texture.</td></tr><tr><td>Noise Tiling Y</td><td>Vertical repetition of the noise texture.</td></tr><tr><td>Noise Speed X</td><td>Horizontal noise movement in UV units per second. Negative values reverse it.</td></tr><tr><td>Noise Speed Y</td><td>Vertical noise movement in UV units per second. Negative values reverse it.</td></tr></tbody></table>

#### Opacity

<table><thead><tr><th width="193">Name</th><th>Description</th></tr></thead><tbody><tr><td>Opacity Strength</td><td>Overall material opacity, combined with image alpha, Color alpha and enabled effects.</td></tr></tbody></table>

#### Pulse

<table><thead><tr><th width="193">Name</th><th>Description</th></tr></thead><tbody><tr><td>Enable Pulse Effect</td><td>Enables a repeating brightness and opacity pulse.</td></tr><tr><td>Pulse Speed</td><td>Pulse frequency in cycles per second.</td></tr></tbody></table>