Skip to main content

Top App Bar

Top app bars provide content and actions related to the current screen.

https://www.figma.com/design/JesXQFLaPJLc1BdBM4sisI/%F0%9F%A6%93-ZDS---Components?node-id=24183-7228

Demo​

zeta-web v1.4.2
Web Components

Storybook​

https://design.zebra.com/web/storybook/?path=/docs/components-top-appbar--docs

Slots​

NameDescriptionType
defaultThe content of the appbar.text
leadingThe content to be placed at the start of the appbar.text
trailingThe content to be placed at the end of the appbar.text

Attributes​

NameDescriptionTypeDefault
centeredCenters the content of the title.booleanfalse
extendedPlaces the title below the main appbar.booleanfalse