Tabs
Compare quiet underline, divider, pills, compact tabs, and segmented controls. Select a tab to try each option.
Tab styles
Routed resource navigation exposes the current page and keeps the full tab target interactive.
Quiet underline
The default. Selection stays clear without a full-width divider.
Divider
Use the rail when tabs need to separate navigation from the section below.
Pills
A softer option for small groups of peer views without a surrounding track. Routed pages use NavigationTabsList with the same treatment; in-page views use Tabs.
Nested
Use for a tab group inside a section or another tab panel, so it stays subordinate to page tabs.
Compact underline
Use the existing compact size for tabs inside dense sections.
Selection on canvas and on a white surface
The active option reads on the page canvas and inside a DataPanel header in both appearances: a raised option on the segmented track, and a filled, outlined pill. Switch the appearance to compare.
Usage by model
Panel surface
Panel content.