Heya Developers!
Ever thought of adding Gradient in your bubble chat? Or did you think it’s not possible? It’s possible! And it’s really easy. Introducing Bubbient! I made a simple module which allows you to add Gradient effect in your bubble, really easily. I’m using UIGradient to add gradient into bubblechat. Means, you can easily configure it! And you can also add rainbow effect! Let’s set it up.
About Bubbient
Bubbient is a simple script, a modified version of Roblox’ original BubbleChat script. Ths allows you to add gradient in your bubble chat, change text font, and color. It also includes animated rainbow effect! And it’s really super easy to set up!
Model Info
This model includes these items so far:
You won’t need “instruction” and “ThumbnailCamera”. Simply delete them.
BubbleChat: This is the main modified script. This allows you to get gradient chat!
ChatEnabler: Enables the bubble chat for you. If you have it enabled already, you won’t need it.
normalGradient: The gradient effect that you’ll add in your bubble chat. You can customize it yourself
rainbowGradient: This gradient is used when you have turned rainbow settings on. I don’t recommend customizing it since the AnimationScript does it itself.
AnimateScript: This script generally animates the rainbow. This was originally made by @TheCarbyneUniverse, you can find the post here.
Setting Up
In order to make Bubbient work, you need to set it up - by putting it in their place.
- Open Explorer
- Put ‘BubbleChat’ script inside ‘Chat’
- Put ‘ChatEnabler’ script inside ‘ReplicatedFirst’
Doing this, will automatically set the default settings of Bubbient.
View Default Settings
Default Settings
Gradient:
Text Font: Cartoon
Text Color: White
Rainbow Animation: Disabled
Changing Gradient
You can change the default gradient, into any you want. I actually recommend using two colors in the gradient. If you are willing to use rainbow animation, you don’t need to do this step.
- Inside BubbleChat, find normalGradient
- Go to normalGradient properties, click on
<ColorSequence>
- Click on the three dot that appears on the right side of
<ColorSequence>
- Click on the triangle allows, click on colour and change it’s color. Then click close.
Changing Text Font & Color
You can easily change text font and color.
- Open BubbleChat script
- In line 7, change the number into the color you want. Make sure to turn your color into a rgb.
- In line 8, at
Enum.Font.Cartoon
- replace Cartoon with the font you want. Make sure to type the exact name of the font, and it must be available in ROBLOX. No custom font would work,
Enabling Rainbow
If you want to enable animated rainbow effect, simply do this
- Open BubbleChat script
- In line 9, replace
isRainbow = false
intoisRainbow = true
and you are done!
Example
Normal Gradient
Animated Rainbow Gradient
Sorry for bad quality, it’s because of the recorder.
Or play this game, to see the animated rainbow chat yourself!
Credits
Written by: jeditkacheff, TheGamer101 (Roblox staff)
Configured to customize easily by Techyfied, original idea by realmile
TheCarbyneUniverse for the rainbow animation script.