I’ve noticed that some rectangles have different border radius styles (see picture attached below). This seems to happen randomly, and I don’t understand why it happens. The elements are both rectangles, they both have corner radius set to 12px, and as far as I understand, they’re exactly the same in every other way.
So, why is the corner radius “smoother” in the above rectangle, compared to the other?
Hey @EK11 - can you send a copy of the demo showing the screenshot? Were these just objects on the canvas, or were they in a frame or section? I’m assuming that it was just a basic rectangle, duplicated, and then radius changed, but I may be wrong.
I’ve gone in myself to try and replicate (with the colors you have as well), and I see consistency. I want to be sure I mimic everything you built, and check with support if there’s any indication of an issue.
Are you able to share a view only link so that we can take a look at what you have?
Here’s a link to a file with both rectangles.
It’s corner smoothing feature in Figma.
you can locate it here:
Thanks @Weirdo! Does this feature work online in Figma, or am I able to transfer this look into our live product using code? When I’m in Dev Mode, the code looks exactly the same regardless of what I set as the corner smoothing %.
Corner Smoothing is not a regular css code, it require the devs to manipulate the code in order to make it look like in Figma, that’s why at the moment it does not show in the DevMode menu in Figma and many dev ignore corner smoothing - it’s compicated code work.
This feature in Figma is good for creating icons in SVG’s, etc…
