Web platform features explorer - Clip path boxes

Web platform features explorer

Tags: css Groups: Clipping, shapes and masking

The fill-box, stroke-box, and view-box values for clip-path set an edge of the element's box to use as the clipping shape.

Learning resources on MDN

Geometry-box, in clip-path

Browser support

Chrome 119 Released on 2023-10-31
Chrome Android 119 Released on 2023-10-31
Edge 119 Released on 2023-11-02
Firefox 54 Released on 2017-06-13
Firefox for Android 54 Released on 2017-06-13
Safari 13.1 Released on 2020-03-24
Safari on iOS 13.4 Released on 2020-03-24

Usage (according to Chrome Platform Status)

~0.047% of page loads. More data at chromestatus.

Specifications

CSS Masking Module Level 1 (#the-clip-path), from Cascading Style Sheets (CSS) Working Group (W3C).

View web-platform-tests results for this feature - View the feature source file (dist) - Edit the feature - Report an issue about this feature