The Floating Pill Navigation is a production-ready component built to recreate the polished behavior and visual feel of Apple’s tab-style navigation. Its defining feature is a smooth animated background pill that moves behind the active item when a link is clicked, paired with a text color change that keeps the active state clear and readable.
At its default settings, the component is tuned to closely match Apple’s actual tab navigation: motion behavior, spacing, padding, typography proportions, colors, and item structure are all set up to feel nearly identical out of the box. But unlike a locked visual clone, every important part of the component is fully customizable—so you can keep the Apple-like feel or push it into your own system entirely.
Perfect for product pages, segmented controls, filters, settings views, dashboards, and interfaces that need elegant, motion-led navigation.
The Floating Pill Navigation is a production-ready component built to recreate the polished behavior and visual feel of Apple’s tab-style navigation. Its defining feature is a smooth animated background pill that moves behind the active item when a link is clicked, paired with a text color change that keeps the active state clear and readable.
At its default settings, the component is tuned to closely match Apple’s actual tab navigation: motion behavior, spacing, padding, typography proportions, colors, and item structure are all set up to feel nearly identical out of the box. But unlike a locked visual clone, every important part of the component is fully customizable—so you can keep the Apple-like feel or push it into your own system entirely.
Perfect for product pages, segmented controls, filters, settings views, dashboards, and interfaces that need elegant, motion-led navigation.
