Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[css-shapes-2] Maybe add superellipse/squircle etc as basic shapes? #11620

Open
noamr opened this issue Jan 30, 2025 · 2 comments
Open

[css-shapes-2] Maybe add superellipse/squircle etc as basic shapes? #11620

noamr opened this issue Jan 30, 2025 · 2 comments

Comments

@noamr
Copy link
Collaborator

noamr commented Jan 30, 2025

With #10993, we're going to have the generic superellipse() and specifics like squircle as corner shapes.
Perhaps we could have 50%-radius version of them as basic shapes? thinking clip-path: squircle(50%) (similar to circle) is a no brainer.

@tabatkins
Copy link
Member

We already have the ability to specify round border-radius on rect https://drafts.csswg.org/css-shapes-1/#funcdef-basic-shape-rect like rect(... round 1em); with corner-shape we should edit the spec to be able to specify rect(... squircle 1em) instead.

(I'm not against a squircle(), just pointing out we have a more straightforward existing way to do it.)\

@noamr
Copy link
Collaborator Author

noamr commented Jan 30, 2025

We already have the ability to specify round border-radius on rect https://drafts.csswg.org/css-shapes-1/#funcdef-basic-shape-rect like rect(... round 1em); with corner-shape we should edit the spec to be able to specify rect(... squircle 1em) instead.

(I'm not against a squircle(), just pointing out we have a more straightforward existing way to do it.)\

Oh yea, I forgot that basic-shapes already have a corner-shape variant (since the old corner-shapes were still on the drawing board)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants