How to tween custom gradients

[NyrionDev (Nyrion)]

This isn’t a topic about fixing a script, but I consider a solution to this very helpful for a lot of devs. I am trying to achieve a smooth gradient animation on custom gradients without using Offset and TweenService doesn’t seem to work for this(as shown in the image below).

The issues i’ve run into so far:

1. moving every keypoint by 0.1 the sequence wont start from 0 or 1(meaning I have to create more keypoints)
2. changing time position to the next isn’t smooth
3. attempting to make different sequences depending on gradient doesn’t seem reliable(for example a specific script that only makes a rainbow sequence using math).

I want the script to be able to read a custom amount of keypoints and smoothly animate them, without breaking the illusion(something which Offset does) and without being computational expensive. I don’t expect you to reply with only codeblocks, ideas and discussions are welcome.

My idea was the creation of a module able to handle the corner cases, and calculate the color at any given moment. Although I expect it to be expensive and I don’t know if I am on the right track.

[matthew523 (Matthew)]

There is the property of
ColorSequence.KeyPoinst from which you can collect all the keypoints. Where both value and time can be extracted from the keypoint.

[NyrionDev (Nyrion)]

I know how to obtain keypoint data. The issue is I don’t know how to manipulate it to have the wanted result(basically I need to move the gradient a bit each frame in a looped way).

[NyrionDev (Nyrion)]

I ended up following this reply:

How to make Moving Gradient

One smoother option is that you could manually calculate the color of each keypoint every frame, which is complex but probably not a bad solution. Here’s a working implementation (sorry formatting is a little stuffed up mb): local colors = { BrickColor.new("Bright red").Color, BrickColor.new("Bright orange").Color, BrickColor.new("Bright yellow").Color, BrickColor.new("Bright green").Color, BrickColor.new("Bright blue").Color, BrickColor.new("Royal purple").Color } loca…

The only thing I had to do was create a function that gets the keypoint colors:

function GetColors(sequence)
	local colors = {}
	for i, v in pairs(sequence.Keypoints) do 
		table.insert(colors, v.Value)
	end
	return colors 
end

local colors = GetColors(Gradient.Color)