ShinyEffectModule – Customizable Shiny Gradient Effect for GUI Elements
Hello fellow developers,
I’m excited to share ShinyEffectModule, a flexible module that lets you add a dynamic, shiny gradient effect to any GUI element! Whether you’re designing buttons, frames, or other UI elements, this module allows you to customize the effect with a variety of parameters.
Features
Customizable Direction – "leftToRight" or "rightToLeft"
Looping Animation – Enable or disable infinite looping
Adjustable Shiny Color & Brightness – Set your preferred shiny color and brightness
Smooth Transitions – Control gradient width, center position, and blending
Custom FPS Option – Use a manual update loop for smoother control
TweenService Support – Automatically animates with TweenService
Download
Get the module here: ShinyEffectModule
How to Use
- Insert the module into ReplicatedStorage or any preferred location.
- Require the module in a LocalScript.
- Apply the effect to any GUI element.
Example Code:
local ReplicatedStorage = game:GetService("ReplicatedStorage")
local ShinyEffect = require(ReplicatedStorage.ShinyEffectModule)
ShinyEffect.Apply(script.Parent, 2, {
direction = "leftToRight",
loop = true,
shinyColor = Color3.new(1, 1, 1),
rotation = 10,
shinyWidth = 0.15,
brightnessScale = 1.5,
centerPosition = 0.5,
transitionFactor = 0.2,
tweenDelay = 0,
tweenEasingStyle = Enum.EasingStyle.Linear,
tweenEasingDirection = Enum.EasingDirection.Out,
customFPS = 60
})
Configuration Options
| Option | Description |
|---|---|
direction |
"leftToRight" (default) or "rightToLeft"
|
loop |
true (default) for infinite looping, false for one-time effect |
shinyColor |
Color of the shiny streak (default: white) |
rotation |
Rotation angle of the gradient (default: 45°) |
shinyWidth |
Width of the shiny streak as a fraction (default: 0.1) |
brightnessScale |
Adjusts brightness of the shine (default: 1) |
centerPosition |
Controls where the shine appears along the gradient (default: 0.5) |
transitionFactor |
Smoothens edges of the shiny streak (default: 0.2) |
tweenDelay |
Delay before starting animation (default: 0) |
tweenEasingStyle |
Tween easing style (Enum.EasingStyle.Linear default) |
tweenEasingDirection |
Tween easing direction (Enum.EasingDirection.Out default) |
customFPS |
If set, overrides TweenService with a custom FPS update loop |
How It Works
- The module retrieves the GUI’s
BackgroundColor3and creates aUIGradient. - A shiny streak is added to the gradient with calculated keypoints.
- Animation is handled by TweenService or RunService (if using
customFPS).
Example use case:
Note: The button in the video is using tweening by Auto Tween Pro.
Feedback & Support
If you have any questions, suggestions, or improvements, feel free to comment below! Hope this helps you add some extra flair to your UI.
Happy developing! 
