Skip to content


Give a page a clear, separated title and optional top nav by adding a .pagehead.

Basic pagehead

In its simplest form, you can build a pagehead with a pagehead element with an h1 child.


Place an avatar inside the h1 to have margins applied to it. Don't forget the avatar class!

Also be sure to add aria-hidden="true" to hide the avatar from screenreaders.

Path divider

For path or breadcrumb patterns, wrap the / with path-divider to add some nice horizontal spacing.

Pagehead actions

To add actions on the right side of the pagehead, use the pagehead-actions element. Place pagehead-actions before the h1 to ensure proper placement.

Org nav


Use pagehead to construct a header and navigation for a repository.



Edit this page on GitHub
2 contributorssimuraicolebemis
Last edited by simurai on October 10, 2019