# The CSS `clip-path` property

The `clip-path` property is defined in the CSS Masking Module Level 1 specification. It defines a clipping region that determines what part of an element should be visible, and anything outside this region is hidden.

It can take 3 types of values: a clip-source , a basic shape , or none (which means no clipping takes place). This demo features using a clip-source as the clipping path. A clip source is a URL which references a clipping path element. This clipping path is defined by an SVG clipPath element.

In order to ensure the clipPath scales with the element it's being applied to, a scaling transform attribute should be used in the clipPath element. Please refer to Eric Meyer's detailed write-up and explanation for this.