Template:Icon box/style.css

.icon-box {
	/* Fallback for browsers without light-dark support (https://caniuse.com/mdn-css_types_color_light-dark): */
	color: var(--ib-color, #202122);
	background-color: var(--ib-background, #f8f9fa);
	border: 1px solid var(--ib-border-color, #dadde3);
	
	/*color: light-dark(var(--ib-color, #202122), var(--ib-color-dark, #f8f9fa));
	background-color: light-dark(var(--ib-background, #f8f9fa), var(--ib-background-dark, #202122));
	border: 1px solid
			light-dark(var(--ib-border-color, #dadde3), var(--ib-border-color-dark, #404244));*/
}

@media (prefers-color-scheme: light) {
	.icon-box {
		color: var(--ib-color, #202122);
		background-color: var(--ib-background, #f8f9fa);
		border: 1px solid var(--ib-border-color, #dadde3);
	}
}

@media (prefers-color-scheme: dark) {
	.icon-box {
		color: var(--ib-color-dark, #f8f9fa);
		background-color: var(--ib-background-dark, #202122);
		border: 1px solid var(--ib-border-color-dark, #404244);
	}
}