Hero

Food. Nutrition. Hospitality.

Hero

Use the hero on your home page or a landing page to make a great first impression and capture attention immediately. This should include a short piece of text that is often your site or page’s most important content. Use the buttons to drive traffic supporting the text and image to your desired pages within the website.

Documentation: Toolkit Wiki on GitHub

Options:

  • Title
  • Buttons
  • Backgrounds:
    • Illini Blue background with orange buttons
    • Illini Orange background with blue buttons
    • Image background with orange buttons
    • Image background with blue buttons
  • Width:
    • Full screen width
    • Fixed margin width
  • Text and button position combinations:
    • Top left
    • Top right
    • Top center
    • Center left
    • Center right
    • Center center
    • Bottom left
    • Bottom right
    • Bottom center

Example above: Title, background image, center content horizontal alignment, center content vertical alignment, two link buttons