Responsive background image that maintains quality
Does anyone have any advice on how to handle background images with
background-size: cover; so they can scale up as the screen expands without becoming pixelated? I'm exploring creating media queries to replace the image at large breakpoints, but the issue is that this image is covering the entire background of the page, so I need to scale vertically and horizontally, while accounting for both potentially pixelating the image. I wrote a postcss plugin for this (https://github.com/sygint/postcss-11ty-responsive-bg-img) , but it's clear to me I need to make it more robust, just curious if anyone has experience with this issue or has some articles I can read, or any advice either way.GitHub
A PostCSS plugin to generate responsive images and companion css using eleventy-img - GitHub - sygint/postcss-11ty-responsive-bg-img: A PostCSS plugin to generate responsive images and companion cs...
