Design inspiration curated from X
[See More Interaction] with a Contextual Last Read Tag Key takeaway... - P!
Published by P! on February 11, 2026.
Design notes
[See More Interaction] with a Contextual Last Read Tag Key takeaways: - I used a CSS Grid trick, toggling grid-template-rows between 0fr and 1fr to animate to an auto height smoothly. - The "last read" pill is a chat-style bubble with a custom top-right tail (using clip-path). To guide the eye, I added a "washed" highlight that grows from the bottom up to 60% using scaleY and origin-bottom, keeping the animation fluid and performant. Inspo: TikTok UI
This entry is part of MotionVault's curated archive of interface, product, brand, website, and motion design references from public creators on X.
Image rights and licensing remain with P!; use the original X post for source and licensing inquiries.
Interactive Sandbox & Production Code
Reverse-engineered 1:1 component with spring physics, accessible keyboard controls, and modular Tailwind CSS.