Want to be a hero

Jumbotron

A flexible component for showcasing hero unit style content. We use the jumbotron function on the homepage and project pages to highlight a particular message.

Accessibility

To ensure accessibility at all times use a high contrast color for the body text

Usage

We use the jumbotron component is used on most pages of a site. Particularly on the homepage and project pages to highlight a particular message.

Example

Friend's Roman Country men

Hi, Hello Namaste!

This is a simple hero unit, a simple jumbotron-style component for calling extra attention to featured content or information.

It uses utility classes for typography and spacing to space content out within the larger container.

Code


<div class="jumbotron">
 <h3 class="values">Friend's Roman Country men</h3>
 <h1 class="dsystem jumbotron-heading">Hi, Hello Namaste!</h1>
 <p class="values">
    This is a simple hero unit, a simple jumbotron-style component
     for calling extra attention to featured content or
     information.
 </p>
 <hr class="my-4" />
 <p class="values">
      It uses utility classes for typography and spacing to space
      content out within the larger container.
 </p>
</div>