Interaction Kit
12 copy-ready React micro-interaction demos by Armond Schneider
A one-page gallery of twelve small React interactions, each with a live inline demo on the homepage and a full-screen demo route: Image expand, Image modal, Icon morph (a sound toggle), Emoji picker, Search expand, Notification reveal, Spring button, Hold to delete, Tabs, Text highlight, Tooltip and Code block. The repo (armondschneider/interactionkit, MIT, 19 stars) calls itself an experimental collection and is a Next.js 15 / React 19 app built with Tailwind, Framer Motion, Lucide and Hugeicons, with the components sorted into src/components subfolders. There is no CLI, no shadcn registry and no per-component docs page — you read the demo, then lift the source out of the repo yourself.
Treat this as reference, not a dependency — there is no install command and no registry, so the only path is reading src/components in the repo and porting one file. It is worth that effort for exactly two of the twelve, Hold to delete and Notification reveal, which are fiddly to get right and rarely shipped by the big kits; for tabs, tooltips, modals and emoji pickers use shadcn/ui or Base UI instead, which give you the keyboard and ARIA behaviour this does not document. Expect to supply your own accessibility pass and to swap out its Lucide and Hugeicons imports.
Why it is here. A tasteful but very small personal collection — useful as a motion reference for a handful of interactions that mainstream kits skip, not as a foundation to build on.
- 12 interactions, each with a live demo route
- Hold-to-delete and notification-reveal patterns
- MIT source, Next.js 15 and Framer Motion
- No install path, copy from the repo
Verified 2026-08-15. HTTP 200. https://interactionkit.org/ (WebFetch + raw HTML via curl to enumerate all 12 /demo/ routes), https://github.com/armondschneider/interactionkit, https://github.com/armondschneider/interactionkit/tree/main/src/components. interactionkit.org/demo is a 404 — demos live at /demo/<name>.
