Scripting HelpersARCHIVE
A little piece of Roblox history. Preserved for everyone, one question at a time.Read about the archive →
All questions/Question #55609
✓ ANSWER ACCEPTED

How to make smooth Color3 transitioning?

Asked 1,993 views2 answers

2 answers

✓ Accepted answer

There are two ways this can be done. The first would be to use the lerp function in a Color3 and the second would be to use the TweenService which in my opinion is better.

using lerp:-

local runServ = game:GetService('RunService')
local frame = script.Parent

-- new random number generator 
local randomGen = Random.new(wait() * 10 + wait() * 10)
local cur = frame.BackgroundColor3
local nextColor3 = Color3.fromRGB(randomGen:NextInteger(0, 255), randomGen:NextInteger(0, 255), randomGen:NextInteger(0, 255))

while true do
	-- lerp loop
	for i=0, 100 do
		frame.BackgroundColor3 = cur:Lerp(nextColor3, i/100)
		runServ.Heartbeat:Wait() -- one lerp per frame
	end
	-- swap color3
	cur = nextColor3
	nextColor3 = Color3.fromRGB(randomGen:NextInteger(0, 255), randomGen:NextInteger(0, 255), randomGen:NextInteger(0, 255))
end

using tween service:-

local tweenServ = game:GetService('TweenService')
local frame = script.Parent

-- new random 
local randomGen = Random.new(wait() * 10 + wait() * 10)
local tweeninfo = TweenInfo.new()-- def settings

local function mkTween()
	-- create a new tween and return it
	return tweenServ:Create(
		frame, 
		tweeninfo, 
		{BackgroundColor3 = Color3.fromRGB(randomGen:NextInteger(0, 255), randomGen:NextInteger(0, 255), randomGen:NextInteger(0, 255))}
	)
end

while true do
	local tween = mkTween()
	tween:Play() -- play
	tween.Completed:Wait() -- wait for completed
end

I hope this helps.

AnonymousPermalink

Heres an example where it smoothly goes from white to red.

-- Inside ur Frame


local start = Color3.new(1,1,1)-- White
local End = Color3.new(1,0,0)--Red

for i = 0,1,0.03 do
    wait()
    script.Parent.BackgroundColor3 = start:lerp(End,i)
end
AnonymousPermalink

5 comments

0

i didn't know that Color3 have a lerp() function

Anonymous#
0

Well did it help / work ( was it ur answer )

Anonymous#
0

i would not use wait() since it will make it look laggy.

Anonymous#
0

Can you use game:GetService("RunSerivce").RenderStepped:wait() ?

Anonymous#
0

I would personally work on a per frame basis to help with performance but that should be ok.

Anonymous#

This discussion is preserved as it was. New answers, comments, and votes are closed.