AccelByte Page Header | Public Design System Documentation

Skip to documentation

Design systemsSelect design system

Search this documentation

Back to portfolio

Page Header

Keep page identity, context, and actions understandable as available width changes.

Created & adapted by Insan NurjamanAnt Design foundationCurated public preview

Component model

The source composes breadcrumbs, title, status, identifiers, account context, metadata, overview controls, and tabs. Boolean properties expose optional content; responsive variants rearrange it.

Original specimens

Original dark AccelByte page headers across desktop, tablet, and mobile — Original exported design. Open to inspect at full size. Source appearance is preserved; private editable files are not linked.

Usage

Choose deliberately

Retain the context needed to explain the current page.
Let narrower layouts use more rows instead of simply shrinking everything.
Keep optional metadata out of the way of the primary task.

Keep the limits visible

Source properties and screenshots document design intent. Validate the supported combinations and interaction behavior in the implementation before treating them as a guarantee.

Read usage guidelines

Curated design documentation by Insan Nurjaman. Native examples are illustrative, not a production package or a standards certification.

Explore the story