Display brighter-than-white color on Apple devices

Apple did a clever thing with HDR content where it can appear amongst other non-HDR content, and only the part of the screen displaying the HDR content is in HDR. But in practice it looks really bad and I hate every time I'm scrolling Instagram and an HDR video appears in my feed. It blows my eyes out and then the rest of my screen looks gray and muted for a few seconds until I get the HDR content off my screen.

This has been known for quite a while and can be used for arbitrary HTML elements with some CSS hacks. I&#x27;m suprised no &quot;super bright&quot; advertisements have shown up so far. <a href="https:&#x2F;&#x2F;kidi.ng&#x2F;wanna-see-a-whiter-white&#x2F;" rel="nofollow noreferrer">https:&#x2F;&#x2F;kidi.ng&#x2F;wanna-see-a-whiter-white&#x2F;</a> (Safari only)<p>On macOS you can use apps like BetterDisplay, Vivid or BetterTouchTool to enable that HDR mode for the whole display, which makes it significantly easier to work outside. On iOS there is &quot;Vivid Browser&quot; - a browser that enables the HDR mode for the whole screen.

That&#x27;s interesting. Every normal white feels pale and boring after seeing that white. I&#x27;m not writing this as a joke, everything that is supposed to be white looks like a greyish, washed out white right now.

I tried experimenting with something similar using three.js a while ago [0] when I saw the other post [1]. The trick was hiding the HDR video in the page, allowing other elements to surpass a brightness level of 1. I have a post-processing shader that divides all brightness values by 2, along with CSS that applies filter: brightness(2). Finally a shader material on one of the spheres multiplies its fragment output by a value above one.<p>[0] <a href="https:&#x2F;&#x2F;r3f-hdr.netlify.app" rel="nofollow noreferrer">https:&#x2F;&#x2F;r3f-hdr.netlify.app</a><p>[1] <a href="https:&#x2F;&#x2F;kidi.ng&#x2F;wanna-see-a-whiter-white&#x2F;" rel="nofollow noreferrer">https:&#x2F;&#x2F;kidi.ng&#x2F;wanna-see-a-whiter-white&#x2F;</a>

If anyone’s curious how this physically (appears to) work - it seems it boosts the backlight and applies a dark overlay on the rest of the page. If the brightness on my iPad Air 4 is max, the white stays the same. If it’s lower then it’s “super white”.

&gt; Unfortunately, this color cannot be represented with CSS colors (rgb(999,999,999) doesn’t work)<p>I think this is wrong. Browsers already support HDR with other color space like this one <a href="https:&#x2F;&#x2F;oklch.com&#x2F;" rel="nofollow noreferrer">https:&#x2F;&#x2F;oklch.com&#x2F;</a>

There probably should be a toggle or a separate brightness control (i.e. &quot;maximum brightness&quot; and &quot;default brightness&quot;) if something like that is exposed to the web.<p>Letting content be arbitrarily much brighter than what the user expects seems a terrible design, easily exploitable by advertisers and all sorts of attention thieves.

So this is the trick that Facebook was using to make videos stand out more in the feed? I&#x27;ve noticed they are darkening rest of the page a little, but didn&#x27;t know this also bumps backlighting brightness.

Duplicate: <a href="https:&#x2F;&#x2F;news.ycombinator.com&#x2F;item?id=36384625">https:&#x2F;&#x2F;news.ycombinator.com&#x2F;item?id=36384625</a>

How many hours can I display super-white brightness before burnin starts to happen?<p>If this is just designed for bright brief &#x27;glints&#x27; of light in videos, I can imagine the screen itself might be being substantially overdriven, and there might well be damage if you did this for hours on end (or even maybe minutes, especially on a hot day).<p>OLED isn&#x27;t known for longevity when displaying bright colors...

I&#x27;m listening to Spotify on a stock M1 MacBook Pro 16&quot;, and when I opened this Github demo the speakers started crackling, until I closed the tab.

I was wondering whether such HDR videos are also on YouTube. Yes, same super white video: <a href="https:&#x2F;&#x2F;www.youtube.com&#x2F;watch?v=n__QY3e55Lc">https:&#x2F;&#x2F;www.youtube.com&#x2F;watch?v=n__QY3e55Lc</a><p>Some other random HDR video: <a href="https:&#x2F;&#x2F;www.youtube.com&#x2F;watch?v=72_rYwzLhjk">https:&#x2F;&#x2F;www.youtube.com&#x2F;watch?v=72_rYwzLhjk</a>

Browser support for &quot;HDR&quot; features is already in CSS. Using a video over idiomatic CSS is a hack. <a href="https:&#x2F;&#x2F;developer.chrome.com&#x2F;articles&#x2F;high-definition-css-color-guide&#x2F;" rel="nofollow noreferrer">https:&#x2F;&#x2F;developer.chrome.com&#x2F;articles&#x2F;high-definition-css-co...</a>

doesn&#x27;t work with firefox on my M1 MBP, but it does in safari.

“Brighter-than-white”…<p>Gilchrist enters the chat.<p><a href="http:&#x2F;&#x2F;wexler.free.fr&#x2F;library&#x2F;files&#x2F;gilchrist%20(1999)%20an%20anchoring%20theory%20of%20lightness%20perception.pdf" rel="nofollow noreferrer">http:&#x2F;&#x2F;wexler.free.fr&#x2F;library&#x2F;files&#x2F;gilchrist%20(1999)%20an%...</a>

A simple website blowing my mind is very rare. And now every other white seems so pale &amp; washed out.

I&#x27;m on an iPhone 14 Pro Max in Safari without power saving turned on but those 2 QR codes look identical to me. I tried turning off dark mode but they still look the same. What am I doing wrong here?

Is the &quot;normal white&quot; toned down to reduce eye-strain?

The number of colors defined by software will not represent exactly all the colors a system can display; the software colors are arbitrarily defined and at discrete levels.<p>I expect that any system can physically output colors in addition to the software definitions, including in-between colors and especially, assuming the engineers left margin for error, colors at the extremes of brightness and hue could be generated.

Am I the only person wondering whether at some point screen brightness becomes a health concern? Looking at this for more than a second almost hurts, and now it&#x27;s as if I&#x27;ve stared into a flashlight and it takes minutes for my eyes to get back to normal.<p>(not an eye specialist, but I do have a biomedical background and I don&#x27;t think it&#x27;s completely ridiculous to be somewhat concerned...)

Persil are going to have a field day with this.

Apparently a tab with that hack consumes a ton of energy, even when hidden. Weird. Google Chrome, MBP M2 16&quot;.

I have an LG 4k HDR display (that really isn&#x27;t very good in the HDR department), and this works on the display too. I have to set the display to HDR mode, which then displays all colors really weird and mute, but the super bright trick does indeed work.

It displays as normal on my M1 MBP and then gradually ramps up over a second or two to the superbright white. Seems better suited to a static white area than a few video frames? At least on this device, I guess others might be more responsive to it?

Uh, that just made my screens darker, so kindly never do that again. That&#x27;s worse than a blink tag.<p>[edit] not sure why the downvotes. I have an XDR screen and it&#x27;s quite distracting when my entire screen goes dark for some local video to get bright.

Note it will not show superbright colors if you are in low power mode on the iPhone.

What privileges a superwhite QR code has versus a regular white?

The reason you can only do this with video is to avoid burn in?

For those confused by the title: it&#x27;s not &quot;brighter than white&quot;, it&#x27;s the same white but with the HDR pushing more nits.

Is there an opposite to this such as “superblack”?

&gt; please don’t abuse this<p>I’m preparing popcorn.

This hurts my eyeballs.

I’ve never understood why HDR is implemented in the strange way it is, outside the normal color spectrum. Really seems like #fff should just be the whitest white the display can physically support.

Why don&#x27;t they just make #FFFFFF brighter?

this makes my second screen to panic and glitch some windows when this is present

it makes my second screen to panic and glitch some windows when this is present

No one made the Spinal Tap joke? I’m disappointed in all of you. (Again)