Centered top-bar
Brand stacked above links — symmetrical, editorial feel. Good for content-first sites.
.lsd-stack
.lsd-row
.lsd-center
.lsd-z-raised
Four navigation patterns — centered top-bar, split top-bar, a
fixed bottom dock at orbit Z-tier, and a vertical
.lsd-stack sidebar. Each ships with a
live preview + a Copy-HTML snippet using real framework
classes compiled in lsd-motion.css.
Brand stacked above links — symmetrical, editorial feel. Good for content-first sites.
.lsd-stack
.lsd-row
.lsd-center
.lsd-z-raised
Brand left, links adjacent, primary CTA pinned far-right. The workhorse SaaS nav.
.lsd-row
.lsd-align-center
.lsd-z-raised
.lsd-fx--hover-lift
Fixed to viewport bottom, floats at orbit Z-tier. Native-app feel for mobile-first marketing or PWAs.
.lsd-z-orbit
.lsd-row
.lsd-fx--hover-lift
Vertical .lsd-stack — fixed column, grouped link list. Apps & docs default.
.lsd-stack
.lsd-gap-sm
.lsd-z-base
Brand left, hamburger right. Tap to slide a stacked nav drawer down. The default mobile pattern — switch to the Mobile viewport to see it land at home.
.lsd-stack
.lsd-row
data-open
App-style fixed-bottom pill with 4 icon-and-label tabs. The active tab tints with the brand accent. Best paired with the Mobile viewport.
.lsd-z-orbit
.lsd-row
.lsd-fx--hover-lift