Picchu

Show more

Guidance

Show more is a control that enables users to expose additional content in context below existing content, if/when desired.

Depending on the amount of additional content, the control can be set to expose the remainder (such as a passage of text that a user has begun reading) or to incrementally expose more (such as additional relevant products, items, or results) so as not to overwhelm the user with too many at once and/or overtax network performance.

Once the remaining content is exposed, the control disappears. If the content is set to load incrementally, the "Show more" control should remain at the bottom of the new content until there is no more to expose. If you have scenarios that require a show/hide function, you should instead consider the accordion component.

Terminology: Show more +

Icon: E948 CalculatorAddition

Design variations

Design variations for this control depend on the level of emphasis warranted in your scenario. Choose from the following.

Subtle

Text link with icon

Intermediate

Outline button style

Strong

Brand color button style

Demo

See the Pen Show More Demo by Microsoft.com (@microsoft) on CodePen.

Resources