So far clip-path only supported other basic shapes (circle, ellipse, polygon, url). This adds support for path() as a value as specified in, for example: clip-path: path(oddeven, 'M 5 5 h 100 v 100 Z') would clip the element with a triangle.


The path() function, as used in clip-path, allows specifying SVG-style paths for clipping. Without it, the user has to do one of the following: - create an additional SVG component and add a reference to it as the clip-path (cumbersome) - Use a polygon for the clip-path (doesn't support all path features, such as arcs).



Specification link

Specification being incubated in a Community Group

Status in Chromium


Enabled by default (tracking bug)

Consensus & Standardization

After a feature ships in Chrome, the values listed here are not guaranteed to be up to date.

  • Shipped/Shipping
  • Shipped/Shipping
  • No signals


Last updated on 2021-12-13