stroke-linecap CSS Property

The stroke-linecap property determines the shape at stroke endpoints. Initial value is butt.

line { stroke-linecap: round; }

path { stroke: blue; stroke-width: 8; stroke-linecap: square; }

buttThe default value. Flat edge cut at the endpoint.

roundRounded edge — extends the line with a half-circle whose diameter equals stroke width.

squareSquare edge — extends the line with a square whose height equals stroke width.

CSS Fill and Stroke Module Level 3

Editor's Draft

Show all code