<p><em>[Disclaimer: I'm a hobbyist, not well-read in computer graphics techniques. I may be unfamiliar with common terminology or methods.]</em></p>
<p>It's possible to explain and reproduce this effect entirely in a “physically-based” manner, simulating the imperfections of physical objects:</p>
<ul>
<li>Many objects do not emit or reflect single wavelengths of light, but some spectrum, even if one wavelength dominates.</li>
<li>Light sensors, whether they are cameras or the human eye, do not have perfect RGB color filters which reject all light outside of non-overlapping bands.</li>
</ul>
<p>These two effects combined mean that <strong>if we make an object bright enough, well past the point of “overexposing” the image, all colors will become perceptually white.</strong> All you need to do to implement this is:</p>
<ul>
<li>Specify the monochromatic color of your glow such that none of its color channels are exactly zero.</li>
<li>While you're doing your floating-point color calculations in your fragment shader, multiply your glow by a number much greater than 1, causing clipping in the final output image.</li>
</ul>
<p>A potential disadvantage of this technique is that, if the hue of the glow is not one of the six primary or secondary colors, then there will be a hue shift in the segment between where one color channel saturates and two do; it'll shift some amount towards cyan/magenta/yellow before proceeding to white. This is not unrealistic, but it might be unaesthetic.</p>
<p>Even if there is not a hue shift, the points where individual color channels saturate might be noticeable due to the sharp change in the spatial derivative; this could be improved by introducing a “soft clipping” nonlinearity that slows down the approach to the maximum value of each channel (which is a form of global tone mapping).</p>
<hr />
<p>As an example of the results of this strategy, here is a simple simulation of a CRT oscilloscope trace that I programmed. The algorithm is:</p>
<ol>
<li><p>Draw many dim 1-pixel points overlaid with additive blending.</p>
<p>(It would be more efficient and precise to use a line with variable brightness, but throwing lots of points at the problem was easy to implement, though it produces artifacts such as dotted lines which are visible in this example.)</p>
</li>
<li><p>Blur.</p>
</li>
<li><p>Multiply by (R=0.1 G=1.0 B=0.5) × a configurable brightness parameter.</p>
</li>
</ol>
<p><a href="https://i.sstatic.net/rXNTA.png" rel="nofollow noreferrer"><img src="https://i.sstatic.net/rXNTA.png" alt="enter image description here" /></a></p>
<p>Notice that the dark areas (vertical lines) are mostly green and the bright areas (horizontal lines and peaks, where the simulated beam moves slower) have a white core.</p>

CC BY-SA 4.0
2020-12-29T10:12:18.920Z
That looks really neat! Here's what I gathered: render in hdr and blur, now the core pixels and surrounding pixels will have brightness > 1, tonemap (render) that as white.
AnnoyinC
CC BY-SA 4.0
2020-12-29T21:09:33.877Z
@AnnoyinC No blur is needed; you can also draw a designed gradient, and this will be more efficient for large halos. The blur is just a fitting approach for the _example,_ not for all cases.
Kevin Reid
CC BY-SA 4.0
2020-12-30T09:57:26.783Z
@Kevin_Reid that might be useful for billboards and maybe textures, but not bright surface lights, unless I do the cliche "paste a billboard over lights" thing, which I don't want.
AnnoyinC
CC BY-SA 4.0
2020-12-29T02:28:14.663Z
2020-12-29T02:28:14.663Z
Kevin Reid
<p>In general this is caused by HDR tone mapping. Tonemap curves typically decrease saturation as the input light gets brighter, so that very bright lights are rendered closer to white on the display. If bloom is rendered in HDR (prior to tonemapping) then the bloom around the light can still be highly saturated since it is of a lower intensity than the light itself, and so doesn't get desaturated by tonemapping as much.</p>
<p>You can see some good examples of this on the <a href="https://docs.unrealengine.com/en-US/RenderingAndGraphics/PostProcessEffects/ColorGrading/index.html" rel="noreferrer">UE4 Color Grading and Filmic Tonemapper</a> docs page. Unreal uses the <a href="https://knarkowicz.wordpress.com/2016/01/06/aces-filmic-tone-mapping-curve/" rel="noreferrer">ACES tone mapping curve</a>, which is a pretty good default tone curve that you can easily hook up in your own shader code as well.</p>
<p>That said, lightsabers in Star Wars games are probably a special case visual effect that's tuned specifically to reproduce how they look in the movies. :)</p>

CC BY-SA 4.0
2020-12-24T01:33:22.200Z
2020-12-24T01:33:22.200Z
Nathan Reed
<p>When a source of colored light is very bright, it's center appears white. What is the term I need to look for so I can implement this in my shader? I have added an image which is an example of what I mean. Obviously there is also some bloom going on but that alone doesn't cut it. The search results for &quot;opengl glow&quot; don't seem vey promising either, that just gives me more bloom, not white centers.</p>
<p>I have thought about <a href="https://stackoverflow.com/questions/4361023/opengl-es-1-1-how-to-change-texture-color-without-losing-luminance">blending a white emission with the desired color like in this question/answer.</a> However, as you can see that turns the emission pink, not red.</p>
<p>So what I'm really after is a tinted light, glowed, with high (color) contrast.</p>
<p><a href="https://i.sstatic.net/V6GAK.jpg" rel="nofollow noreferrer"><img src="https://i.sstatic.net/V6GAK.jpg" alt="example of effect" /></a></p>

<lighting><color><brightness>
"whiteness" in center of bright colored lights - what is it called?
AnnoyinC
# "whiteness" in center of bright colored lights - what is it called?

(Asked by: username_0 on 2020-12-24)

When a source of colored light is very bright, it's center appears white. What is the term I need to look for so I can implement this in my shader? I have added an image which is an example of what I mean. Obviously there is also some bloom going on but that alone doesn't cut it. The search results for "opengl glow" don't seem vey promising either, that just gives me more bloom, not white centers.

I have thought about [blending a white emission with the desired color like in this question/answer.](https://stackoverflow.com/questions/4361023/opengl-es-1-1-how-to-change-texture-color-without-losing-luminance) However, as you can see that turns the emission pink, not red.

So what I'm really after is a tinted light, glowed, with high (color) contrast.

[![example of effect](https://i.sstatic.net/V6GAK.jpg)](https://i.sstatic.net/V6GAK.jpg)

**Tags:** lighting, color, brightness


---

## 2 answers

### Answer by username_2 on 2020-12-24. Score: 5 | Accepted answer

In general this is caused by HDR tone mapping. Tonemap curves typically decrease saturation as the input light gets brighter, so that very bright lights are rendered closer to white on the display. If bloom is rendered in HDR (prior to tonemapping) then the bloom around the light can still be highly saturated since it is of a lower intensity than the light itself, and so doesn't get desaturated by tonemapping as much.

You can see some good examples of this on the [UE4 Color Grading and Filmic Tonemapper](https://docs.unrealengine.com/en-US/RenderingAndGraphics/PostProcessEffects/ColorGrading/index.html) docs page. Unreal uses the [ACES tone mapping curve](https://knarkowicz.wordpress.com/2016/01/06/aces-filmic-tone-mapping-curve/), which is a pretty good default tone curve that you can easily hook up in your own shader code as well.

That said, lightsabers in Star Wars games are probably a special case visual effect that's tuned specifically to reproduce how they look in the movies. :)


---

### Answer by username_1 on 2020-12-29. Score: 2

*[Disclaimer: I'm a hobbyist, not well-read in computer graphics techniques. I may be unfamiliar with common terminology or methods.]*

It's possible to explain and reproduce this effect entirely in a “physically-based” manner, simulating the imperfections of physical objects:

* Many objects do not emit or reflect single wavelengths of light, but some spectrum, even if one wavelength dominates.
* Light sensors, whether they are cameras or the human eye, do not have perfect RGB color filters which reject all light outside of non-overlapping bands.

These two effects combined mean that **if we make an object bright enough, well past the point of “overexposing” the image, all colors will become perceptually white.** All you need to do to implement this is:

* Specify the monochromatic color of your glow such that none of its color channels are exactly zero.
* While you're doing your floating-point color calculations in your fragment shader, multiply your glow by a number much greater than 1, causing clipping in the final output image.

A potential disadvantage of this technique is that, if the hue of the glow is not one of the six primary or secondary colors, then there will be a hue shift in the segment between where one color channel saturates and two do; it'll shift some amount towards cyan/magenta/yellow before proceeding to white. This is not unrealistic, but it might be unaesthetic.

Even if there is not a hue shift, the points where individual color channels saturate might be noticeable due to the sharp change in the spatial derivative; this could be improved by introducing a “soft clipping” nonlinearity that slows down the approach to the maximum value of each channel (which is a form of global tone mapping).

---

As an example of the results of this strategy, here is a simple simulation of a CRT oscilloscope trace that I programmed. The algorithm is:

1. Draw many dim 1-pixel points overlaid with additive blending.

   (It would be more efficient and precise to use a line with variable brightness, but throwing lots of points at the problem was easy to implement, though it produces artifacts such as dotted lines which are visible in this example.)
2. Blur.
3. Multiply by (R=0.1 G=1.0 B=0.5) × a configurable brightness parameter.

[![enter image description here](https://i.sstatic.net/rXNTA.png)](https://i.sstatic.net/rXNTA.png)

Notice that the dark areas (vertical lines) are mostly green and the bright areas (horizontal lines and peaks, where the simulated beam moves slower) have a white core.

> **Comments:**
> **username_0**: That looks really neat! Here's what I gathered: render in hdr and blur, now the core pixels and surrounding pixels will have brightness > 1, tonemap (render) that as white.  
> **username_1**: @username_0 No blur is needed; you can also draw a designed gradient, and this will be more efficient for large halos. The blur is just a fitting approach for the _example,_ not for all cases.  
> **username_0**: @username_1 that might be useful for billboards and maybe textures, but not bright surface lights, unless I do the cliche "paste a billboard over lights" thing, which I don't want.  

---

