What do you use for UI background Colors and Icons?

Help and Feedback Art Design Support
#1

About The problem

I was been getting very passionate about UI lately you can see my works here. And I think I am getting better at some of the things I use. But there’s 2 things holding me back.

What the Problem is

  1. Background color - Color is huge part of UI. Its the first thing that catch’s someone’s eye. I would like to be able to use multi color Backgrounds or juts better colors then what Roblox Studios Provides.

  2. Icons - Lots of games use Icons instead of text Its the keep clean and organized. I would like to easily access icon with transparency

How You Can Help

If you know any plugins or websites to help me or that you use that would accomplish the 2 things that I would want to be able to do that would be nice.

And having personal experience would be nice too. With a little demo of how you did it. Thank You

Hope you the best time deving
-Fan

Please tell me if this is the wrong category

1 Like
Task Ui [Not Scripted]
#2

For background color, I either just keep it solid or make it a gradient. If you really need a nice special background with shapes and different colors or whatever, make it an image and use that. I’d use Lunacy for that (I explain Lunacy below).

For icons and all that, I use google drawings. It is basic, but it’s simple and gets the job done well. There’s also Lunacy, which is a free art software you can use for icons and all that. Not only does it have a ton of preset icons to use, you can make your own icons with shapes, lines, and whatever super easily. I actually use google drawings for icons, but I should really be using Lunacy.

#3

Awesome.

2 things.

How do I make a gradient color in Studios?
How do I make a transparent Background using Lunacy?

#4

  1. Use a UIGradient. Insert it into a gui object and view its properties. Click the “…” next to the color property. Start playing with the color and boom, you have yourself a gradient.

  2. They don’t automatically have a transparency background? I thought you could’ve just had no background in the canvas, but if it has a background, then use LunaPic. It’s a website that allows you to do basic photo editing. You can crop an image out of a rectangle or circle, resize and scale an image, and you can make a solid color transparent.

Just make the background a solid color, hop into LunaPic, hover over the “edit” tab in that little topbar, click “transparent background”, and then just click the background, and presto, you got yourself a transparent background. The whole process of this is much simpler than it sounds, and remember that LunaPic isn’t only for transparent backgrounds. Use it if you need to crop an image into a rectangle or circle. It’s super useful.

#5

So I make the background transparent but it studios it has a white background.