Dark Mode

and the script could also implemented (darkmode.js)

but all uses mix-blend-mode – and that is something not all browser will support.
See here a quick embedding via child-theme functions.php:

function add_darkmode(){
?>
<script src="https: (Email address hidden if logged out) /lib/darkmode-js.min.js"></script>
<script>	
	new Darkmode({ 
		bottom: '64px', // default: '32px'
		right: 'unset', // default: '32px'
		left: '32px', // default: 'unset'
		time: '0.5s', // default: '0.3s'
		mixColor: '#fff', // default: '#fff'
		backgroundColor: '#fff',  // default: '#fff'
		buttonColorDark: '#100f2c',  // default: '#100f2c'
		buttonColorLight: '#fff', // default: '#fff'
		saveInCookies: false, // default: true,
		label: '🌓', // default: ''
		autoMatchOsTheme: true // default: true
	}).showWidget();	
</script>
<?php
}
add_action('wp_footer', 'add_darkmode');

now there will be a little button on your page.: see here (not totaly styled): https://webers-testseite.de/guenni/

the script toggles one class to body ( #top) : darkmode–activated – so you can use it for styling your changings on activate state.
it now depends on your page what to style – and what mix-blend-mode you use.

this is a small script of 6kb – you can host it on your server ( on GDPR Reasonst might be better ) – then you can split those child-theme functions.php entry:

function darkmode_js_script() {
    wp_enqueue_script( 'Darkmode', get_stylesheet_directory_uri().'/js/darkmode.min.js', '1.4', true );
}
add_action( 'wp_enqueue_scripts', 'darkmode_js_script' );

function add_darkmode(){
?>
<script>	
	new Darkmode({ 
		bottom: '64px', // default: '32px'
		right: 'unset', // default: '32px'
		left: '32px', // default: 'unset'
		time: '0.5s', // default: '0.3s'
		mixColor: '#fff', // default: '#fff'
		backgroundColor: '#fff',  // default: '#fff'
		buttonColorDark: '#100f2c',  // default: '#100f2c'
		buttonColorLight: '#fff', // default: '#fff'
		saveInCookies: false, // default: true,
		label: '🌓', // default: ''
		autoMatchOsTheme: true // default: true
	}).showWidget();	
</script>
<?php
}
add_action('wp_footer', 'add_darkmode');