Is it possible to invert the color of a UI?

Help and Feedback Scripting Support
#1

  1. What do you want to achieve? Keep it simple and clear!
    I want to invert the color of a UI object

  2. What is the issue? Include screenshots / videos if possible!
    I can’t seem to find any solution

  3. What solutions have you tried so far? Did you look for solutions on the Developer Hub?
    I’ve looked on the DevForum, but couldn’t find anything and used a calculation for inverting a color but it doesn’t seem to work.

local RunService = game:GetService("RunService")

local R, G, B = Color3.new(0, 170, 99)

RunService.RenderStepped:Connect(function()
   Frame.BackgroundColor3 = Color3.new(R, G, B)
end)

while true do
   R, G, B = R - 255, G - 182, B - 193

   wait(10)
end
1 Like
#2

Something like this would work:

function invertColor(c: Color3): Color3
    return Color3.fromRGB(255 - c.R, 255 - c.G, 255 - c.B) --This is wrong, see comments for solution by @Scarious
end

function invertColors(o: GuiObject)
    o.BackgroundColor3 = invertColor(o.BackgroundColor3)
end

while wait() do
    invertColors(frame)
end

Although you might want to work in HSV color space instead of RGB. You can read more about that here Color3

5 Likes
#3

Worth mentioning that Color3.R returns a float between 0 and 1, not 0 and 255. So your invertColor function would instead be:

function invertColor(c: Color3): Color3
    return Color3.new(1 - c.R, 1 - c.G, 1 - c.B)
end
4 Likes
#4

That or multiply each color channel by 255.

1 Like
#5

Use task.wait() instead of wait() and define your functions locally.