src/app.html

<!doctype html>
<html lang="en" data-theme>
	<head>
		<meta charset="utf-8" />
		<meta name="theme-color" content="#19191a" />
		<meta name="viewport" content="width=device-width" />
		%sveltekit.head%
		<link rel="icon" href="%sveltekit.assets%/favicon.ico" />
		<link rel="apple-touch-icon" sizes="180x180" href="%sveltekit.assets%/apple-touch-icon.png" />
		<link rel="icon" type="image/png" sizes="32x32" href="%sveltekit.assets%/favicon-32x32.png" />
		<link rel="icon" type="image/png" sizes="16x16" href="%sveltekit.assets%/favicon-16x16.png" />
		<link rel="manifest" href="%sveltekit.assets%/site.webmanifest" />
		<link rel="preconnect" href="https://fonts.googleapis.com" />
		<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
		<link
			href="https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800&display=swap"
			rel="stylesheet"
		/>
	</head>

	<body data-sveltekit-preload-data="tap" class="text-primary-text">
		<div id="app">%sveltekit.body%</div>
	</body>
	<script>
		let theme = localStorage.getItem("theme");
		if (!theme) {
			document.documentElement.classList.add(window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light");
		}
	</script>
</html>