+2 votes

I am trying to create a game that emulates the windows fluent design, most of it is fairly doable with shaders but I am struggling with one problem that I cannot seem to figure out:

How can I create a blurry background that shows the stuff behind the app in a blurry way? Something like this:
blurry backgruond

Setting the entire viewport transparent is doable with


and then I tried to add a shader:

shader_type canvas_item;

void fragment(){
vec4 color = texture(SCREEN_TEXTURE,SCREEN_UV,2);
COLOR = color;

but the shader only shades what is in Godot itself, so it doesn't help.

I thought about using some kind of screen capture and setting that as a background texture but the problem there is that I wouldn't get the stuff behind the game but rather the game itself, so this doesn't help either.

Is there a way of doing this at all?

in Engine by (252 points)

what if you try to reduce the opacity of the background, then add a texture with a blur shader behind the background?

Please log in or register to answer this question.

Welcome to Godot Engine Q&A, where you can ask questions and receive answers from other members of the community.

Please make sure to read Frequently asked questions and How to use this Q&A? before posting your first questions.
Social login is currently unavailable. If you've previously logged in with a Facebook or GitHub account, use the I forgot my password link in the login box to set a password for your account. If you still can't access your account, send an email to [email protected] with your username.