shape-outside
The core property for CSS Shapes. It allows text to wrap around complex paths (like circles, polygons, or transparent images) instead of just being limited to rectangular boxes.
Usage example
.circular-image {
float: left;
width: 200px;
height: 200px;
/* Text will flow in a curve around this circle instead of a straight line */
shape-outside: circle(50%);
} Initial value
none
Inherited
No
Applies to
floats
Animation type
basicShapeOtherwiseNo
Values
none shape-outside Browser Support
Widely available Since 2020 96% global usage
This feature is well established and works across many devices and browser versions. It has been available across browsers since 2020.
Safe to use without fallbacks.
37+
62+
10.1+
79+