Hacker News Reader

Everything looked sort of obvious except the fluidity of the goo inside. The trick used to achieve the latter is quite neat!

As far as I understand, it uses a combination of Gaussian blur, which gives the soft, fluid texture, and a clipping path which gives well-defined edges. Once two drops of goo touch, they start to visibly 'meld' due to the blur.

View on HN

The clipping path was to ensure that the goo stayed inside the lava lamp -- the well-defined edges were the result of the color matrix.

You can see this easily by deleting those two parts of the pen (This is one of the great things about codepen, if it weren't for this, I would have phrased this much less confidently)

Yes, and to be perfectly clear, the color matrix is all identity except for the alpha row [0 0 0 21 -9]. This is stretching the alpha range so that many of the semi-transparent areas outside of the original blob that were generated by the gaussian blur are now completely opaque. (It's similar to a thresholding operation, but there are some middle values that survive.)

Reply on news.ycombinator.com