Navbar

shell · 5 variants · pages: home, landing, article

npx shadcn-vue@latest add @trame/shell-navbar   # Vue
npx shadcn@latest add @trame/shell-navbar       # React

underline-tabs @trame/shell-navbar--underline-tabs

a portfolio or editorial site: the name left, the links as tabs, the current page underlined, no button
floating-pill @trame/shell-navbar--floating-pill

a landing page or a launch: a rounded bar that floats over the page with one action at its end
classic @trame/shell-navbar--classic

a marketing site: the name left, the links centred, the action right
menu-overlay @trame/shell-navbar--menu-overlay

a portfolio, a studio or a brand site with few pages and a strong identity: an almost empty bar whose « Menu » opens a full-screen panel of very large links
spread-grid @trame/shell-navbar--spread-grid

an editorial or design-led site with 4 or 5 links: a Swiss-grid bar cut into equal columns, the name in the first, one link per column, the action in the last