Dear Devforum members,
I am a UI designer creating UI since 2017 and I am currently making a new design in ROBLOX inspired by Microsoft’s Fluent Design which features a blurred background.
The problem is I do not want to use Neon parts for blurring it. I have seen someone made blurred background in ROBLOX.
If you don’t understand what I am saying, take a look of the picture:
If you know how to make this, please tell me. Thank you 
Best regards,
ManamiWasThere
Unfortunately, you can’t use blur on ScreenGuis. I believe the only approach to this would be having to use neon parts or making a blurred image with Photoshop.
This post might be helpful.
Unfortunately , I do believe I seen someone blur on screengui without using neon parts
It’s pretty much one of the only ways to create the effect you’re looking for, you probably wouldn’t notice the neon parts since they’re usually scaled to a relatively small size and placed directly in front of the camera.
What I found ^
Would it work if I am making the frame draggable?
You could by CFraming the parts on every frame but there probably is a better way to achieve the desired effect I myself don’t know about.
I tried using a viewportframe and a neon part, didn’t work for me, maybe it will for you. However I found that using glass material and messing with the reflectiveness & transparency can give off a nice glass overlay effect.
I’ll try that method, thank you.
I know I’m late, but maybe you could add the Blur to the Camera (local of course), and adjust it when needed.
Pros: Gives you a dynamic-blur.
Cons: Blur is on the whole screen, and is not a GUI.
(Won’t blur GUIs, but you can add transparency to the GUI to make it look somewhat blurry too.
However, if you’re just looking for a blurry background, then I’d definitely go for the “BlurEffect”)
I think you can blur it by making a separate blurred image in Photoshop that has a transparent background (By that I mean no background at all, no colors etc…) and then just make an image label and just scale it the size you want.
For more info please reply to this reply!
Edit: Sorry for the late reply!
That was my first Idea when trying to achieve this but I can’t figure out how to do this with gimp. If you could elaborate that would be useful.
EDIT: Sorry for asking this even though it was 5 months ago.
Never mind! Just make a script that adds more blur from the lighting service.
Idea: Whenever the player clicks a certain button, the game adds more blur.
One way is to keep A BlurEffect in Lighting and change it to Enabled when you want it to be enabled.
No, you can’t blur only part of the screen. You can only blur the whole screen (with a BlurEffect). But there are several feature requests for this:
You can give them all a heart so that it’s more likely for Roblox to add this
Actually, I’ve found a way which is with the use of viewportframe and glass
Really? Can you tell me how?
Why would you need glass? aren’t viewport frames alone enough?
For example, if we pin the player’s screen and there is a BasePart with Decal on the screen instead of the UI, and we can set it using blur from Lighting.
For example, we make spaces between a few UIs and we use decal and blur in the part in those spaces?
example image:
