Heat Ink Cursor Trail
Ink that darkens where your cursor slows, then cools away. Move slowly, then stop.
Setup
1
Add it above your section. Drop the component in as a sibling directly after the section you want it over, in the same parent. Not inside the section.
2
Fill both axes and pin to all four edges. It should cover the section and keep covering it as the page resizes.
3
Put it on top. Give it a higher z-index than the content beneath. It never catches a click, so it is safe above anything, including links and buttons.
4
Keep the parent clean. Do not wrap it in a layer with opacity under 100%, a filter, or blend isolation. Any of those trap mix-blend-mode, and Multiply stops reaching the page — the ink will look like it is sitting on a grey sheet instead of soaking into the section. If Multiply looks wrong, this is why, every time.
5
Covering a whole page? Set Quality to Low. At Medium on a dense screen a full-viewport overlay is a 3-megapixel field. The effect is soft enough that the resolution drop is invisible, and it roughly halves the fill cost.
