TIL about night & day

A presentation at Tech Talk @ Tagesspiegel by Gunnar Bittersmann

dark-mode implementation:

  • the easy way: the color-scheme property and the light-dark() function
  • the accent-color property
  • implementation with prefers-color-scheme media query and custom properties
  • 2×2 color schemes: light/dark meets prefers-contrast
  • forced color schemes
  • applying color schemes to embedded iframes
  • percieved font weights black on white vs. white on black
  • Should we have a switch on our webpages?

BTW & unrelated: hanging punctuation

Code

The following code examples from the presentation can be tried out live.

Resources

The following resources were mentioned during the presentation or are useful additional information.