<div></div>
div{
	font-size: 4rem;
	width: 100vw;
	height: 100vh;
	font-size: 2rem;
	text-align: center;
	line-height: 100vh;
	&:before{
			content: 'prefers-color-scheme: no-preference';
		}
}
@media (prefers-color-scheme: light) {
	div{
		background-color: white;
		&:before{
			content: 'prefers-color-scheme: light';
		}
	}
}
@media (prefers-color-scheme: dark) {
	div{
		color: white;
		background-color: black;
			&:before{
			content: 'prefers-color-scheme: dark';
		}
	}
}
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.