February 7, 2026
Flash vs function smackdown
Show HN: I saw this cool navigation reveal, so I made a simple HTML+CSS version
Cool click-to-reveal menu divides the crowd: flashy fun or bad design
TLDR: A dev built a flashy click-to-reveal menu using only HTML and CSS. The community applauded the creativity but roasted the usability, debating whether eye candy that hides navigation makes the web worse or better—fun demo, shaky for real-world use.
A developer showed off a playful, click-to-reveal menu built with only HTML and CSS—no JavaScript—using shape masks (“clip-path”) to grow a circle from the corner and throw a dramatic “ray” across the screen. It’s inspired by iventions.com and the internet immediately split into camps. One excited fan cheered, “Nice work!” while others grabbed the popcorn as the design vs. usability fight kicked off.
The strongest opinions? Critics slammed the effect as form over function. “This feels like a bad tradeoff,” one commenter argued, saying “good design” often hides information and makes things less convenient. Another asked bluntly: Why hide the menu when there’s plenty of space? And yes, folks grumbled about having to move their mouse “from one side of the screen to the other” just to click a link. Accessibility concerns popped up, too—if menus are meant to help people navigate quickly, why add extra steps?
But the spectacle drew laughs and nostalgia. One commenter called it a “Flashback to Macromedia Flash,” giving big early-2000s energy. Others joked about “crossing the screen like it’s a marathon.” Still, it’s undeniably a clever demo: the circle expands based on screen size, and the polygon “ray” could be made dynamic with JavaScript later. Verdict from the crowd: cool proof-of-concept, questionable everyday use.
Key Points
- •A CSS-only navigation menu reveal is demonstrated, inspired by iventions.com and seen on X.
- •The effect uses two clip-paths: a growing circle and a polygon simulating a ray.
- •The circular reveal uses clip-path: circle(calc(1.42 * 100vmax) at 0 0) to cover the viewport.
- •vmax is used to size the circle; 1.42 (sqrt(2)) is applied to span from corner to corner.
- •The polygon ray is currently hardcoded but could be dynamically calculated with JavaScript for responsiveness.