UIGradient [LIVE]

Updates Announcements
#134

I guess this also allow to make something circular instead of using ViewportFrame which this Post told (Only circular tho).

#135

It was rolled out earlier in the month but was rolled back due to various complaints.

I can use one word to describe what it was - HUGE!

1 Like
#136

this isn’t a plugin. And this is awesome! now my Custom Chat looks good!

1 Like
#137

Looks gorgeous! I can’t tell you how many times I used to use the trick where I upload a white-to-transparent image and use color settings to fake gradients. This update is exciting!

2 Likes
#138

image
image1594×683 194 KB

All the possibilities that you could do with these gradients!!
Honestly my favorite update of 2019.
Thank you roblox so much

6 Likes
#139

brooo that looks SICK HOW DID YOU DO IT :o

2 Likes
#140

How can I enable this feature?

1 Like
#141

This is answered in the original post.

4 Likes
#143

File → Beta Features

If you don’t see it, make sure you opt in to the beta list.

#144

How can you make Text Gradient?

1 Like
#145

After inserting the UIGradient, you just need to change the text color to white, as black can’t be affected by gradients.

The UIGradient affects both the background and the text.

Screenshot_2785

3 Likes
#147

UIGradient is fun
Edit: Tutorial
4009cc41f01de89fb9ff6dbb0378d627

39 Likes
#148

I made this Roblox Studio! No external program used! :smiley:

image

2 Likes
#149

Having fun with this awesome UIGradient feature! :sparkles: :happy3:

image
image1000×567 259 KB

EDITED: Also, I can do this with text too!

image
image1000×567 397 KB

7 Likes
#150

I cannot wait for this feature to be added, I am so excited!

#151

I really hope that this is released in january. This is a really great feature.

#152

I love this update so much.

gradient

14 Likes
#153

I would recommend it for some phone backgrounds if doing a model and trying to do not use any painting program.

I can see this is stable. Should go outside beta testing

#154

hmm did you mean ImageLabels? Because I’ve never heard about an option to add decal into GUI Object.

#155

After playing with this for a while I found that it’s very easy way to do Health or Progress Bars
it works thanks to Offset property inside GuiGradient (I will tell about it later in this post)

So I made working health bar
(if you want you can add keypoints and make it rainbow)
After Taking Damage

image
image1233×809 692 KB

Before Taking Damage
image
image1234×819 686 KB

How to make this?
  1. You need to make Frame and put GuiGradient in it
    image
  2. (optional) if you want vertical bar like mine, set Rotation preperty to 90
    image
  3. Make one side color you want gradient to be (left side need to be black)
    image
  4. Add Keypoint and move it as close as possible (but not directly on it) to black color and make it same color as second (here: red)
    image
  5. Insert LocalScript (or Script if it’s on Surface/BillboardGui)
    image
  6. Type this code
while wait(0.001) do -- infinite loop with 0.001 sec delay
	local health = game.Players.LocalPlayer.Character.Humanoid.Health / 100 -- Health of player divided by 100
	script.Parent.Offset = Vector2.new(0 , 1) + Vector2.new(0,  -health) -- set offset to Y 1 plus negative health
end -- close loop
  1. Done, enjoy your new health bar

Have a nice day, bye

3 Likes