Gradient Service Module

Say hello to GradientService!

You can now:

  • Render gradient text
  • Render box outline gradients
  • Render full gradients (I know you can do this with UI gradient but… yeah, I have nothing)
  • Render circle outline gradients (not recommended)

You can pick it up here:

Usage of the script:

local GradientService = require(<pathtomodulescript>)

GradientService:TextGradient(<parent Object>, <text String>, <textsize Int>, <font Enum>, <colour1 Color3>, <colour2 Color3>) 
GradientService:RectGradient(<parent Object>, <size_x Int>, <size_y Int>, <colour1 Color3>, <colour2 Color3>)
GradientService:CircleGradient(<parent Object>, <radius Int>, <textsize Int>, <colour1 Color3>, <colour2 Color3>) 
GradientService:RenderGradient(<parent Object>, <size_x Int>, <size_y Int>, <colour1 Color3>, <colour2 Color3>) 
GradientService:SliderGradient(<parent Object>, <info Table>, <colour1 Color3>, <colour2 Color3>)
GradientService:RainbowGradient(<parent Object>, <speed Number>)

Let me know if you want any new features added and I’ll try my best to update it. Cheers.


  • Version 2:
    • There is now lossy compression with a simple algorithm: to put it quite simply, the code now looks at the overall change in colour between each frame and if 2 colours are very closely related then it will simply replace 2 frames with one wider frame to minimise the amount of frames created as a result of rendering.
  • Version 3:
    • Added Slider Gradient (for rendering a gradient between 0 and info.Max).
    • Added Rainbow Gradient (for rendering a rainbow gradient at speed in target).


wow this is very helpful love it! i wonder why no one saw this topic LOL


It’s really really helpful! Just like @Creeperman16487, I’m wondering why did anybody didn’t saw this lol

1 Like