An editorial route rail pairs large scrolling labels with fixed indices, context notes and a clipped active marquee that stops cleanly on focus.
ReadyAn editorial route rail pairs large scrolling labels with fixed indices, context notes and a clipped active marquee that stops cleanly on focus.
- Product navigation
- Account flows
- Application shells
- Only the active route enters the clipped marquee layer
- Fixed indices keep every row scannable while labels move
- Focus can pause the marquee without changing navigation state
- A component-specific renderer and control contract—not a palette swap of another release
- Semantic controls, visible focus and keyboard navigation ship with the visual system
No animation package or external preview asset is required. Layout is container-scoped and decorative motion is disabled when reduced motion is requested.
Pointer, touch, horizontal trackpad and keyboard states use the same underlying component state.
Native landmarks and controls preserve reading order, visible focus and keyboard access. Motion never carries the only meaning.
BEHAVIOR
Built to move without taking over.
- Only the active route enters the clipped marquee layer
- Fixed indices keep every row scannable while labels move
- Focus can pause the marquee without changing navigation state
- A component-specific renderer and control contract—not a palette swap of another release
- Semantic controls, visible focus and keyboard navigation ship with the visual system
USE IT
Sign in, copy the source, rename it, tune the values and ship it inside your own system.
