How to alter gradient colours with UIGradient with a script

Help and Feedback Scripting Support
#1

I have a button in my game called try your luck and it’s on a screen GUI that is a gradient of deep blue to light blue using the new UIGradient object they have in the beta. Let’s just say for the sake of simplicity when I click it I want to change the gradient to yellow and green.
So this is my button
image
and when I click you click it, it turns to yellow and green in a script.
image
This is a beta still from Roblox and you can find that here

I’m not quite sure how to do this as gradients are new and I don’t think Color3 will work as that’s for block colors. I have seen posts under the Roblox beta that have done this but made a new topic for it as there are probably others wondering the same. :smile:

The properties for the gradient is under image and image

7 Likes
#2

There’s lots of information online if you just search!

I found this page on the API Reference Manual

3 Likes
#3

You can do something like:

UIGradient.Color = ColorSequence.new(Color3.new(1,1,0), Color3.new(0,1,0))
8 Likes
#4

Ok sure to read up on it. Tried searching for it on wiki but didnt come up with anything probs using the wrong keywords

#5

yup the colour is changing thank you for the help!

1 Like
#6

FYI: You can use ColorSequenceKeypoints to give the exact time in the ColorSequence for the color to be.
The ColorSequenceKeypoints must be given in an array to a ColorSequence.new constructor.
In the ColorSequenceKeypoint.new constructor you give the float time and the Color3 color.

For example:

UIGradient.Color = ColorSequence.new({
    ColorSequenceKeypoint.new(0, Color3.new(1,0,0)),
    ColorSequenceKeypoint.new(0.5, Color3.new(0,1,0)),
    ColorSequenceKeypoint.new(1, Color3.new(0,0,1))
})

This will create an effect constrasting from red to green to blue.

31 Likes