It is not possible to create a composite url()
value out of two or more strings. On top of the legacy url()
value, which isn't even a proper CSS function (see Is there a way to interpolate CSS variables with url()? — which means you can't even do this with custom properties), the proper CSS function version of url()
as defined in css-values-3 only accepts a single string.1
You can concatenate multiple strings in a content
declaration, but that is a feature of the content property, not of strings in CSS.
1 Since url()
accepts a single string, this does mean that a single attr()
can be used as a URL value, also new to css-values-3, as attr(image url)
... except browser support is nonexistent.