What's that?
The RGB color values of the message and the background are the same. Take a screenshot then compare them in an image editor.
Your experience may vary depending on browser, OS version, display, everything. Tests so far seem to indicate this only works on the Apple platforms.
How does this work?
By combining an HDR video (little box below heading) with CSS hack, the white color of the text becomes even brighter.
filter: brightness(10);
backdrop-filter: brightness(1);
When a HDR-capable browser encounters one, it switches to HDR mode. The exact reason for this behavior is not yet known.
You may hide this video visually to achieve better webpage look.
Read more about playing HDR content with the EDR system.
Browser Support
Works with HDR-capable Macs and iPhones:
- Safari / Chrome / Edge, macOS Big Sur, MacBook Air (M1, 2020)
- Safari, macOS Big Sur, MacBook Pro (15-inch, 2018)
- Safari, macOS Big Sur, MacBook Pro (16-inch, 2019)
- Safari, macOS Big Sur, iMac (Retina 5K, 27-inch, 2020)
- iOS 14, iPhone X
- iOS 14, iPhone XS / XR
- iOS 14, iPhone 12 / iPhone 12 Pro
- iOS 14, iPad Pro 11-inch (2nd generation)
Works with SDR Macs with Blink browsers:
- Chrome / Edge, macOS Big Sur, iMac (Retina 5K, 27-inch, Late 2015)
Does not work with:
- Firefox (Does not support HDR)
- webOS TV (Does not support backdrop-filter)
- Chrome, Google Pixel 4a
- Edge, Samsung Galaxy S10
- PlayStation 4
- Xbox Series X (Might crash the console)
- Chrome, Windows 10, LG 27UK600 / LG 34WL600