stroke-linejoin
Defines how the corners of an SVG path or shape should look when two lines meet. Options include sharp (miter), rounded (round), or flattened (bevel).
Quick example
polygon.star {
/* Smooths out the sharp corners where the star's lines meet */
stroke-linejoin: round;
}Quick facts
Initial value
miterInherited
Yes
Applies to
a subset of SVG elements (shapes)
Animation type
discrete
Values
mitermiter-cliproundbevelarcs stroke-linejoin 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.
1+
1.5+
4+
15+