# GUI Material with smooth outliner/border effect **URL:** \ **Category:** UI\ **Tags:** border, unreal-engine, gui, question, UMG\ **Created:** [October 17, 2018, 3:58pm UTC](https://forums.unrealengine.com/t/gui-material-with-smooth-outliner-border-effect/435827 "2018-10-17T15:58:11Z")\ **Posts on this page:** 5\ **Page:** 1
**Author:** ![MaxPower42](https://d3kjluh73b9h9o.cloudfront.net/original/4X/2/8/5/28502927f1d97ba1051b3b47ccfe17233bf41ef0.png) [@MaxPower42](https://forums.unrealengine.com/u/MaxPower42)\ **Post date:** [October 17, 2018, 3:58pm UTC](https://forums.unrealengine.com/t/gui-material-with-smooth-outliner-border-effect/435827/1 "2018-10-17T15:58:11Z")
Please help a math cripple in need ☹ I want to make a material function that returns a value between 0…Max…1 depending on UV value and some other variables. I’m pretty sure I could figure out, if I had the power of code at my disposal, but the material editor lacks even the most basic bool-operations and I quickly lose track of what I’m doing when I start putting "if"s together and whatnot. I think it’s best explained with pictures. 0 is the outer edge where the border should fade out completely. 1 is the alpha at the center (factor 1, so it doesnt change from the brush). Max is the boost-factor that gets applied at the core of the border. I want to make this a material function, so I can easily re-use it and modify it to work with colors instead of alpha etc. On the second picture, I don’t really know what I’m doing anymore, but the first should make a lot of sense… ![256852-matfunc1.png](https://d3kjluh73b9h9o.cloudfront.net/original/4X/9/7/7/97756b0932c87ce65e6b7a7ff71e2adf599d13b6.png) ![256853-matfunc2.png](https://d3kjluh73b9h9o.cloudfront.net/original/4X/5/a/9/5a9d28023be676545509fa60a1e12318fbf48b69.png) ![256854-testmat.png](https://d3kjluh73b9h9o.cloudfront.net/original/4X/5/a/9/5a9118ae76b062dac02cb906ba56ac73f1e5b352.png) ---
**Author:** ![MaxPower42](https://d3kjluh73b9h9o.cloudfront.net/original/4X/2/8/5/28502927f1d97ba1051b3b47ccfe17233bf41ef0.png) [@MaxPower42](https://forums.unrealengine.com/u/MaxPower42)\ **Post date:** [October 17, 2018, 4:00pm UTC](https://forums.unrealengine.com/t/gui-material-with-smooth-outliner-border-effect/435827/2 "2018-10-17T16:00:26Z")
Forgot to mention, but it probably goes without saying that I want to create round corners. The edges are ok. ---
**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:** [October 17, 2018, 4:14pm UTC](https://forums.unrealengine.com/t/gui-material-with-smooth-outliner-border-effect/435827/3 "2018-10-17T16:14:50Z")
9 slice does the same, are you specifically after a pure material solution? ---
**Author:** ![MaxPower42](https://d3kjluh73b9h9o.cloudfront.net/original/4X/2/8/5/28502927f1d97ba1051b3b47ccfe17233bf41ef0.png) [@MaxPower42](https://forums.unrealengine.com/u/MaxPower42)\ **Post date:** [October 17, 2018, 4:22pm UTC](https://forums.unrealengine.com/t/gui-material-with-smooth-outliner-border-effect/435827/4 "2018-10-17T16:22:32Z")
What other solution is there? If you mean a texture-solution, I’d prefer material. ---
**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:** [October 17, 2018, 4:34pm UTC](https://forums.unrealengine.com/t/gui-material-with-smooth-outliner-border-effect/435827/5 "2018-10-17T16:34:09Z")
Well yes, it’s a texture solution - [9 slice](https://docs.unrealengine.com/en-US/Engine/UMG/UserGuide/Styling). Check the _Setting Images States_ section in the above link - 9-slice is an automatically expanding border that preserves edges. Essentially what you’ve described but it’s a simple texture rather than an, arguably, expensive material.