0 votes

Hello all,

I am pretty new to godot and graphic engine overall. I am trying to create a fix background for a mobile app project with a gradient color (from white to blue). I was thinking of doing this with a ColorRect node but it does not seem to have this as an option. I found the Gradient object class in godot doc but I cannot find how to apply it to the ColorRect. Any suggestion on how to do this ?

in Engine by (15 points)

I forgot to mention that the mobile app I work on only uses 2D interfaces.

1 Answer

+1 vote
Best answer

you can make a setup as follows

  • Camera
    -- MeshInstance

MeshInstance ->
Mesh: quad
Material: SpatialMaterial
flags: unshaded
flags: fixed size
parameters: Depth Draw Mode > never
parameters: Billboard > enabled
Albedo: Texture > your gradient

then make the quad as large aas the viewport of the camera
this should do it

by (4,068 points)
selected by

Ok. That's definitly an approach I would not have thought of. Not sure I understand the logic behind it either though.
My app is a 2D interface. Why would you go for using a camera?
Otherwise, you suggest using the gradient I want as a texture. So, I would need to make a texture outside of godot and import it? Would that work in a ColorRect node as well? Is there a way in godot to create a texture that applies the wanted gradient described in my original post?

Thanks a lot for your help !

When its a 2d Interface then just use TextureRect. There you can load a texture or create a new gradient texture with a new gradient.
Check expand on the textureRect for upscaling.

TextureRect and creating a new gradient texture in it works great ! Thanks a lot for your help klaas !

This helped me, thanks!

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.