Navbar 8 block design & features
Navbar8 is a fixed top navigation bar built with Shadcn UI, starting transparent and switching to a solid background after the user scrolls past a threshold. Logo with optional wordmark, Products and Company mega dropdowns, a Contact link, and ghost Log in plus default Sign up buttons align on one row. Each dropdown uses a two-column panel: a square image area on the left cross-fades between link-specific photos on hover, and a titled link list with descriptions on the right. Mobile opens a full viewport height sheet on a primary-colored background with a two-column link grid and a social links footer.
Rounded mega panels, large square photography, and high-contrast primary mobile chrome give a editorial marketing feel. Desktop triggers stay transparent until scroll adds a bottom border on the container. Image transitions use opacity crossfade rather than sliding galleries.
Distinctive for the hover-synced preview image pattern inside navigation, which is less common than static mega cards. Moderate complexity with image-driven polish: you need one photo per submenu link for the effect to work. Scroll listener behavior is the main interaction beyond standard menus.
Logo text hides on small breakpoints until medium width. Resize closes the mobile sheet automatically when crossing the desktop breakpoint.