← Back to release summary

Refine border-radius shadow edge computation for high border-radius

Category
CSS
Type
No developer-visible change
Status
Proposed (Chrome Proposed)
Intent stage
None

Summary

This improvement ensures that shadows and clip boundaries on near-circular elements (where border-radius is close to 50%) precisely match the visual contour of the curved edge. This produces a more consistent rendering of complex rounded shapes, eliminating visual discrepancies for high radius values. The border-radius adjustment factor, which ensures corners appear sharp for small radii, is now progressively dampened as the radius value approaches 50%. This also applies to non-round contours (using corner-shape), which now use the same radius adjustment mechanism.

Motivation

This makes shadows of round/elliptical shapes look more like the shape. This fits better with developer/designer expectations of how box-shadow should behave.

Standards & signals

View on chromestatus.com