Skip to content

(#997): Support "var(--foo, #aabbcc)" just for colors

Federico Mena Quintero requested to merge federico/librsvg:997-var-with-color-fallback into main

This adds very minimal support for CSS var(), just for properties that accept colors. The parser is extremely minimal, and has these limitations:

  • Defining custom properties like :root { --foo: blah; } is not supported yet.

  • Using var(--blah, #aabbcc) is supported just for properties that specify colors, like fill, stopColor, etc. The var() must have the fallback color specified, which is what librsvg will use.

  • Librsvg does not yet do substitution of custom property values, and depends on var() having a fallback color. So, if you have this:

     :root { --foo: blue; }

     rect {
       fill: var(--foo, green);
     }

Then librsvg will make rectangles green, since it cannot do substitution of custom property values yet.

  • Similarly, if you have this:
     :root { --foo: blue; }

     circle {
       fill: var(--foo);
     }

Then circles will be black (e.g. the default/initial fill color), since a var() without a fallback is currently handled as an invalid value, which reverts to the default color.

The purpose of this minimal support for var() is to make it possible to use librsvg to render OpenType glyphs that have SVG data with color fallbacks.

Fixes #997 (closed)

Closes #997 (closed)

Merge request reports