The article discusses the evolution of CSS shapes and the introduction of the shape() function in the clip-path property, which simplifies the process of defining shapes. Unlike the previous path() syntax that is limited and requires SVG formatting, shape() uses standard CSS syntax, enabling the use of various units and calculations. This is highlighted as a significant enhancement for developers in creating complex shapes. An online converter tool from SVG to CSS is also introduced, aiding in the transition to utilizing CSS shapes effectively.
Creating CSS Shapes is a classic and one of my favorite exercise. I have one of the biggest collections from where you can easily copy the code.
Recently, clip-path was upgraded to have a new shape() value. A real game changer! The shape() function uses a set of commands roughly equivalent to the ones used by path().
Collection
[
|
...
]