Did Roblox staff ignore this? That’s a practical solution right there.
1 Like
They have stated before that the entire UI rendering system is optimized for rectangles, not arbitrary polygons. It might not be as trivial as it seems, and I would think that the people who created the entire rendering system are more aware of the constraints than any observer.
1 Like
Fun fact, UIGradient actually already does this! If you go into Studio, put a Frame into a SurfaceGui, put a UIGradient on the frame, then turn on Wireframe Rendering, it will actually show various triangles that go to the edges, which is pretty neat. This is because Roblox uses a vertex shader to implement gradients, so it needs to split it into multiple triangles (and in turn vertices) to apply the vertex colors.
This also factors in for properties like
UIGradient.Offset as well, it is a very robust system.
Everything in Roblox’s UI system is done by triangles, period. And I think it’s a brilliant way of doing it. It’s why they can just cast 2D UI into 3D with SurfaceGui so casually and easily. All they need to do is take those 2D triangles and apply a 3D projection matrix to them.
I’d encourage everyone to study and optimize the topology of their UIs /j
So, considering Roblox already does this, it shouldn’t be too difficult to split up the math onto individual frames and clipping regions, right? I saw this video a while ago while studying 3D rendering that explains well how to clip 2D triangles, even rotated ones. (edit: segment is from 39:14 to 42:06)
At the end of the segment, he has broken up the triangle into several sub-triangles that can clip within the boundaries of the rectangle (the rectangle could even be rotated as well)
This would be fairly trivial to do, considering they’re already doing it with gradients.
And for anyone who will just say, “just use CanvasGroup!” that’s actually very bad advice. CanvasGroups destroy the optimizations offered by using raw traingles, because now you have to rasterize a texture of those triangles, then cast that texture back to a plane. It’s like someone telling you to write a long document, then telling you to photocopy it and scan it back in. You no longer have the raw text itself, but rather a photo of it. This has restrictions on performance and memory and isn’t trivial to do with Roblox’s current rendering pipeline, hence why the 1024x1024 pixel limit before CanvasGroups begin to degrade in quality. This is why I despise CanvasGroup and try not to use it wherever I can, except for some cool effects that would otherwise be impossible without it.
9 Likes
Except when you take into consideration that 8 years have passsed, and they already use triangles
1 Like
Where do they use triangles for element rendering? What UIGradients are doing is different because that is contained within the rectangle.
I’m sure they’re aware of this feature request, but maybe it’s just not at a very high priority to them compared to the hundreds of others they have, not even mentioning that CanvasGroups exist now so this has become more of a question of why you can’t use that.
1 Like
Look 2 messages above your. It proves that UI uses triangles system and not solo rectangle.
I have myself solved 50% of needs of rotated UI clippings with UIGradient and hard math, which calculates where it should apply transparency and where no. But this approach is impossible if object is at the corner, because it can clip only one side.
That is what I was referring to here:
1 Like
They use triangles for everything in UI, not just for UIGradient. Here’s an example to prove my point, before and after Wireframe.
Even for the widgets like Toolbox! - you can see this by using RenderDoc, a FOSS program for 3D debugging
Edit: as for your mention of CanvasGroups, they are extremely inefficient for this task, because like I already said above, you have to rasterize the triangles to 2D then cast the texture back into 3D, and this is horrible for both memory and performance. If they could clip the triangles they are already rendering, with some simple math, it would actually improve performance because people wouldn’t use ugly hacks like CanvasGroup that (I’m pretty sure) use the stencil buffer. Working with triangles directly would be way more efficient, and they’re already doing it with gradients.
3 Likes
I know how rendering works. I have written renderers before. Yes, everything is triangles. That wasn’t the point that ZeuxCG made years ago on this thread and isn’t what I was referring to. The point was that UI elements themselves are just handled as quads (made up of triangles) in a perfect rectangle shape for the clipping stage. Sorry for any confusion.
I don’t really feel like there’s a reason for me to talk further here. Yes, this feature should exist. I was just reiterating the official responses we have gotten which people didn’t seem to be acknowledging.
3 Likes
dude the people who were commenting have kids by now yall making us into grandpas while waiting for this fix
4 Likes
How is this bug not fixed yet? It have been almost 8 years since this post was created. 
1 Like
I believe this to be intentional behavior on Roblox. Unfortunately it may’ve started as a bug, but it’s not a very fixable problem anymore.
A lot of experiences on the platform, including a few of mine utilize this unique behavior for specific UI elements. As an example if you’d like to keep one specific thing from clipping instead of everything else you can set the Instance’s rotation to 0.00001 (which will visually round to 0) and it’ll forever stay up.
“fixing” it now would likely cause a lot of miscellaneous game breaking issues. I think that the CanvasGroup may have a few special options for allowing clipping while rotation is applied but it has a few side effects
1 Like
They should add a new property that fixes the bug when enabled so it doesn’t break already existing experiences.
1 Like
You kinda don’t get it, clipping rotated GUI Object and ITS children is indeed hard and can be expensive, what canvasgroup does to my knowledge is capture it like an image whatever is parented in it, then clip the image which after capturing aka screenshotting or wtv is not rotated
Also even at graphics level 10 CanvasGroups appear noticeably blurry compared to normal UI elements. So if you like your UI looking the best it can be CanvasGroups are completely out of the picture.
Not to mention that they can become a pure black rectangle as has been stated, and that quite literally makes them useless for UI unless you want to clip an image (a usecase where it becoming a black rectangle doesn’t effect usability that bad). But majority of cases here aren’t just clipping images.
Using CanvasGroup workaround isn’t viable if you need to create many of them. This feature needs a proper implementation
3 Likes
We are less than a month away from 2026. Care to elaborate on this?
There’s enough demand for this to be a thing, not to mention having this fixed would encourage further creativity.
9 Likes
Bumping. Been 8 1/2 years…
CanvasGroups have issues, like being low quality at small sizes/graphics, and generally not being as performant (although barely) which can make them pretty bad to use in some cases. I would much rather use frames.
4 Likes
Good I found this post to avoid double-posting. And yeah, it sucks it is not fixed yet. I have image corners for my UI, and I was just using 1 frame with image and gradient for all 4 corners, cloned and rotated. Pitifully rotated frames clip through even the canvasgroup. and images clip through too. In my case it is easily fixed by creating 4 different images though… not good for performance, but no alternatives anyway.
Hey folks,
Good news, this is something on our radar. Initially we’d like to support clipping of rotated shapes. later, we’re exploring clipping by rotated shapes and UICorner, though this is likely to come much later.
12 Likes