CS Studio | Professional gradient design

AppImage

CS Studio


RobloxCreatorStore | LinkIcon · LinkIcon · LinkIcon · LinkIcon


CS Studio makes creating and editing gradients for UI’s, beams, trails, and particle emitters incredibly easy. In this showcase we’ll walk through the steps of creating a perfect hue that we can later use to make a color selector for our car customization system, something difficult to do in Roblox Studio’s gradient editor.

CS Studio’s Keypoint Stacking ensures all of your gradient’s keypoints are visible so you have no trouble selecting or moving them. And when you want to evenly space out your gradients, snap increments let you define exactly where keypoints snap to and a built-in math engine makes it even easier.

2|0x0

We can use the math engine to set the snap increment and then follow the placement guide to evenly place keypoints on the gradient.

CS Studio’s color selector features two color pickers and 5 color spaces. Both color pickers are great for experimenting with new colors, but to make a hue for our color selector, we’ll be using the color spaces, specifically HSV.

4|0x0

Now that’s we’ve created all of our keypoints it’s time to start giving them some color. We’ll use the slider on the S component to bring that value all the way up and we’ll use the text box on the H component to apply the hue.

When we set the blue color we can, again, use the math engine to calculate what the value should be. When applying the magenta color, the math engine is able to compute a multi-operator equation.

You can save gradients to use across different games and for later when you need to refer back to one.

6|0x0

For the final step, we’ll use this feature to save our hue gradient so we can use it later.

The more menu lets you make quick changes to the entire gradient and export to code. And if you wanted to create a trail customization system, you could use CS Studio to export those gradients into a script and quickly apply them from there.


API Permissions:

Script Injection: is only requested and required when exporting a gradient to code.


What’s new:

Nothing for now


RobloxCreatorStore | LinkIcon · LinkIcon · LinkIcon · LinkIcon


Version 2.6.6

Thank you.

19 Likes

Phew, it’sa good thing that I got all your plugins before you made them paid! They are some really useful and good looking ones! Anyways for this one it’s also really great! Though, could it be possible for you to maybe add other gradient types in the future maybe? As this is just a replacement for an existing feature so it would be really awesome if you could add more features just like I mentioned adding other gradient types maybe using images, to it.

5 Likes

isn’t this identical to the default gradient editor?

2 Likes

If you take a look at the plugin demonstration you would realize that there are plenty more features this plugin provides that the default editor does not.

3 Likes

there’s like one extra feature, being the exporting of sequences. who’s paying $10 for exporting a colorsequence when it could be done on the command line

2 Likes

There is much more than one extra feature. You are also severely underestimating the work that goes into creating a plugin like this.

Nobody is forcing you to buy it. Let developers price their own work however they see fit. Arguing about it is petty at best.

2 Likes

I’m glad you’ve been enjoying my plugins! With the current tech in Roblox, it’s not possible to make angular and radial gradients while also letting the user select how many keypoints they would like to use in a performant way.

1 Like

You don’t play a game because people worked hard on it, you play it if it’s fun. In this case, the only useful feature can be done with the command bar.

1 Like

Editable Images could help you in that. Though, it would be hard but it’s not impossible. They are also quite performant.

1 Like

That’s a good idea and what I had in mind, but i’ll have to look into how much CPU power it takes to apply gradients to all those pixels. Multi-threading on Roblox still seems to be in it’s early stages right now.

1 Like

Fair enough, but the only real lag os while applying stuff so in late game it shoukd be quite fine (like you said). It would also be quite an amazing feature honestly as currently this plugin is only a replacement to roblox’s default color sequence editor with more features. I am not saying this plugin isn’t worth it but it could be better with the feature I listed. Either way I am happy I got this before you made it paid lol.

2 Likes

I want everything I make to have zero lag because that makes the user feel irritated that they are being held back. Still, it’s something I will look at in the future, if Roblox isn’t already working on it themselves.

On a side note, overall, how much do you use my plugins and how useful do you find them in your day-to-day work?

1 Like

I do agree with the first part but it would make this plugin a bit more useful than it already is. Because to be very honest, I don’t see myself usong it as of it’s current state which is just a neater replacement to an existing feature nothing else which makes this one, sorry to say, a bit useless…

For the second part: I usually use the swap plugin and haven’t really used any other on average. I do sometimes use the CFS Avatar Editor one but that’s ony when makig charcter and even them sometimes as well, it’s just a replacement for a few lines of code.

2 Likes

I’m curious, do you design your own icons for all your plugins? I notice a very consistent design theme across all your plugins and the icons are especially prominent.

Your plugin suite seems very powerful, and I hope you continue creating more. The gradient editor looks especially useful for many contexts, in my opinion.

1 Like

Much appreciated!

I use Figma to design all of the icons you see in my plugins (with the exception of the Robux logo).

2 Likes