Notch Drop

a notch hanging from the top edge of a page of cards. lift a card, hold it over the notch, and let go: a black drop leaves the card and merges into the notch.

key insight: the notch is a liquid, which is two black shapes under one SVG filter. feGaussianBlur bleeds them into each other and an feColorMatrix alpha row of 22 -10 cuts the bleed back to an edge, so two shapes within a few pixels grow a neck.

the label is not under the filter, since the threshold destroys any edge worth keeping, so the face is a second layer animated to the same box. the opening spring overshoots on purpose: a box resizing on an ease is a box resizing.