[HN Gopher] CSS Optical Illusions
       ___________________________________________________________________
        
       CSS Optical Illusions
        
       Author : ulrischa
       Score  : 111 points
       Date   : 2026-01-22 17:41 UTC (5 hours ago)
        
 (HTM) web link (alvaromontoro.com)
 (TXT) w3m dump (alvaromontoro.com)
        
       | moralestapia wrote:
       | Wow, this is great!
       | 
       | I want to put some of them in my UIs.
        
         | herpdyderp wrote:
         | I've often run into these unintentionally messing up my UIs!
        
       | encom wrote:
       | These are all super dark, for some reason.
        
         | christophilus wrote:
         | You have to actually run them. Otherwise, they're just a dark
         | CodePen preview.
        
           | encom wrote:
           | Why the extra step of having to click each one? Only a few of
           | them are interactive.
        
             | d-us-vb wrote:
             | Because codepens can run javascript. And if a page has 50
             | of them, it might make the page load time much longer. I
             | know that all these examples are pure CSS, and maybe there
             | is a setting in codepen to disable the "Run" button and
             | automatically run it. Still, getting to decide is generally
             | a better pattern than presuming that that's what the user
             | wants, especially when the fact that the code is inside a
             | codepen makes it explicitly not an integral function of the
             | page. "I thought this was just a blog, and now you want me
             | to run all this javascript??" -- some JS hater, probably.
             | 
             | I appreciate getting to choose as much as possible when
             | code runs.
        
               | zamadatix wrote:
               | Somewhat ironically, Codepen ended up introducing the JS
               | execution requirement to view the content.
        
       | sandpaper26 wrote:
       | This is cool, but more as a demonstration of interesting CSS
       | techniques than optical illusions in my opinion.
       | 
       | Also, interestingly, I seem to be able to force myself to "see
       | through" all of these illusions except for induced gradients,
       | which I can't stop seeing unless I cover part of the screen.
        
       | nilslindemann wrote:
       | 33 - color fan: There is another interesting optical illusion
       | here: The fan seems to rotate faster when not directly looking at
       | it.
        
       | myfonj wrote:
       | These "dots appearing only while (not) focused" are known as
       | "extinction illusions", namely                   "25 - Appearing
       | Dots"
       | 
       | is "McAnany's type" [1], and                   "26 - Disappearing
       | Dots"
       | 
       | is known as "Ninio's type" [2], according Akiyoshi Kitaoka's
       | materials. (I have recreated them too few years ago [3][4],
       | before getting to the source.)
       | 
       | [1]
       | https://www.psy.ritsumei.ac.jp/akitaoka/kieru3e.html#:~:text...
       | 
       | [2]
       | https://www.psy.ritsumei.ac.jp/akitaoka/kieru3e.html#:~:text...
       | 
       | [3] https://codepen.io/myf/full/XjdmJy ( scintillation warning)
       | 
       | [4] https://codepen.io/myf/full/jMqoMW ( scintillation warning)
        
       | layer8 wrote:
       | Heh, I used to do these in Excel.
        
       ___________________________________________________________________
       (page generated 2026-01-22 23:00 UTC)