Heck of a CSS trick here from Dongsung Kim.
There are hidden HDR videos playing at the corners of this page. When a HDR-capable browser encounters one, it switches to HDR mode. For some reason, CSS
backdrop-filter
+brightness
>100% combo seems to behave like HDR—reaching beyond the user-controlled display brightness, up to the maximum HDR brightness—while the everything in between follow[s] along. At least that’s the overall idea, but I still don’t know exactly why it works; especially why with those two CSS properties.
As I look at that demo in Chrome, I see an extra-white text-shadow
. In Safari, I see extra-white text. In Firefox, the whites match so I see nothing. Probably a bug.
I wouldn’t recommend actually using the trick, as I’d think the extra-whiteness almost certainly takes extra battery power that a user isn’t opting into, even without the video playing—even though it does feel like a bummer that our screens are capable of whiter whites than we normally have access to. The good news is that the gamut of color on the web is expanding, generally.
Cool trick!
That site is quite confusing when your browser doesn’t support it. I had assumed there was text above but pressing “select all” didn’t show it. It was only when I viewed the GitHub I actually saw what it is meant to look like.