basic.css

.test-unchanged-properties {
	background-1: url("img/test.png");
	background-2: url(my-img-print.png) top left no-repeat red;
}

.test-changed-properties {
	background-image-1: image-set(
		url(img/test.png) 1x
	);
	background-image-2: image-set(
		url(img/test.png) 2x
	);
	background-image-3: image-set(
		url(img/test.png) 1x,
		url(img/test-2x.png) 2x
	);
	background-image-4: image-set(
		url(img/test.png) 1x,
		url(img/test-2x.png) 2x,
		url(my-img-print.png) 600dpi
	);
}

.test-variables {
	background-image: image-set(
		url(img/test.png) 1x,
		var(--test-image-2x) 2x,
		var(--test-image-3x, url(img/test-var-fallback-3x.png)) 3x
	);
}

.test-mixed-units {
	background-image-1: image-set(
		url(img/test.png) 1x,
		url(img/test-2dppx.png) 2dppx
	);
	background-image-2: image-set(
		url(img/test.png) 1x,
		url(img/test-2dpcm.png) 20dpcm
	);
}

.test-mixed-order {
	background-1: image-set(
		url(../images/bck@3x.png) 3x,
		url(../images/bck.png) 1x,
		url(../images/bck@2x.png) 2x
	);
	background-2: image-set(
		url(../images/bck@2x.png) 2x,
		url(../images/bck@3x.png) 3x,
		url(../images/bck.png) 1x
	);
}

.test-no-url {
	background-image-1: image-set(
		"img/test.png" 1x,
		"img/test-2x.png" 2x
	);
	background-image-2: image-set(
		"img/test.png" 1x,
		"img/test-2x.png" 2x,
		"my-img-print.png" 600dpi
	);
}

.test-webkit-prefix {
	background-image: -webkit-image-set(
		url(img/test.png) 1x,
		url(img/test-2x.png) 2x,
		url(my-img-print.png) 600dpi
	);
}

@media (min-width: 1000px) {
	.test-within-mq-1 {
		background-image: image-set(
			url(img/test.png) 1x,
			url(img/test-2x.png) 2x,
			url(my-img-print.png) 600dpi
		);
	}
}

@media (min-width: 768px) and (max-width: 1024px) {
	.test-within-mq-2 {
		background-image: image-set(
			url(img/test.png) 1x,
			url(img/test-2x.png) 2x,
			url(my-img-print.png) 600dpi
		);
	}
}

.list-1 {
	background-image: linear-gradient(#4444, #8888), image-set(url(img.png) 1x, url(img@2x.png) 2x);
}

.list-2 {
	background-image: image-set(url(img-a.png) 1x, url(img-a@2x.png) 2x), image-set(url(img-b.png) 1x, url(img-b@2x.png) 2x);
}

.test-valid-data-url {
	background-image: image-set(url(data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==) 1x, url(img/test-2x.png) 2x);
}

.test-invalid-data-url {
	background-image: image-set(data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==, url(img/test-2x.png) 2x);
}

to-clone {
	background:image-set(
		url(img/test.png) 1x,
		url(img/test-2x.png) 2x
	);
}