- From: jsnkuhn via GitHub <sysbot+gh@w3.org>
- Date: Thu, 01 Aug 2024 00:55:12 +0000
- To: public-css-archive@w3.org
jsnkuhn has just created a new issue for https://github.com/w3c/csswg-drafts: == [css-borders-4] add "radius/corner-smoothing" option to `border-radius` for squircles/superellipse == https://drafts.csswg.org/css-borders-4/ Idea here is to add sqircles/superellipse as a option for `border-radius` or a separate property maybe "radius-smoothing" instead of including `squircle` as a shape option for "corner-shape". Gives the benefit of being able to be used with `corner-shape` later to round the corner joints. `round` would no longer need to be an option for `corner-shape`. This would more closely line up with how vector software and iOS already approach squircles/superellipses ---------------------------------- Figma's radius-smoothing https://help.figma.com/hc/en-us/articles/360050986854-Adjust-corner-radius-and-smoothing https://www.youtube.com/watch?v=52pPP4HjieM Has fine grained control over the smoothing. Also points out that 60 is the corner smoothing value used by iOS. Swift UI uses "continuous" as a keyword for this: https://developer.apple.com/documentation/swiftui/roundedcornerstyle/continuous Looks like this is an all or nothing thing in Swift UI. So either all corners are squircle or none are, no ability to mix. (Honestly not sure that I've ever seen an example of say a top right squircle and a bottom left straight round corner though so probably fine?) Also looks like "continuous" is a binary keyword with no abiity to control the amount of smoothing. Not sure if that would be desirable? If the main point of squircles in CSS is for things to better line up with SwiftUI's iOS styling than maybe this isn't an issues. Although maybe they change this in the future?? Saw a comment in a YouTube video that said "continuous" might now be the default styling for cornerRadius? Would need to be confirmed. ------------------------------------------------------------------------------ Worth looking into what other vector drawing software might call this. 2 article deepdives: On a plug-in for adobe illustrator: https://bootcamp.uxdesign.cc/smooth-corner-rounding-in-adobe-illustrator-94003145a7bf On implementing smoothing in figma: https://www.figma.com/blog/desperately-seeking-squircles/ Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/10653 using your GitHub account -- Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Thursday, 1 August 2024 00:55:13 UTC