Platforms Navbar

FreeNew

Preview live, install via shadcn or copy the source.

Installation

Install via shadcn

This will install the component and its dependencies automatically.

Usage

platforms-navbar-usage.tsxTSX

Props

NameTypeDefaultRequiredDescription
itemsPlatformsNavItem[]NoNav items with label, href, optional active/badge.
logoReact.ReactNodeNoCustom logo node. Defaults to flip logo.
hideLogobooleanfalseNoHide logo.
classNamestringNoRoot header class — user controls positioning.
styleReact.CSSPropertiesNoInline style for root.
position"static" | "relative" | "absolute" | "fixed" | "sticky"relativeNoPosition preset when className not provided.
topstringNoTop offset for fixed/absolute/sticky.
zIndexnumber | stringNoZ-index.
containerClassNamestringNoInner flex container class.
logoWrapperClassNamestringNoLogo wrapper class.
navClassNamestringNoNav pill class.
linkClassNamestringNoLink class.
actionsClassNamestringNoActions wrapper class.
searchButtonClassNamestringNoSearch button class.
mobileNavClassNamestringNoMobile nav wrapper class.
cta{ label, href, variant, size, icon, className }NoCTA config.
ctaNodeReact.ReactNodeNoCustom CTA node.
showSearchbooleantrueNoShow search button.
onSearch() => voidNoCalled when search clicked.
disablePaddingbooleanfalseNoDisable built-in padding.
© reframe/ui 2026Built by @thommysart
More in Navigation