<shape>

A basic data type that defines a 2D shape, like a circle, ellipse, or polygon. It's most commonly used with the 'clip-path' property to cut elements into specific shapes or with 'shape-outside' to make text flow around them.

The web standards community has deprecated this feature. Browsers are actively phasing out support for it.

/* Usage Example */
.circle-avatar {
  clip-path: circle(50%);
  /* crops the element into a perfect circle */
}
Widely available Since 2015 96% global usage

This feature is well established and works across many devices and browser versions. It has been available across browsers since 2015.

1+
1+
1.3+
12+
Kinsta

Your first month is free

Managed WordPress hosting for faster sites.

Learn more

New CSS drops.

Join 600+ readers who've survived clearfix hacks.

ESC