If you put a colorful image into photoshop
or instagram and blur it, you’ll see a weird, dark boundary between adjacent bright colors.
Yuk! In the real world, out of focus colors blend smoothly, going from red to yellow to
green – not red to brown to green! This color blending problem isn’t limited
to digital photo blurring, either – pretty much any time a computer blurs an image or
tries to use transparent edges, you’ll see the same hideous sludge. There’s a very simple explanation for this
ugliness – and a simple way to fix it. It all starts with how we perceive brightness. Human vision, like our hearing, works on a
relative, roughly logarithmic scale: this means that flipping from one light to two
changes the percieved brightness a TON more than going from a hundred and one to a hundred
and two, despite adding the same physical amount of light. Our eyes and brains are simply
better at detecting small differences in the absolute brightness of dark scenes, and bad
at detecting the same differences in bright scenes. Computers and digital image sensors, on the
other hand, detect brightness purely based on the number of photons hitting a photodetector
– so additional photons register the same increase in brightness regardless of the surrounding
scene. When a digital image is stored, the computer
records a brightness value for each colors – red, green and blue – at each point
of the image. Typically, zero represents zero brightness and one represents 100 percent
brightness. So 0.5 is half as bright as 1, right? NOPE. This color might LOOK like it’s
halfway between black and white, but that’s because of our logarithmic vision – in terms
of absolute physical brightness, it’s only one fifth as many photons as white. Even more
crazy, an image value of 0.25 has just one twentieth the photons of white! Digital imaging has a good reason for being
designed in this darker-than-the-numbers-suggest way: remember, human vision is better at detecting
small differences in the brightness of dark scenes, which software engineers took advantage
of as a way of saving disk space in the early days of digital imaging. The trick is simple: when a digital camera
captures an image, instead of storing the brightness values it gives, store their square
roots – this samples the gradations of dark colors with more data points and bright colors
with fewer data points, roughly imitating the characteristics of human vision. When
you need to display the image on a monitor, just square the brightness back to present
the colors properly. This is all well and good – until you decide
to modify the image file. Blurring, for example, is achieved by replacing each pixel with an
average of the colors of nearby pixels. Simple enough. But depending on whether you take
the average before or after the square-rooting gives different results!! And unfortunately,
the vast majority of computer software does this incorrectly. Like, if you want to blur a red and green
boundary, you’d expect the middle to be half red and half green. And most computers
attempt that by lazily averaging the brightness values of the image FILE, forgetting that
the actual brightness values were square-rooted by the camera for better data storage! So
the average ends up being too dark, precisely because an average of two square roots is
always less than the square root of an average. To correctly blend the red and green and avoid
the ugly dark sludge, the computer SHOULD have first squared each of the brightnesses
to undo the camera’s square rooting, then averaged them, and then squared-rooted it
back – look how much nicer it is!! Unfortunately, the vast majority of software,
ranging from iOS to instagram to the standard settings in Adobe Photoshop, takes the lazy,
ugly, and wrong approach to image brightness. And while there are advanced settings in photoshop
and other professional graphics software that let you use the mathematically and physically
correct blending, shouldn’t beauty just be the default?

Computer Color is Broken
Tagged on:                                                                                                                                         

100 thoughts on “Computer Color is Broken

  • July 11, 2019 at 2:21 pm
    Permalink

    my internet is broken

    Reply
  • July 11, 2019 at 2:43 pm
    Permalink

    Beauty is computationally expensive, and drawing software already runs terrible enough as is. We just need linear RGB for working data set, since RAM is cheap enough.

    Reply
  • July 11, 2019 at 2:56 pm
    Permalink

    Thank you! That was an awesome video to go with my coffee. I learned something and now I want to figure out which editing programs will give me those gorgeous RGB blends!

    Reply
  • July 11, 2019 at 3:03 pm
    Permalink

    RGB values go from 0-255 not 0-1 otherwise great video!

    Reply
  • July 11, 2019 at 3:05 pm
    Permalink

    I will now forever be bothered by dark lines between bright blurred colors. You’ve cursed me

    Reply
  • July 11, 2019 at 4:19 pm
    Permalink

    Minute physics made it through a video without calling everything sexist, racist, or homophobic. Good for you guys.

    Reply
  • July 11, 2019 at 4:52 pm
    Permalink

    I never knew how badly I wanted to know about this information I’m glad I clicked.

    Thank you

    Reply
  • July 11, 2019 at 5:27 pm
    Permalink

    Looks fine to me.

    Reply
  • July 11, 2019 at 8:33 pm
    Permalink

    We understood this

    Reply
  • July 11, 2019 at 8:42 pm
    Permalink

    As computer graphic that have to work with sRGB and linear color space images simultaneously i really wish that anarchic CRT dumb thing called sRGB would die -_-.

    Reply
  • July 11, 2019 at 10:08 pm
    Permalink

    soooo, how can i make it do it the right way in photoshop?

    Reply
  • July 11, 2019 at 10:20 pm
    Permalink

    3:20 – I just tried this in Photoshop and it didn't work at all. wtfx?

    Reply
  • July 11, 2019 at 10:46 pm
    Permalink

    fifty shades of grey

    Reply
  • July 11, 2019 at 11:23 pm
    Permalink

    Well art software developers… there’s no excuse now

    Reply
  • July 12, 2019 at 3:20 am
    Permalink

    Fortunately, Windows and Linux must get it right since ALL the samples in the video were iOS or Mac based. Pity, I thought Apple was all about getting it right.

    Reply
  • July 12, 2019 at 4:33 am
    Permalink

    All these companies should be taking notes

    Reply
  • July 12, 2019 at 4:59 am
    Permalink

    ibisPaint X doesn’t do this :3

    Reply
  • July 12, 2019 at 7:43 am
    Permalink

    4:14 AKP ?

    Reply
  • July 12, 2019 at 7:49 am
    Permalink

    The only thing I understood is that Apple is lazy

    Reply
  • July 12, 2019 at 7:56 am
    Permalink

    how do i make a software that does this

    Reply
  • July 12, 2019 at 9:08 am
    Permalink

    Even einstein would be confused when watching this

    Reply
  • July 12, 2019 at 9:10 am
    Permalink

    Where are these magical settings for photoshop?

    Reply
  • July 12, 2019 at 9:44 am
    Permalink

    about the audible audiobook. If you already have an audible account you cannot get this audiobook for free anymore, right? If I am wrong and am able to receive the free audiobook, could somebody tell me what I have to do? thanks

    Reply
  • July 12, 2019 at 10:19 am
    Permalink

    It increases the computational complexity of a blur massively if you have to do a square root and two squares though.

    Reply
  • July 12, 2019 at 10:28 am
    Permalink

    i expected a deathcore song…

    Reply
  • July 12, 2019 at 10:35 am
    Permalink

    Wow, I never heard about it! Even though I am pretty advanced in computer vision (did vSLAM diploma project, and almost got a computer vision engineer position).

    Reply
  • July 12, 2019 at 11:14 am
    Permalink

    Fix your sound please. I can hear Main's Hum.

    Reply
  • July 12, 2019 at 11:21 am
    Permalink

    It's a shadow.

    Reply
  • July 12, 2019 at 11:30 am
    Permalink

    Way to go Henry! Great analysis.

    Reply
  • July 12, 2019 at 11:35 am
    Permalink

    K
    But how do i change the settings to use that formula instead

    Reply
  • July 12, 2019 at 2:16 pm
    Permalink

    One question…

    Are colors broken on phone too?

    Reply
  • July 12, 2019 at 6:39 pm
    Permalink

    Holy shit that bass tone is so good

    Reply
  • July 12, 2019 at 8:23 pm
    Permalink

    WHY DIDN'T I KNOW THIS
    I can unironically say this would have made some projects I've toyed withe such as cell shading and such WAAAAAY easier had I known.

    Reply
  • July 12, 2019 at 8:23 pm
    Permalink

    WHY DIDN'T I KNOW THIS
    I can unironically say this would have made some projects I've toyed withe such as cell shading and such WAAAAAY easier had I known.

    Reply
  • July 12, 2019 at 11:22 pm
    Permalink

    Thanks for explaining gamma in a way that doesn't make my brain crust over. I enjoy graphics algorithms and the Gaussian blur issue here is very useful to know!

    Reply
  • July 13, 2019 at 12:20 am
    Permalink

    He just ignores anything other than apple exists

    Reply
  • July 13, 2019 at 12:23 am
    Permalink

    I laugh as i see this cuz when sliding down the notification panel in android it blends the colours fantastically… while macbooks still are shit at it

    Reply
  • July 13, 2019 at 2:02 am
    Permalink

    Eat my ass

    Reply
  • July 13, 2019 at 3:27 am
    Permalink

    youtube at 12 am on a saturday: youve heard of math with letters?? what about math with COLORS

    Reply
  • July 13, 2019 at 3:35 am
    Permalink

    I've never heard a video so angry sounding yet so cordial at the same time

    Reply
  • July 13, 2019 at 5:38 am
    Permalink

    I dont understand…..

    Reply
  • July 13, 2019 at 7:08 am
    Permalink

    Use something like CIELUV instead of trying to 'fix' RGB.

    Reply
  • July 13, 2019 at 7:09 am
    Permalink

    I'm too retarded to understand most of this

    Reply
  • July 13, 2019 at 1:30 pm
    Permalink

    Better title: some developers made bad code

    Reply
  • July 13, 2019 at 4:49 pm
    Permalink

    Software engineers hate this guy!,

    Reply
  • July 13, 2019 at 8:43 pm
    Permalink

    btw its called linear workflow to do things correctly

    Reply
  • July 14, 2019 at 3:36 am
    Permalink

    More programmers would get this right if we knew that the image values had been square rooted. But that information is not readily available. This is the first I've ever heard of it.

    BTW: The square root function exaggerates human sensitivities. That is to say, dark computer-generated colors are practically indistinguishable, so about a quarter of the computer color gamut is essentially unusable, and light color gradations are too coarse IMHO.

    Reply
  • July 14, 2019 at 7:46 am
    Permalink

    1/5 is 20% not 22% 1:30

    Reply
  • July 14, 2019 at 8:20 pm
    Permalink

    ……. so what does it mean if i see that brown/black border in real life?

    Reply
  • July 14, 2019 at 11:50 pm
    Permalink

    Why does this video even exist?

    Reply
  • July 15, 2019 at 12:56 am
    Permalink

    Why am I here

    Reply
  • July 15, 2019 at 2:23 pm
    Permalink

    Thank you! I need this knowledge. Hope I'll remember how to do it when the time comes.

    Reply
  • July 16, 2019 at 3:12 am
    Permalink

    looks like GIMP does it right

    Reply
  • July 16, 2019 at 5:18 pm
    Permalink

    Note: the PS setting he displays in this video does not solve this problem for anything other than blended layers. If you want the blur filters to look right, you need to switch the image into 32-bit color mode (Image->Mode->32 Bits/channel). Note that this disables many features within photoshop, so if you need to use certain adjustment layers, etc, you may have to perform the edits in a smart layer (which can be in a different color mode). Edit: I hear Lab mode works for this as well.

    Reply
  • July 20, 2019 at 1:30 pm
    Permalink

    Sooo it doesn't happen in my phone cuz the software does it the correct way?

    I mean I've never seen a failed blur before

    Reply
  • July 23, 2019 at 9:59 pm
    Permalink

    That's why professional photographers always use "raw" image format. It preserves colour and brightness information correctly.

    Reply
  • July 24, 2019 at 8:50 am
    Permalink

    So the current cameras lies about the colours -so how is merging Ais gonna know that humans use lies to see information???

    Reply
  • July 24, 2019 at 3:34 pm
    Permalink

    If we see logarithmically, then why did they choose the square root instead of the logarithm?

    Reply
  • July 27, 2019 at 3:55 pm
    Permalink

    I once wanted to use my camera to do some measures, and I checked the linearity of the captor by taking pictures of the very same light scene (my computer screen with a white image, if I remember well), changing just the exposure time. And that was very linear.
    But I used the RAW files, not the jpeg.
    Is this encoding relative to jpeg only?

    Reply
  • July 27, 2019 at 8:19 pm
    Permalink

    I find it hilarious that the "king" of image editing software Photoshop does this wrong xD

    Reply
  • July 28, 2019 at 3:38 am
    Permalink

    You just ruined my adobe photoshop experience and set me back years now i have to change my settings 😭

    Reply
  • July 29, 2019 at 7:17 am
    Permalink

    so you just take RAW image with no compression to jpeg and you edit it and it suppose to have better colout blending ?

    Reply
  • July 29, 2019 at 9:25 pm
    Permalink

    AWESOME!!!

    Reply
  • July 29, 2019 at 10:24 pm
    Permalink

    Am I the only one who doesn't understand anything ?

    Reply
  • August 1, 2019 at 4:16 am
    Permalink

    This has never happened to my Mac… U crazy bitch must be using windows or other shitty OS like android… smh…

    Reply
  • August 1, 2019 at 5:17 pm
    Permalink

    "in real life colors blend smoothly", he says, while showing lens blur with visible dark smudge between adjacent brightly-colored rectangles. Srsly m8?

    Reply
  • August 1, 2019 at 8:57 pm
    Permalink

    As someone who loves Photoshop, thank you for showing the setting to fix this

    Reply
  • August 3, 2019 at 2:12 am
    Permalink

    I LITERALLY NEVER KNEW THIS O_O ❤

    Reply
  • August 3, 2019 at 9:27 pm
    Permalink

    The solution is so easy, why doesn't literally everything use it.

    Reply
  • August 4, 2019 at 8:37 pm
    Permalink

    It may be a stupid question but… isn't it sufficient to shoot in raw?

    Reply
  • August 7, 2019 at 12:54 am
    Permalink

    I'm guessing processing power (and time).

    Reply
  • August 7, 2019 at 12:50 pm
    Permalink

    I have to use this in one of my programming projects!

    Reply
  • August 7, 2019 at 8:34 pm
    Permalink

    i'll have to remember this when mixing colours 😀

    Reply
  • August 9, 2019 at 4:04 am
    Permalink

    I just checked my digital art program, it doesn't have this proble… yey

    Reply
  • August 9, 2019 at 8:29 am
    Permalink

    what does 2 mean

    Reply
  • August 9, 2019 at 3:51 pm
    Permalink

    Wow, never knew. Good lesson!

    Reply
  • August 10, 2019 at 5:16 am
    Permalink

    the computer colour is not broken, our eyes are.

    Reply
  • August 11, 2019 at 12:16 pm
    Permalink

    010101 in hexadecimal with RBG units actually reed 99.77897% Black, and not pure white!

    Reply
  • August 16, 2019 at 5:19 pm
    Permalink

    who cares
    why the fuck does this…ugh why do I even bother

    Reply
  • August 23, 2019 at 8:34 am
    Permalink

    Looked at this, AMAZING how much that's come

    Reply
  • August 30, 2019 at 7:37 am
    Permalink

    It's funny how stupid mathematicians are… adding ONE light to TWO means everything got 100% brighter, whereas adding ONE to (for example) NINETY NINE, things only got 1% brighter…

    Reply
  • September 5, 2019 at 8:44 pm
    Permalink

    Funfact: paint.net does exactly that. It blurs the way it should instead of how other programs do it.

    Reply
  • September 6, 2019 at 4:56 pm
    Permalink

    Bad example at the begining, 2 light bulbs are twice as bright as one, whereas 102 lightbulbs are less than a hundredth brighter than 101.

    Reply
  • September 6, 2019 at 9:20 pm
    Permalink

    I have an OC a that had blended colors and I hate it

    Reply
  • September 7, 2019 at 3:36 pm
    Permalink

    when you learn more of a minute video than hours of school

    edit: oops i meant 4 minutes

    Reply
  • September 8, 2019 at 8:13 am
    Permalink

    Is it broken, is it just incompetent graphics coders? Blending and other arithmetic should happen in display linear space. I wrote a Dr. Dobb's journal article (dead tree publication) on this in 1999, and it wasn't original then. 2 decades later the same mistakes are being made.

    Reply
  • September 10, 2019 at 9:16 pm
    Permalink

    How to outsmart you're art teacher

    Reply
  • September 11, 2019 at 12:09 am
    Permalink

    basically, humans are very lazy

    Reply
  • September 12, 2019 at 4:53 am
    Permalink

    ahem! blending..

    Reply
  • September 13, 2019 at 9:58 am
    Permalink

    Every digital artist's lifesaving video

    Reply
  • September 15, 2019 at 4:13 pm
    Permalink

    Don’t you mean, “Printer Color?”

    Reply
  • September 16, 2019 at 9:10 pm
    Permalink

    Paint.NET has this with unfocus.

    Reply
  • September 22, 2019 at 4:07 pm
    Permalink

    y does your logo look like a gravestone

    Reply
  • October 2, 2019 at 2:11 am
    Permalink

    the problem is that squaring is very computationally demanding.

    Reply
  • October 3, 2019 at 4:48 pm
    Permalink

    You're wrong. It's your VGA color palette. Some computers have brown instead of orange, throwing off any art produced on the machine. There are usually four or 16 colors produced by a VGA emulator on modern PCs, and one or two of them might be off. You can alter your VGA color palette in the Control Panel, or, sometimes, in the BIOS (On a P.O.S. Dell).

    Reply
  • October 11, 2019 at 12:00 am
    Permalink

    This is not a rainbow
    V V V V V V V V V V
    🏳️‍🌈🏳️‍🌈🏳️‍🌈🏳️‍🌈🏳️‍🌈🏳️‍🌈🏳️‍🌈

    It's an LGBTQ+ flag

    I say these because of your "this is not a rainbow" video

    Reply
  • October 11, 2019 at 12:22 am
    Permalink

    I don't like how much apple product placement is in this video.

    Reply
  • October 14, 2019 at 3:19 am
    Permalink

    English please

    Reply
  • October 16, 2019 at 12:50 am
    Permalink

    But the stickman would need his own eyes to know where to point the big eye!

    Reply

Leave a Reply

Your email address will not be published. Required fields are marked *