Navbar 17 block design & features
The bar arranges a logo on the left, a row of four plain text links in the center, and an outline Sign Up button on the right. Built with the shadcn/ui NavigationMenu, the center links sit inside a rounded container with horizontal padding. A thin horizontal line beneath the links slides to match the position and width of the currently active item, animated with a 300ms transition driven by measuring element positions on click and resize.
Active link text renders in foreground color while inactive links use muted foreground, with no other hover decoration. The indicator bar is a half-pixel-tall rounded strip that tracks precisely under the selected label. Typography is small and medium-weight throughout, and the Sign Up button uses an outline variant at a 40px height.
The visual character is restrained and minimal, with no dropdowns, icons, or background color changes on the bar itself. Whitespace between links is generous at 24px gaps, and the overall height is governed by the natural padding of the section container rather than a fixed pixel value.
On mobile the links and indicator are replaced by a popover triggered by an animated hamburger icon that cross-fades between Menu and X states with a 300ms rotation. The popover lists links vertically with a left border highlight on the active item, and a Sign Up button sits at the bottom of the dropdown.