Rainbow UIGradient

[MattyGamin (xMatt)]

I want a rainbow gradient that is on a loop such as this https://gyazo.com/eb2dae3b3f342bcf55f489916598ed75 and this https://cdn.discordapp.com/attachments/700603505022337025/700605775701082212/Screen_Recording_2020-04-17_at_3.16.33_AM.mov

I can’t seem to get it how the example is

I used offset https://cdn.discordapp.com/attachments/306156119519264770/700616122864631858/Screen_Recording_2020-04-17_at_3.57.23_AM.mov and I even tried the method from Developer Hub sheen effect on their developer wiki for UI Gradient, The Sheen Effect where they checked If the X’s value was less than -1 and set it back. It just doesn’t work. I tried Color3.fromHSV and I still couldn’t manage to get it to work.
I even when as far as to doing this.

local runservice = game:GetService("RunService")
local first = ColorSequence.new{
    ColorSequenceKeypoint.new(0,Color3.fromRGB(255,0,0)),
    ColorSequenceKeypoint.new(0.2,Color3.fromRGB(255,255,0)),
    ColorSequenceKeypoint.new(0.4,Color3.fromRGB(0,255,0)),
    ColorSequenceKeypoint.new(0.6,Color3.fromRGB(0,255,255)),
    ColorSequenceKeypoint.new(0.8,Color3.fromRGB(0,0,255)),
    ColorSequenceKeypoint.new(1,Color3.fromRGB(255,0,255)),
}
function toHSV(color)
    local hue = tick()%5/5
    local h,s,v = Color3.toHSV(color)
    return Color3.fromHSV(hue+h,1,1)
end
runservice.RenderStepped:Connect(function()
    local new = toHSV(first.Keypoints[1].Value)
    local new2 = toHSV(first.Keypoints[2].Value)
    local new3 = toHSV(first.Keypoints[3].Value)
    local new4 = toHSV(first.Keypoints[4].Value)
    local new5 = toHSV(first.Keypoints[5].Value)
    local new6 = toHSV(first.Keypoints[6].Value)
    local newcolor = ColorSequence.new{
    ColorSequenceKeypoint.new(0,new),
    ColorSequenceKeypoint.new(0.2,new2),
    ColorSequenceKeypoint.new(0.4,new3),
    ColorSequenceKeypoint.new(0.6,new4),
    ColorSequenceKeypoint.new(0.8,new5),
    ColorSequenceKeypoint.new(1,new6),
    }
    script.Parent.Color = newcolor
end)

I’ve been attempting for really long on how to get this gradient to work as I wanted and is not working please someone help out asap!

[DataErased]

I’ve created a quick working example, although it’s not seamless at all. I’m sure it’d be possible to achieve a more seamless version through better offsetting, but here’s what I have:
https://gyazo.com/c13f71b15c777530e4824d303d630b6e

How I went about it:

local thing = script.Parent
local uiGradient = thing:WaitForChild("UIGradient")
local tweenService = game:GetService("TweenService")

while true do
	local tween = tweenService:Create(uiGradient, TweenInfo.new(1.5, Enum.EasingStyle.Linear), {Offset = Vector2.new(-0.3, 0)})
	tween:Play()
	wait(1.5)
	uiGradient.Offset = Vector2.new(0, 0)
end

EDIT: Here my new slightly newer version of my previous script, with a much better, yet still imperfect, outcome.
https://gyazo.com/2020f15c3b14a1ee0f6841fcda5b741d

local thing = script.Parent
local uiGradient = thing:WaitForChild("UIGradient")
local tweenService = game:GetService("TweenService")

while true do
	local tween = tweenService:Create(uiGradient, TweenInfo.new(2, Enum.EasingStyle.Linear), {Offset = Vector2.new(-1, 0)})
	tween:Play()
	wait(2)
	uiGradient.Offset = Vector2.new(1, 0)
	local tween2 = tweenService:Create(uiGradient, TweenInfo.new(2, Enum.EasingStyle.Linear), {Offset = Vector2.new(0, 0)})
	tween2:Play()
	wait(2)
end

[DataErased]

I’m oddly devoted to solving this, and thus I came up with a solution like this:
https://gyazo.com/0318853643b964add3d8c5a9a80be728

It requires the first color sequence keypoint and the last one to be white (RGB 255,255,255)

[MattyGamin (xMatt)]

I’ve done this method as well, leaving it to look like this. I honestly was hoping to get a smooth transition but it isn’t possible for me. https://cdn.discordapp.com/attachments/655333571686432768/700107540268318750/Screen_Recording_2020-04-15_at_6.16.33_PM.mov

[DesertedVoltron]

Here’s the code that I made for a rainbow gradient. I don’t know if it is a good way to do it, but it works.

grad = script.Parent -- the gradient
t = 1 -- amount of time it takes to get from 0 to 1
range = 7 -- amount of colors

while wait() do
	local loop = tick() % t / t -- returns value from 0 to 1
	colors = {} -- table of colors
	for i = 1, range + 1, 1 do
		z = Color3.fromHSV(loop - ((i - 1)/range), 1, 1)  -- subtracting by a fraction essentially "rewinds" the color to a previous state
        -- I subtract one from "i" because Lua has a starting index of one
		if loop - ((i - 1) / range) < 0 then -- the minimum is 0, if it goes below, add one
			z = Color3.fromHSV((loop - ((i - 1) / range)) + 1, 1, 1)
		end
		local d = ColorSequenceKeypoint.new((i - 1) / range, z)
		table.insert(colors, #colors + 1, d) -- insert color into table
	end
	grad.Color = ColorSequence.new(colors) -- apply colorsequence
end

-- going left
--[[
while wait() do
	local loop = tick() % t / t
	colors = {}
	for i = 1, range + 1, 1 do
		z = Color3.fromHSV(loop + ((i - 1)/range), 1, 1)
		if loop + ((i - 1) / range) > 1 then
			z = Color3.fromHSV((loop + ((i - 1) / range)) - 1, 1, 1)
		end
		local d = ColorSequenceKeypoint.new((i - 1) / range, z)
		table.insert(colors, #colors + 1, d)
	end
	grad.Color = ColorSequence.new(colors)
end
--]]

[MattyGamin (xMatt)]

It brings up an error “attempt to get length of a userdata value” for this line

table.insert(colors, #colors + 1, d)```

[DesertedVoltron]

That’s quite strange. I just tested the script again, are you sure it’s not on your side?

[MattyGamin (xMatt)]

Its a local script and its inside a UI Gradient with 6 colors, I thought since there’s 6 key points that the range should be 6. I don’t know if I’m doing this right though.

local grad = script.Parent
local t = 1 
local range = 6

while wait() do
	local loop = tick() % t / t
	local colors = {ColorSequence.new{
		ColorSequenceKeypoint.new(0,Color3.fromRGB(255,0,0)),
		ColorSequenceKeypoint.new(0.2,Color3.fromRGB(255,225,0)),
		ColorSequenceKeypoint.new(0.4,Color3.fromRGB(0,255,0)),
		ColorSequenceKeypoint.new(0.6,Color3.fromRGB(0,255,255)),
		ColorSequenceKeypoint.new(0.8,Color3.fromRGB(0,0,255)),
		ColorSequenceKeypoint.new(1,Color3.fromRGB(255,0,255))
	}}
	for i = 1, range + 1, 1 do
		z = Color3.fromHSV(loop - ((i - 1)/range), 1, 1)
		if loop - ((i - 1) / range) < 0 then
			z = Color3.fromHSV((loop - ((i - 1) / range)) + 1, 1, 1)
		end
		local d = ColorSequenceKeypoint.new((i - 1) / range, z)
		table.insert(colors, #colors + 1, d)
	end
	grad.Color = ColorSequence.new(colors)
end

[DesertedVoltron]

Sorry for not elaborating further on how to use this script. This script doesn’t use the points in your gradient. It simply generates a color of the rainbow and places it on. The “colors” variable is meant to be an empty table. The for loop quickly adds the colors of the rainbow. The end of the script places the colors on.

[MattyGamin (xMatt)]

ohhh ok I’ll try it later, if it works I will make your answer a solution. Thanks so much !