SVG

Stroke Line Cap v1.1.1

Utilities for sets the outline shape of an SVG.

Class

Usage

Set a SVG image with stroke linecap property.

stroke-butt ends the stroke with a sharp 90-degree angle.

<!-- Example -->
<svg class="stroke-butt ... stroke-current stroke-2 ... text-amber-400">
  ...
</svg>

stroke-round adds a radius that smooths out the start and end points.

<!-- Example -->
<svg class="stroke-round ... stroke-current stroke-2 ... text-amber-400">
  ...
</svg>

stroke-square similar to butt except that it extends the stroke beyond the length of the path.

<!-- Example -->
<svg class="stroke-square ... stroke-current stroke-2 ... text-amber-400">
  ...
</svg>

Variant