4k quality texture bypass for UI

DISCLAIMER: This doesn’t work all the time…? If the image doesn’t look cropped, it’s not working.

Roblox restricts UI image quality to 1024 by 1024. This can severely degrade your UI.

This tutorial shows a clever way to bypass that limit up to 4k, using PBR.

End Result:

Step 1: Enabling PBR

File–> beta features
Now check the enabled box next to Advanced Surface Appearance to enable PBR.


Now click Save at the bottom right.

Step 2: Creating the texture

Create a meshpart in workspace and add a SurfaceMaterial object.
image
In the colormap property, Click Add Image and upload your texture.
image

Step 3: Making it UI

Now copy the ID from the colormap property.
image
Make an imagelabel or imagebutton. In the Image property, paste the ID from the PBR
image
And you’ve got your 4k image!

How it works

If you check the ID it might look like this.
image
The image is cropped as a character.
As explained by @DataSigh (much smarter than me)

Big words (lol), but point is, Roblox can now display the image in 4k quality.

61 Likes

Anyways, this sounds pretty cool, i’ll try it in my free time.

1 Like

bro his texture thing actually works. Who cares if a friend replies to his post?

Well I won’t discriminate if that guy is his friend. Good job makin’ friends, I don’t always succed

Nice tutorial, I have plans for it :crazy_face:

3 Likes

Testing this out in Studio, this doesn’t appear to work. Tested with a 2048x2048 PNG texture.

Ground truth:

7 Likes

I’m assuming the reason why this isn’t natively supported, is because this will take up a lot of memory, especially on lower end phones and tablets where a lot of devices don’t have that much VRAM, which will result in your game crashing, not failing to load, not erroring out, crashing out to the homescreen if you did not know.

This is also why I’m assuming it doesn’t work for Eltobb - possible downscaling to lower memory usage? I’m not sure if Roblox has implemented that though :stuck_out_tongue:

3 Likes

If I remember correctly Roblox does some kind of texture compression or scaling based on devices now (or in the future? I didn’t notice if/when it was implemented)

Either way I’m on a pretty high spec desktop PC relative to most Roblox players, so I can’t see any reason I’d recieve any limited-resolution textures at this scale except for if the textures were downscaled upon upload, which is what happens with all other textures.

Assuming that 6773881267 is the ID of the image in the example, downloading the image directly reveals that it has a resolution of only 1024x576. The asset delivery API response points to the following image:

https://c0.rbxcdn.com/3c338e7e8fb1647cf74994828d21db01

4 Likes

Seems like if the image isn’t cropped as the roblox character then this doesn’t work. Honestly, this is pretty janky.

This is roblox ¯_(ツ)_/¯

yo guys I found out that if you upload it as a color map it’s not 4K, but it’s very close. (I can see it bc I have a 4k screen). It does increase the resolution majorly, but it doesn’t reach 4K yet:


vs:

1 Like

Looks a bit stretched out, maybe decrease the Y axis val

They’re both scaled identically and uniformly.

1 Like

Let me try it in studio rq. Be right back

Could you send me the image file?