ns-ui
Headline whose glyphs liquefy near the cursor — an SVG gooey filter fuses neighbors into temporary ligatures that spring apart on leave, with a faint field drifting the melt on its own at rest.
Use when glyphs liquefy and fuse into gooey ligatures near the cursor via an SVG filter, drifting even at rest and springing apart on leave; use for a squishy, organic headline, not a legibility-first reveal; pick text-stitch-unpick instead when the cursor should unravel letters rather than fuse them, text-prism-split when the distortion should be chromatic and glitchy rather than gooey, or text-variable-weight when the response should be pure weight with no filter at all.
Install
npx shadcn add https://design.helpmarq.comns-ui / text-ligature-melt
sweep the cursor across the line — leave to snap the ligatures apart
| Prop | Type | Default | Description |
|---|---|---|---|
| text? | string | "SURFACE TENSION" | headline text — rendered as real, selectable DOM glyphs |
| sigma? | number | 70 | gaussian falloff radius of the melt field in px |
| swell? | number | 0.35 | max extra scale at zero distance (0.35 → 1.35x) |
| pull? | number | 6 | max translation toward the cursor in px — creates the overlap that goos |
| blur? | number | 6 | feGaussianBlur stdDeviation at full field strength — ramps down to near-zero at rest |
| className? | string | — | — |