shape()
A function used in 'clip-path' and other properties to define custom 2D shapes using commands like 'move', 'line', and 'curve'. It's basically like writing SVG paths directly in CSS.
This is an experimental technology. The syntax and behavior are still subject to change.
Syntax
/* Usage Example */
.custom-bg {
/* Defines a triangle using the shape() function */
clip-path: shape(from 0 0, line to 100% 0, line to 50% 100%, close);
}
shape() Browser support
Limited availability
Since
2020 0% global usage
This feature is not Baseline because it does not work in some of the most widely-used browsers.