Skip to content

Instantly share code, notes, and snippets.

@allekok
Created June 1, 2022 15:37
Show Gist options
  • Save allekok/40bcb63d656c853e4ea3e985d58188ff to your computer and use it in GitHub Desktop.
Save allekok/40bcb63d656c853e4ea3e985d58188ff to your computer and use it in GitHub Desktop.
Dark mode

CSS:

@media (prefers-color-scheme: dark) {
	/* Dark mode style */
}

Javascript:

if(matchMedia('(prefers-color-scheme: dark)').matches) {
	/* Dark mode */
}
else {
	/* Light mode */
}

/* If user changes current mode */
matchMedia('(prefers-color-scheme: dark)').addEventListener('change', (e) => {
	if(e.matches) {
		/* Dark mode */
	}
	else {
		/* Light mode */
	}
})
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment