The feature (sometimes called "hero") component is the prominent element of a web page due to its placement at the top of the page, and typically larger size relative to the subsequent page content. Its purpose is to present an overview of the site's most important content. Consisting of image and text, the feature may also appear in a carousel component in cases where there are multiple features that need to occupy the placement. Other options may include subtle, silent looping background video, which may optionally include a play function to watch a corresponding video.

More coming soon.


See the Pen Hero demo 1 by Microsoft.com (@microsoft) on CodePen.