Navbar Kit · Static
Static navbars
Navbars that stay put, grouped by where they sit on the page. Docked ones attach to the top edge; floating ones hover over the content, either in one frame or as open pieces. Every one has its own hover interaction.
01 · 4 navbars
Docked
Attached to the top edge with no outer padding. Full-width background, no radius, a bottom border to separate it from the page.
Docked 01 — Classic · accent line slides along the bottom edge
Docked 02 — Centered logo · links tint accent, logo mark spins
Docked 03 — Minimal · underline from center, arrow nudge
Docked 04 — Announcement bar · arrow nudge, link chips, CTA lift
02 · 7 navbars
Floating / Framed
Lifted off the edges with padding around it. Everything lives inside one container: a bar, a pill or a card.
Framed 01 — Full width · underline grows from the left
Framed 02 — Pill · spotlight slides between links
Framed 03 — Centered logo · others dim, CTA arrow slides in
Framed 04 — Centered links · rolling labels, outline button fills
Framed 05 — Segmented · segment slides to the hovered tab
Framed 06 — With search · link dot, search accent ring
Framed 07 — Two rows · indicator slides along the bottom row
03 · 2 navbars
Floating / Open
No shared container. The logo, links and CTA float on their own, as separate pieces or individual chips.
Open 01 — Split pieces · links lift, CTA shine
Open 02 — Chips · each link fills on hover