Anchor

In-page section rail — a scroll-spy table of contents beside long content.

Add AnchorLink children with href="#section-id" matching element ids on the page. The active link updates as the user scrolls; clicking a link scrolls the target into view. Set config.offset_target when scrolling a bounded container instead of the document. For cross-route navigation use Link or the router — not Anchor.

  • Long documentation or settings pages with in-page section navigation
  • Table-of-contents rails beside scrollable content
  • Nested section hierarchies via nested AnchorLink children
  • Render AnchorLink children with href="#section-id" matching element ids.
  • Place target sections in the page with matching id attributes.
  • Set config.offset_target when scrolling a bounded container instead of the document.
Basic rail

Side rail with two section links beside scrollable content.

Intro

Intro section content.

Details

Details section content.

Custom scroll container

offset_target scopes scroll-spy calculations to a bounded scrollport.

Top

Bottom

Active on scroll

Scrolling the content region updates the active link class on the rail.

First

Second

Layout composition

Rail sits beside a multi-section article layout.

Setup

Install and configure.

Deploy

Ship to production.

Theme tokens

Active rail bar uses brand background tokens from the Orbital theme.

Theme section