HomeStarbucks Pattern Library



A subnav element intended to be used in tandem with GlobalNav. It does not follow the crate system, but takes up the full width of the browser at all times. GlobalSubnav has support for themes and for styling over the default background colors and borders.


  • ariaLabelstring*

    aria-label applied to root

  • items
    arrayOf [
    shape {

    Flag to apply when a user is on the page matching this nav item. Adds an underline and adjusted text styles to active items.


    Content for each list item, can be a string or a component.


    HTML element or React component to use for this item. Defaults to a.


    An array of nav item props objects. Passes any unrecognized props along to the rendered links, allowing you to include event handlers, DOM attributes, children, and more.

  • classNamestring

    ClassName will overwrite the container's background and border styling.

Example: GlobalSubnav

Example: GlobalSubnav dark theme

Example: Global Nav and Subnav