Sticky Subnav
A sticky secondary navigation that highlights the current section on scroll, with smooth scrolling and mobile overflow fades.
Copy a prompt for your AI coding tool with the source, dependencies and usage
Props
StickySubnavProps
Also accepts all props of Omit<React.ComponentProps<"nav">, "children">
| Prop | Type | Default | Description |
|---|---|---|---|
| sections* required | SubnavSection[] | — | — |
| scrollContainer | React.RefObject<HTMLElement | null> | — | The scrolling element that contains the sections. Omit to use the page itself |
| actions | React.ReactNode | — | Optional content pinned to the right edge, e.g. a call-to-action |
Install
$ npx shadcn@latest add https://chromotion.dev/r/sticky-subnav.json