Title bar component

Description Pages used Reference image
Title bar Product Title bar
Title bar - Dresses Category Title bar - dresses

Visual specifications

For long titles, the content wraps and becomes two lines. If the title is longer than two lines, the content is clipped and appended with an ellipsis.

The price is vertically centered in the bar.

Page states

  • Refresh - loads a cached version


  • Scroll up - Component disappears from the top on scroll and appended to the “Add to cart” bar.
  • Scroll down - Not visible until the user scrolls to the top of the page.
  • Page refresh - TBD