Hacker News Reader

Comment by zzzeek | Hacker News Reader

i am fascinated with that effect and turned off every CSS rule on the page I could find but did not identify how you make that effect

View on HN

I love it too. Appears to be accomplished with this CSS, which you can tinker with by finding the :after element at the bottom of the <body> tag in browser devtools:

  body::after {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(rgba(0, 0, 0, 0.4) 1px, transparent 1px);
    background-size: 2px 2px;
    background-repeat: repeat;
    pointer-events: none;
    z-index: 9999;
  }

i figured that's what it was, but i didnt know how to find it in the browser tools but i missed the "after" part, so yeah it's in the "pseudo-elements". nice!

    body::after {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(rgba(0, 0, 0, 0.4) 1px, transparent 1px);
    background-size: 2px 2px;
    background-repeat: repeat;
    ...

Reply on news.ycombinator.com