Free animated React component library
Animated navigation components.
Tab bars, menus, sidebars and accordions that glide between states and guide the eye. Hand-tuned motion components for React, completely free. Play with each one live, then copy the code or give your AI agent the prompt that comes with it.
Animated React menus, tabs and navigation
- Tab bar: A white, fully rounded mobile bottom navigation in three styles: a gliding soft gray pill, icons with labels and a dot, or a raised action button.
- Account menu: A profile pill that morphs into an account card: a status picker that recolours the avatar's dot, quick tiles that lift, a workspace switcher whose check flies, a filling storage meter and a log out that asks twice.
- Liquid tabs: Icon tabs where the chosen tab is a white bump grown out of the panel.
- Sidebar nav: An app sidebar that folds to a slim rail of icons.
- Context menu: Right click the card for a menu where every icon animates.
- Profile menu: A workspace profile menu where every icon has its own micro interaction as you hover its row.
- Pill tabs: Tabs whose white pill slides like a rubber band, stretching and thinning, then settling, with a motion blur that follows its speed.
- Action menu: A dropdown where every action answers back: the highlight slides between items, copy draws a check, download bounces and washes a light gray fill across, links nudge their arrow.
- Blur accordion: Panels spring open and smear with a vertical motion blur that follows their speed, while the plus folds into a minus and the answer rises into focus.