UI Kits
Sections

Site Header

Website header with branding and CTA.

Usage guidance

When to use it.

Use sections to structure complete page content and maintain consistent vertical rhythm.

Accessibility

Implementation notes.

  • Maintain heading hierarchy.
  • Keep text contrast readable.
  • Do not hide essential content at narrow breakpoints.
Release QA

Implementation checklist.

0/3
Handoff notes

Implementation notes for this component.

Quick section export
<header class="ap-site-header"><strong>AblePro</strong><nav><a>Home</a><a>Features</a><a>Pricing</a></nav><button>Contact</button></header>
Related components

More in Sections