ns-ui

Tag input as beads threaded onto a cord: committing a tag cinches a bead into place with one overshoot squeeze while its knot draws on; Backspace on an empty input unravels the last bead with a drop-and-twist. Duplicate commits shudder the existing bead instead of re-threading it.

Use when entry is the moment worth designing, since each accepted tag cinches into place as a bead on a visible cord and a duplicate shudders the existing bead instead of silently adding nothing, so rejection and repetition are legible where the user is typing; pick tag-input-pull or tag-input-tear instead when the interesting problem is removal, or tag-input-backspace when accidental Backspace deletion is the specific complaint.

• Inputs & forms

• tag-input
• chips
• input
• form
• svg
• micro-interaction