2021-08-12 // 88 words // 1 minute read

Bare minimum CSS

I’ve thrown together this simple stylesheet that takes care of the bare essentials for when you just want things to be readable and nice.

@media (prefers-color-scheme: dark) {
	:root {
		--background: #444;
		--foreground: #eee;
	}
}
@media (prefers-color-scheme: light) {
	:root {
		--background: #eee;
		--foreground: #444;
	}
}
body {
	font-family: sans-serif;
	margin: 40px auto;
	max-width: 650px;
	line-height: 1.6;
	font-size: 18px;
	color: var(--foreground);
	background-color: var(--background);
	padding: 0 10px;
}
h1, h2, h3 {
	line-height: 1.2;
}
a {
	color: var(--foreground);
	decoration: underline;
}