Standard Sticky
A full width sticky header with a bottom border, logo, inline links, and CTAs. Links collapse into a mobile sheet menu. A clean, dependable Modern SaaS header.
A full width sticky header with a bottom border, logo, inline links, and CTAs. Links collapse into a mobile sheet menu. A clean, dependable Modern SaaS header.
Search blocks by description or jump to a page.
The source for every Modern SaaS block is included with Basic and Pro. Pick a plan to copy the code.
Already purchased? Log in
Standard Sticky is a full width header that pins to the top of the viewport as the page scrolls. A small square logo mark sits on the left alongside the product name. To the right of center, four inline links (Product, Features, Pricing, Changelog) provide the main site navigation. On the far right, a ghost "Sign in" button and a solid "Get started" button give visitors two distinct calls to action. A subtle bottom border and a frosted glass background keep the bar readable over any content scrolling beneath it.
On smaller screens the inline links and CTA buttons are hidden. A hamburger icon replaces them and opens a slide-in sheet from the right edge. The sheet repeats the logo, lists the same links as full-height touch targets, and stacks the two CTA buttons at the bottom. All four nav links, both CTA labels, and the logo copy are straightforward text you can replace without changing any structure.
Reach for this block when your AI assistant product needs a conventional top bar that works at every breakpoint without demanding visual attention. It fits any page that already carries enough content to warrant sticky navigation, such as a long landing page, a docs root, or a marketing page with multiple distinct sections. Compared to the pill-shaped centered variant, this layout reads as more neutral and enterprise-friendly, which suits products where trust matters as much as style.
A natural flow around it on a Modern SaaS page:
Before
After
The bar has three independently editable regions, so you can tune any one of them without touching the others:
Tip: if your product has a single conversion goal, remove the ghost "Sign in" button and let the solid CTA stand alone for a cleaner bar.