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.
Quick 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%);
}Quick facts
Initial value
noneInherited
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+