<?xml version="1.0" encoding="utf-8"?>

SVG stroke properties

SVG stroke properties

The stroke attribute contains several properties that you can apply to a line, text, or outline of an element:

• The stroke property defines the color.

• The stroke-width property defines the thickness of a line.

• The stroke-linecap property defines the types of endings to an open path.

They can be butt, square, and round. The first two have the same appearance except for one point — the square property stretches the stroke slightly beyond the actual path.

•The stroke-dasharray property allows you to create a dashed line.

This attribute contains a set of comma-separated numbers, of which the first specifies the width for the filled area and the second specifies the width of an empty area.[1]

Improve your UX & Product skills with interactive courses that actually work