CodePen Embed - How to implement light mode (by default) in CSS

<html>
  <body>
    <h1>Testing Light Mode (by default)!</h1>
    <p>So, you want to add light mode to your website?  This defaults your site to light but allows the visitor to use dark more, if they wish.</p>
    <img src="https://jws.dev/qrcode.svg">
  </body>
</html>

body {
  background-color: white;
  color: black;
}
img {
  width:40%;
}

@media screen and (prefers-color-scheme: dark) {
body {
	  background-color: black;
	  color: white;
	}
  img {
    width:40%;
    -webkit-filter: invert(1);
          filter: invert(1);
  }
}

This Pen is owned by Joe Steinbring on CodePen.

See more by @steinbring on CodePen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.