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:

• Design mockup (Adobe XD link) – the most up-to-date and accurate version is in the toolkit
• Hero Image on help.toolkit.illinois.edu
• Component builder – see it in action and try out content
• Drupal Hero documentation

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, middle, bottom
  • left, center, right