fun-with-clip-path

Creative

css visual effects

SHOW HN2026

fun-with-clip-path

I saw this cool navigation reveal, so I made a simple HTML+CSS version

github.com

#css clip-path#navigation animation#css-only menu#html css effect

141points
38comments
#457of 4,366 in 2026
Top 11%of 2026 by points

How HN took it

DebatedReal support and real criticism

11 positive, 4 neutral or asking, 1 mixed, 9 critical, out of 25 comments about the project. Thread score +0.13.

Design: 4 for, 5 againstIdea: 3 for, 1 againstExecution: 0 for, 2 againstPerformance: 1 for, 1 against

The thread, comment by comment

Each row is a top-level comment and its replies, in HN's order. Select a cell to open that comment on HN.

positive neutral or mixed critical about another commenter or something else the maker

What HN said

What people liked

  • Looks cool and creative

    From 5 comments
  • Demo loads fast

    From 1 comment
    • The _inspiration_ site loaded slowly on my Dino laptop, but the _demo_ was super fast. Good job.
      xtiansimon on HN

Objections

  • Poor usability: menu requires moving mouse across the screen

    From 3 comments
    • It looks cool, but to have to navigate from one side of the screen to the opposite one is quite suboptimal
      flaburgan on HN
    • I am not a big fan of that kind of UI. You have to move your mouse all the way top left and then all the way bottom right. It's the worst possible distance-to-move you can come…
      deterministic on HN
    • Neat experiment, but this is not good design. Design is about solving problems. A menu is suppose to help you to quickly find and get to a specific section of your site. Why do I…
      uxcolumbo on HN
  • Not mobile friendly and breaks on some screen sizes

    From 2 comments
    • This is not mobile friendly. Was that intentional?
      djfobbz on HN
    • As expected, this doesn't work with non-standard browser window sizes and is butchered on mobile in horizontal mode. But since the original implementation is also broken, I guess…
      self_awareness on HN
  • Keyboard accessibility is weak

    From 1 comment
    • I'm pretty forgiving about accessibility (I'm able to say this at all because I don't have to rely rigidly on accessibility tools) but nav menus feel like a baseline we shouldn't…
      AlexAplin on HN
  • Slow performance on some hardware

    From 1 comment
    • I tried to use it yesterday on my iPad. Some kind of element was blocking the menu. Tried it today on my PC (big screen) - the intro animation is slow - 6-10 FPS and clicking on…
      uxcolumbo on HN

Requests

  • Write-up on the design to code process

    From 1 comment
    • I like the demo. It's bold, creative, and dynamic. Will there be more explorations? Maybe a writeup on the design to code process?
      xtiansimon on HN

Questions

  • Is there a working demo link?

    From 2 comments
    • Is there a demo? The link points to a github repo, and github pages is not active
      bmacho on HN
    • Site is death hugged? Anyone have a working link?
      ddtaylor on HN

Alternatives named

  • Original JavaScript implementation by Iventions Events

    From 1 comment

Category, keywords, summaries and labels on this page were made by AI (Thread Reader v2) and not checked by hand. Each point links to the comments it came from.

Add a badge to your READMEShown on HackerShow
[![Shown on HackerShow](https://hackershow.org/badge.svg)](https://hackershow.org/show/46925811)