CSS Shapes: `closest-corner` and `farthest-corner` radii for `circle()` and `ellipse()`

[hjanuschka]

Specification title

CSS Shapes: closest-corner and farthest-corner radii for circle() and ellipse()

Specification or proposal URL (if available)

https://drafts.csswg.org/css-shapes-1/#basic-shape-functions

Explainer URL (if available)

https://static.januschka.com/i-361617757/

Proposal author(s)

No response

web-feature id

No response

MDN URL

No response

Caniuse.com URL

No response

Bugzilla URL

https://bugzilla.mozilla.org/show_bug.cgi?id=2040681

Mozillians who can provide input

@emilio

WebKit standards-position

No response

Other information

This adds the closest-corner and farthest-corner radius keywords to the CSS circle() and ellipse() basic-shape functions. The keywords resolve to the Euclidean distance from the shape center to the nearest or farthest corner of the reference box, matching their existing behavior in radial-gradient().

Chromium implementation: https://chromium-review.googlesource.com/c/chromium/src/+/7767079
CSSWG discussion: w3c/csswg-drafts#10812
ChromeStatus: https://chromestatus.com/feature/5100672946143232

[emilio]

cc @BorisChiou, can you take a look? ISTR we did consider implementing this and it seemed ok, but there are a few spec issues in the area? w3c/csswg-drafts#14010 for example.

[BorisChiou]

Yes. We have implemented these keywords. However, for ellipse(), w3c/csswg-drafts#14010 is the spec issue we have concerns so ellipse() with closest-corner and farthest-corner is still behind a pref. circle() with closest-corner and farthest-corner is OK with us and we have ship it already.