prefers-color-scheme = light
Change your device's system theme or your browser's theme to change themes
prefers-color-scheme = dark
Change your device's system theme or your browser's theme to change themes

Example of how to implement automatic theme switching using prefers-color-scheme.
Credit: https://web.dev/prefers-color-scheme/

<head>
    <link href="light-theme.css" rel="stylesheet" media="(prefers-color-scheme: light)" />
    <link href="dark-theme.css" rel="stylesheet" media="(prefers-color-scheme: dark)" id="default-theme" />
    <script>
                // Fall back if the browser doesn't support prefers-color-scheme
        if (window.matchMedia('(prefers-color-scheme: dark)').media === 'not all') {
                // Hide content until CSS loads to prevent show unstyled code.
            document.documentElement.style.display = 'none';

                // Get the default theme's path.
            var defaultCssHref = document.getElementById('default-theme').getAttribute('href');

                // Insert stylesheet with onload event to show page content.
            document.head.insertAdjacentHTML(
                'beforeend',
                '<link href="' + defaultCssHref + '" rel="stylesheet" onload="document.documentElement.style.display=\'\'" />'
            );
        }
    </script>
</head>