Gradient animation script

I made this to use with nametags in my games and decided I might aswell share it for anyone who might be looking for something similar.

To use it put it in a UIGradient and then duplicate the UIGradient into whatever ui object you want to use it on.

This works by calculating a time position value from the current tick, speed in seconds and the amount of colors used.

Here’s the formula I came up with for anyone interested:
chrome_EYEA9ZSfR8

This is what it looks like in action (using a rainbow colorset)
nnx5L5e6NS

Script
local colorTable = {
	[1] = Color3.fromRGB(255, 0, 4),
	[2] = Color3.fromRGB(255, 149, 0),
	[3] = Color3.fromRGB(251, 255, 6),
	[4] = Color3.fromRGB(28, 255, 26),
	[5] = Color3.fromRGB(44, 93, 255),
	[6] = Color3.fromRGB(255, 26, 252),
}

local speed = 3

function sort(t)
	local newtab = {}
	
	for i = 1, #t do
		local got = nil
		
		for _, v in ipairs(t) do
			if table.find(newtab, v) == nil then
				if got == nil or v.Time < got.Time then
					got = v
				end
			end
		end
		
		--print(i, got)
		newtab[i] = got
	end
	
	newtab[1] = ColorSequenceKeypoint.new(0, newtab[#newtab - 1].Value)
	newtab[#newtab] = ColorSequenceKeypoint.new(1, newtab[2].Value)
	
	return newtab
end

function calc(i, s, vc)
	return (tick() + ((s/vc) * i)) % s / s
end

function loop()	
	while wait() do
		
		local start = ColorSequenceKeypoint.new(0, Color3.fromRGB(0,0,0))
		local finish = ColorSequenceKeypoint.new(1, Color3.fromRGB(0, 0, 0))
		
		local tab = {
			start, finish
		}
		
		for i = 1, #colorTable do
			table.insert(tab, ColorSequenceKeypoint.new(calc(i, speed, #colorTable), colorTable[i]))
		end
		
		tab = sort(tab)
		local rainbow = ColorSequence.new(tab)
		script.Parent.Color = rainbow
	end
end

script.Parent.AncestryChanged:Connect(function()
	loop()
end)

To edit the amount of colors you want aswell as the colorvalues do so in the colortable at the top.

14 Likes

Wow! This looks good. C: Well done.

1 Like