This component is designed for compact navigation moments where clarity matters more than visual noise. The base interaction stays clean and readable, while motion is used as feedback rather than decoration, so users can instantly understand what is interactive and what is currently in focus.
Use this pattern when you want a small menu trigger that opens quickly, feels responsive, and still leaves room for personality through micro-interactions.
The expressive variant adds a spring-like text scale behavior. This is the key line that gives the label its lively feel:
The cubic-bezier(.34,1.56,.64,1) curve intentionally overshoots before settling, which creates a subtle bounce effect without requiring a full spring animation system. In small UI controls like this, that slight overshoot helps the interaction feel tactile and confident while still staying fast.
Compared to a default ease-in-out, this curve reaches visible feedback sooner and finishes with more character. That makes the menu feel more responsive to pointer intent, especially on quick hover passes.
180ms to 240ms) so hover feedback stays snappy.left center) to avoid awkward text growth.1.05 to 1.12) to prevent jittery visual weight shifts.ease-out.