UI Kits
Navigation

Tabs

Tabbed content navigation.

Usage guidance

When to use it.

Keep labels short and predictable. Make current location and focus state clear.

Accessibility

Implementation notes.

  • Use semantic nav landmarks where appropriate.
  • Indicate current page or active state.
  • Support keyboard and screen-reader navigation.
Release QA

Implementation checklist.

0/3
Handoff notes

Implementation notes for this component.

Quick section export
<div class="ap-tabs"><button class="active">Overview</button><button>Activity</button><button>Files</button><button>Settings</button></div>
Related components

More in Navigation