I love how, if you do view it accurately, it just makes every other white look washed out and grey in comparison. Our visual system is just one big comparison machine.
Absolutely love reading about such practical little hacks. Really brings back the old excitement that got me into computer science.<p>Also given how prevalent the issue of QR code brightness is for many use cases this could actually prove useful.
I think one possibly underused utility of HDR is to have more saturated bright colors in various contexts. I would love a more saturated light blue color for text that is normally available in sRGB, just because #0000ff is too dark and I would like to just crank up its brightness instead of mixing in green and red. Think syntax highlighting or terminal colors.
Author says that it can’t be represented with css, but I think HDR is supported in Safari within Display P3 I believe, you can give a value higher than 1.0?<p><a href="https://webkit.org/blog/10042/wide-gamut-color-in-css-with-display-p3/" rel="nofollow noreferrer">https://webkit.org/blog/10042/wide-gamut-color-in-css-with-d...</a><p>I might be wrong however.
As with all hacks, the risk of breaking other features, especially accessibility, increases.<p>I’ve noticed that you cannot long press the brighter code to read it.<p>This works on the regular code next to it (tested in safari mobile).
I am on an iPhone 13 and to my surprise I actually saw the HDR QR code displaying way more brightly than the rest of the page, and sure enough when I turned my power saving mode on, it went back to looking like the other non-HDR QR code. Impressive! It will be interesting to see if CSS ever gets full support for it.
Both seem to work fine when I point my (aging) Pixel 5 at them rendered on my Asus laptop screen.<p>I'm assuming there's some problem with screen-rendered QR codes that this solves, but my quick google search mostly just resulted in listicle spam.<p>What's the problem this solves?
I will never understand HDR. A friend has tried to explain it many times to me, but I always fail to get it. A display just has so much dynamic range (from full light off to full light on). HDR can't give you more range, so what does it actually do?<p>The only thing I've seen it do is override my brightness setting to make my screen go to full brightness when I've set it lower.
I'm sitting in front of both a 2012 Macbook Pro (no HDR) and a 2020 M1 Macbook Air (HDR), and I'm expectedly seeing the difference in brightness between the QR codes on the newish Air, while they look the same on the old Pro. But what's interesting is that both of the QR codes on the old Pro look just as bright as the big bright HDR QR code on the new Air.<p>Basically, the only observable difference I'm noticing between the two laptops is that <i>the non-HDR QR code looks dimmer</i> on the HDR-supporting machine. I'm sure this is some kind of optical illusion, but it's certainly not doing much to make me value the existence of HDR.
Given the popularity of QR codes now, I wonder if it makes sense for it to just be supported directly in HTML as a type of element.<p><qrcode>Some content!</qrcode><p>With necessary browser/device level support to automatically do this HDR thing.
Safari also apply “HDR” to CSS filter: brightness() with value greater than 1. Instead of the over-exposure effect, this portion of the screen will be brighter.<p>You must have an HDR or EDR-capable screen and there must be an HDR video playing to activate the HDR context (can be <video> playing somewhere in a webpage).<p>Lunar app's website used this trick! Check it out.
<a href="https://lunar.fyi/#xdr" rel="nofollow noreferrer">https://lunar.fyi/#xdr</a>
Does that only work with white or with other colors in general?<p>I would not have thought that QR codes could become a hot topic in 2023 but combining that with the new Stable Diffusion Controlnet generated QR codes [1] could actually be pretty interesting<p>[1] <a href="https://www.linkedin.com/posts/gschwandtner-michael_qr-stablediffusion-aiart-activity-7075411631110766592-tj-a" rel="nofollow noreferrer">https://www.linkedin.com/posts/gschwandtner-michael_qr-stabl...</a>
How do you even represent HDR colors? I've tried Googling this and I can never really find an answer. Is it basically just eight hex digits instead of six?
I wonder why you couldn't just add a colour profile to a png file to shift the colours to this super white colour.<p>For that matter i thought avif supported HDR images.
Viewing this page (with the HDR element) resets my cursor to the bottom left. Also triggers this behavior when changing brightness whilst the HDR element is visible on screen. Anyone have a similar experience? On MacBook Air (M1, 2020).
Why does this work only on Apple devices. My android phone has a super bright screen (~1000 nits for HDR content). It supports HDR photos and videos as far as I can tell. But both QR codes appear to be the same brightness.
This is pretty neat. I tried the "Digital Colour Meter" app on MacOS, but both whites shows exactly the same values and it is also impossible to take a screenshot of. So I wonder how this works in the OS.
Doesn't seem to work (which I see as a positive) for me on an iPhone 13 Pro Max, using native Safari, low power mode is off as indicated. I guess I have another reason to thank Lockdown mode?
Neat trick. For one device I had to reduce contrast on the QR codes to yield an increase in detection. I assumed too much contrast was less desirable for the optics.
It's when I realize that you cannot simply have the screen (of Apple devices at least) display "white" by demanding a color "white".