Skip to main content
Design System

Quick Links

The quick links component is a stylized stack of highlighted links with interactive icons. They are used within the content of a page to help the user quickly scan and jump to a popular topic, external site, or document. This component is primarily used on the homepage of a website and supplements the site navigation.

  • Quick Links


    <ul class="c-quick-links">
      <li><a href="#"> Quick Link </a></li>
      <li><a href="#"> Quick Link </a></li>
      <li><a href="#"> Quick Link </a></li>
      <li><a href="#"> Quick Link </a></li>
      <li><a href="#"> Quick Link </a></li>
      <li><a href="#"> Quick Link </a></li>
    </ul>

  • Quick Links


    <ul class="c-quick-links c-quick-links--light">
      <li><a href="#"> Quick Link </a></li>
      <li><a href="#"> Quick Link </a></li>
      <li><a href="#"> Quick Link </a></li>
      <li><a href="#"> Quick Link </a></li>
      <li><a href="#"> Quick Link </a></li>
      <li><a href="#"> Quick Link </a></li>
    </ul>