The vector-effect property (SVG) specifies special effects on vector graphics — like non-scaling-stroke which keeps the stroke width constant even when the element is transformed.path {
vector-effect: non-scaling-stroke;
}.chart line {
stroke: black;
stroke-width: 1;
vector-effect: non-scaling-stroke;
}noneThe default value. No special effects — stroke scales with transformations.non-scaling-strokeStroke keeps a constant width regardless of transform or viewBox — useful for graphs that scale.non-scaling-sizeElement keeps constant size regardless of transformations.non-rotationElement ignores rotation from ancestors.fixed-positionElement stays at a fixed position.SVG 2 — Chapter 8: Coordinate Systems, Transformations and UnitsW3C RecommendationW3CMDNShow all codeEdit CSS onlineThe plugin that remembers hundreds of CSS items for youEvery CSS property — in a live demonstrationThe bilingual CSS referencedefinitionexamplessyntaxmodulespecificationsourcesvisual demonstrationpreviousnext
