Is it possible to use image-set *and* multiple images at the same time? : <p>I'm currently going through with my team and finishing up our latest site, optimizing images and all that good stuff.</p>

<p>I've come across a small dilemma.
We have many background images. I wish to optimize them on supporting browsers using image-set, but I also love using <a href="https://csswizardry.com/2016/10/improving-perceived-performance-with-multiple-background-images/" rel="nofollow noreferrer">this technique</a> to improve perceived load times and for the nice added touch it gives. If I <em>do</em> have to choose, of course I'll go for the optimization.</p>

<p><strong>So</strong>, my question to you all is this:
Can I use image-set as one of multiple backgrounds? If so, can you provide a working example? I gave it a go, but the browser rejected the code completely and so I just got the strikeouts in the inspector.</p>

<p>Here is an example of my code (as I am working in liquid and would prefer to not have to translate this it to true CSS unless needed):</p>

<pre><code>background: image-set(
  url("URL") 1x,
  url("URL") 2x,
  url("URL") 3x,
  url("URL") 4x,
) center / 100% auto no-repeat,
linear-gradient(to right, #564029 0%, #6c5a43 50%, #6c573c 75%, #5d472f 100%) center / 100% auto no-repeat,
#72573c;
</code></pre>

<p>Feel free to point out if I've just missed something in my code. If nothing else, I hope this serves as something for someone else to stumble upon.</p>

<p>As far as things I've looked into for reference:</p>

<ul>
<li>I've looked at <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Backgrounds_and_Borders/Using_multiple_backgrounds" rel="nofollow noreferrer">multiple background examples</a></li>
<li>I've looked at <a href="https://www.hongkiat.com/blog/css-image-set/" rel="nofollow noreferrer">image-set examples</a></li>
<li>I did a reasonable dive into Google to try and find an example of the two combined. I won't say I was surprised to find nothing.</li>
</ul>

<p>Final note, I am aware that the -webkit- prefix is still necessary. </p>
