← Back to functions
CSS Function
image-set()
ResourcesProvides multiple image options based on screen resolution, letting the browser pick the best one.
Syntax
image-set(url('img.jpg') 1x, url('img@2x.jpg') 2x)Example
background-image: image-set(url('/img.webp') 1x, url('/img@2x.webp') 2x);Common use cases
- Serving high-resolution images on retina screens
- Responsive background images without media queries
- WebP with fallback for older browsers
Practical developer insight
image-set() is the CSS equivalent of the srcset attribute in HTML img tags — use it for background images that need to be resolution-aware.