stroke-color
An experimental property (mainly supported in Safari) that allows you to set the color of an SVG path or text stroke using standard CSS color values.
It is documented as part of the Scalable Vector Graphics specification. This is an experimental technology. The syntax and behavior are still subject to change.
Syntax
/* Usage Example */
.map-boundary {
/* Sets the border (stroke) color of an SVG shape */
stroke-color: var(--brand-primary);
}
/* Global values */
stroke-color: inherit;
stroke-color: initial;
stroke-color: revert;
stroke-color: revert-layer;
stroke-color: unset;
stroke-color Browser support
This feature is well established and works across many devices and browser versions. It has been available across browsers since 2020.