This change introduces a new CSS property, 'path-length', which maps to the existing SVG 'pathLength' presentation attribute. It applies to SVG geometry elements that support 'pathLength' (including <path>, <circle>, <rect>, <line>, <polyline>, <polygon>, and <ellipse>). Exposing 'pathLength' as a CSS property allows authors to specify it via stylesheets, inline styles, and animations, enabling it to participate in normal CSS cascading, specificity, transitions, and animations. The property affects all computations that depend on the total path length, including stroke dash rendering and text positioning along a <textPath>. CSS declarations override the presentation attribute following standard CSS precedence rules. The initial value of 'path-length' is 'none', which represents the absence of an author-supplied path length and is distinct from an explicit numeric value such as '0'. Existing attribute-only behavior is preserved when the feature is disabled.
Today, 'pathLength' can only be specified as an SVG presentation attribute. As a result, it cannot participate in the CSS cascade, specificity, animations, or transitions, unlike other SVG geometry properties such as 'r', 'cx', 'cy', 'x', 'y', and 'd', which are already exposed as CSS properties. This limitation prevents authors from controlling total path length using stylesheets, overriding presentation attributes via CSS, or animating 'pathLength' using standard CSS animation and transition mechanisms. Common authoring patterns, such as CSS-driven stroke dash animations and text-on-path effects that rely on scalable path length, require workarounds or script today. Promoting 'pathLength' to a CSS property aligns it with existing SVG geometry properties, enables full participation in CSS cascading and animation, and closes a long-standing authoring gap identified by the SVG Working Group (https://github.com/w3c/svgwg/issues/773). Existing attribute behavior is preserved, with CSS declarations taking precedence according to standard cascade rules.