# image are not displayed on button UI and image UI

**URL:** <https://forums.unrealengine.com/t/image-are-not-displayed-on-button-ui-and-image-ui/444792>\
**Category:** UI\
**Tags:** button, image, unreal-engine, display, UI, question\
**Created:** [March 7, 2019, 9:03am UTC](https://forums.unrealengine.com/t/image-are-not-displayed-on-button-ui-and-image-ui/444792 "2019-03-07T09:03:24Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![blackantmaster](https://d1ap1mz92jnks1.cloudfront.net/user_avatar/forums.unrealengine.com/blackantmaster/32/982689_2.png) [@blackantmaster](https://forums.unrealengine.com/u/blackantmaster)\
**Post date:** [March 7, 2019, 9:03am UTC](https://forums.unrealengine.com/t/image-are-not-displayed-on-button-ui-and-image-ui/444792/1 "2019-03-07T09:03:24Z")

</div>

Hello,

i’m not sure if it’s a bug or if i do or miss something  
the fact is that i just set images on UI button and also tested to display the same on image, but as result i simply have a black color wich can be modified with opacity…  
that’s all falks.

maybe there are some rules to respect on the settings ?

 ![270539-screenshot-at-2019-03-07-10-01-49.png](https://d3kjluh73b9h9o.cloudfront.net/original/4X/e/1/9/e197e1bd77d614115301bf0f5745f9e2ac7b12a1.png)

---

<div class="post-metadata">

**Author:** ![Everynone](https://d1ap1mz92jnks1.cloudfront.net/user_avatar/forums.unrealengine.com/everynone/32/1135017_2.png) [@Everynone](https://forums.unrealengine.com/u/Everynone)\
**Post date:** [March 7, 2019, 9:14am UTC](https://forums.unrealengine.com/t/image-are-not-displayed-on-button-ui-and-image-ui/444792/2 "2019-03-07T09:14:14Z")

</div>

What _could_ be happening here is that you’re inheriting tint from the root element whose alpha is set to 0. Select the widget root and you’ll find _Foreground Color_ - a violently pink hue as default. Make sure its alpha is set to 1.

Or simply untick Inherit Tint. Did it help?

---

<div class="post-metadata">

**Author:** ![blackantmaster](https://d1ap1mz92jnks1.cloudfront.net/user_avatar/forums.unrealengine.com/blackantmaster/32/982689_2.png) [@blackantmaster](https://forums.unrealengine.com/u/blackantmaster)\
**Post date:** [March 7, 2019, 10:34am UTC](https://forums.unrealengine.com/t/image-are-not-displayed-on-button-ui-and-image-ui/444792/3 "2019-03-07T10:34:06Z")

</div>

thanks, i fund,  
that was the background color of this button who was set to black and 0.5 opacity

---

<div class="post-metadata">

**Author:** ![ali.quaker](https://d3kjluh73b9h9o.cloudfront.net/original/4X/2/8/5/28502927f1d97ba1051b3b47ccfe17233bf41ef0.png) [@ali.quaker](https://forums.unrealengine.com/u/ali.quaker)\
**Post date:** [January 29, 2021, 9:35pm UTC](https://forums.unrealengine.com/t/image-are-not-displayed-on-button-ui-and-image-ui/444792/4 "2021-01-29T21:35:38Z")

</div>

Had the same problem.  
You can solve it as follows:

You need to convert textures to material first.  
Then change the material property: “Material Domain” to “Interface”  
Plug in the RGB output of “Texture Sample” node into “Final Color”.  
Adjust the BlendMode property of Material as needed e.g. Translucent if your image has a transparency and plugin the alpha output from Texture Sample node to Opacity.
