Footer

Use to hold page closing information.

Description

Depending on the type of the page, you can chose one of the following component variants:

  • standard footer, with mini sitemap, social links and legal section
  • footer with no legal section
  • minimal footer with no mini sitemap, social links or legal section

    See the examples below for usage.

Activate Sass component

In order to have the styling of this component available, you need to include it in your project. After including the Radius library in your main ./index.scss file, add this snippet:

@include radius-component-footer;

Link to Abstract/Sketch file

Download Sketch / Abstract file

Usage

Usage example

Standard footer

<footer class="footer">
  <section class="footer__inner">
    <div class="footer__row-1">
      <nav class="footer__nav-lists footer__links">
        <div>
          <h3 class="footer__list-heading">Funding Circle</h3>
          <ul class="footer__list">
            <li><a href="">Borrow</a></li>
            <li><a href="">Invest</a></li>
            <li><a href="">How it works</a></li>
            <li><a href="">Statistics</a></li>
          </ul>
        </div>
        <div>
          <h3 class="footer__list-heading">Discover more</h3>
          <ul class="footer__list">
            <li><a href="https://www.fundingcircle.com/global/capitalmarkets/">Institutional investors</a></li>
            <li><a href="https://www.fundingcircle.com/uk/introducers/">Introducers</a></li>
            <li><a href="https://www.fundingcircle.com/blog/">Blog</a></li>
            <li><a href="https://careers.fundingcircle.com">Careers</a></li>
            <li><a href="https://corporate.fundingcircle.com/diversity-and-inclusion">Diversity &amp; Inclusion</a></li>
          </ul>
        </div>
        <div>
          <h3 class="footer__list-heading">Support</h3>
          <ul class="footer__list">
            <li><a href="https://support.fundingcircle.com/hc/en-us">Help</a></li>
            <li><a href="https://support.fundingcircle.com/hc/en-us/requests/new">Contact us</a></li>
            <li><a href="https://static.fundingcircle.com/files/uk/information-packs/investor-information-814a206f.pdf" download="Funding Circle - Investor Guide">Investor guide</a></li>
          </ul>
        </div>
      </nav>
      <div class="footer__copy-legal">
        Funding Circle Limited is authorised and regulated by the Financial Conduct Authority under firm registration number 722513. Funding Circle is not covered by the Financial Services Compensation Scheme. Registered in England (Co. No. 06968588) with registered office at 71 Queen Victoria Street, London, EC4V 4AY.
      </div>
    </div>
    <div class="footer__row-2">
      <div>
        <ul class="footer__list footer__list--inline footer__links">
          <li><a href="/uk/legal/">Legal</a></li>
          <li><a href="/home/security">Security</a></li>
          <li><a href="https://static.fundingcircle.com/files/uk/information-packs/modern-slavery-act-statement.pdf" download="Modern Slavery Statement">Modern Slavery Statement</a></li>
        </ul>
        <p class="footer__copyright">Copyright &copy; Funding Circle 2019. All rights reserved.</p>
      </div>
      <div class="footer__social-links">
        <ul class="footer__list footer__list--social">
          <li>
            <a href="#">
              <svg width="35" height="34" viewBox="0 0 35 34" xmlns="http://www.w3.org/2000/svg"><title>Facebook</title><g transform="translate(1 1)" fill="none" fill-rule="evenodd"><path d="M17.058 24.38v-7.928h2.66l.4-3.09h-3.06V11.39c0-.895.25-1.504 1.53-1.504h1.638V7.12C19.942 7.084 18.97 7 17.842 7c-2.36 0-3.974 1.44-3.974 4.084v2.28H11.2v3.088h2.668v7.928h3.19z" fill="#9396A7"/><circle stroke="#9396A7" stroke-width="2" cx="16.2" cy="16" r="16"/></g></svg>
            </a>
          </li>
          <li>
            <a href="#">
              <svg width="34" height="34" viewBox="0 0 34 34" xmlns="http://www.w3.org/2000/svg"><title>YouTube</title><g transform="translate(1 1)" fill="none" fill-rule="evenodd"><path d="M10.327 10h10.88c1.838 0 3.328 1.48 3.328 3.308v5.658c0 1.827-1.49 3.308-3.328 3.308h-10.88C8.49 22.274 7 20.794 7 18.966v-5.658C7 11.48 8.49 10 10.327 10zm8.8 6.137l-5.69-3.308v6.616l5.69-3.31z" fill="#9396A7"/><circle stroke="#9396A7" stroke-width="2" cx="16" cy="16" r="16"/></g></svg>
            </a>
          </li>
          <li>
            <a href="#">
              <svg width="35" height="34" viewBox="0 0 35 34" xmlns="http://www.w3.org/2000/svg"><title>Twitter</title><g transform="translate(1 1)" fill="none" fill-rule="evenodd"><path d="M24.242 9.34c-.66.4-1.386.69-2.164.845-.62-.678-1.505-1.102-2.486-1.102-1.88 0-3.404 1.564-3.404 3.492 0 .274.03.54.088.796-2.83-.145-5.34-1.534-7.02-3.65-.294.518-.462 1.12-.462 1.758 0 1.21.6 2.28 1.516 2.907-.558-.017-1.084-.176-1.544-.436v.042c0 1.693 1.174 3.105 2.733 3.424-.286.082-.587.124-.898.124-.22 0-.434-.022-.64-.063.432 1.387 1.69 2.397 3.18 2.424-1.165.938-2.635 1.497-4.23 1.497-.274 0-.546-.016-.812-.048 1.507.988 3.298 1.567 5.22 1.567 6.266 0 9.69-5.32 9.69-9.936 0-.15-.002-.303-.008-.452.665-.492 1.243-1.107 1.698-1.807-.61.278-1.267.466-1.956.55.704-.43 1.244-1.115 1.498-1.93" fill="#9396A7"/><circle stroke="#9396A7" stroke-width="2" cx="16.2" cy="16" r="16"/></g></svg>
            </a>
          </li>
          <li>
            <a href="#">
              <svg width="34" height="34" viewBox="0 0 34 34" xmlns="http://www.w3.org/2000/svg"><title>LinkedIn</title><g transform="translate(1 1)" fill="none" fill-rule="evenodd"><path d="M8.843 13.048h3.04v9.634h-3.04v-9.634zm11.348-.093c2.162 0 3.86 1.386 3.86 4.37v5.357h-3.448v-4.986c0-1.305-.54-2.195-1.725-2.195-.907 0-1.412.602-1.646 1.18-.087.21-.074.5-.074.788v5.214H13.74s.045-8.83 0-9.634h3.416v1.512c.202-.662 1.293-1.605 3.035-1.605zM10.308 8.5c1.122 0 1.812.72 1.834 1.67 0 .934-.71 1.673-1.854 1.673h-.022c-1.1 0-1.814-.737-1.814-1.67 0-.952.735-1.673 1.857-1.673z" fill="#9396A7"/><circle stroke="#9396A7" stroke-width="2" cx="16" cy="16" r="16"/></g></svg>
            </a>
          </li>
        </ul>
      </div>
    </div>
  </section>
</footer>

Footer with no legal bit

<footer class="footer">
  <section class="u-page-grid">
    <div class="footer__row-1">
      <nav class="footer__nav-lists footer__links">
        <div>
          <h3 class="footer__list-heading">Finanzierung</h3>
          <ul class="footer__list">
            <li><a href="/de/firmenkredit-rate-ermitteln">Für Unternehmen</a></li>
            <li><a href="/de/in-unternehmen-investieren">Für Anleger</a></li>
            <li><a href="/de/partner-programm">Partnerprogramm</a></li>
            <li><a href="/de/forderungsmanagment">Forderungsmanagement</a></li>
            <li><a href="/de/finanzlexikon">Finanzlexikon</a></li>
          </ul>
        </div>
        <div>
          <h3 class="footer__list-heading">Funding Circle</h3>
          <ul class="footer__list">
            <li><a href="/de/ueber-uns">Über uns</a></li>
            <li><a href="/de/so-funktioniert-es">So funktioniert's</a></li>
            <li><a href="/de/blog">Blog</a></li>
            <li><a href="/de/funding-circle-erfahrungen">Erfahrungen</a></li>
            <li><a href="/de/statistiken">Statistiken</a></li>
            <li><a href="/de/presse">Presse</a></li>
            <li><a href="/de/careers">Jobs</a></li>
            <li><a href="http://corporate.fundingcircle.com">Informationen für Aktionäre</a></li>
          </ul>
        </div>
        <div>
          <h3 class="footer__list-heading">Hilfe</h3>
          <ul class="footer__list">
            <li><a href="/de/unternehmen-faq">Für Unternehmen</a></li>
            <li><a href="/de/investoren-hilfe">Für Anleger</a></li>
            <li><a href="/de/ident">Für Vertrag identifizieren</a></li>
            <li><a href="/de/kontakt">Kontakt</a></li>
          </ul>
        </div>
      </nav>
    </div>
    <div class="footer__row-2">
      <div>
        <ul class="footer__list footer__list--inline footer__links">
          <li><a href="/de/datenschutzerklaerung">Datenschutzerklärung</a></li>
          <li><a href="/de/impressum">Impressum</a></li>
          <li><a href="/de/inhaltsuebersicht">Inhaltsübersicht</a></li>
          <li>AGB: <a href="/de/nutzungsbedingungen-kreditnehmer-neu">Unternehmer</a> | <a href="/de/geschaeftsbedingungen-privatanleger-neu">Anleger</a></li>
        </ul>
        <p class="footer__copyright">&copy; 2019 Funding Circle. Alle Rechte vorbehalten.</p>
      </div>
      <div class="footer__social-links">
        <ul class="footer__list footer__list--social">
          <li>
            <a href="https://www.facebook.com/FundingcircleDE" target="_blank">
              <svg width="35" height="34" viewBox="0 0 35 34" xmlns="http://www.w3.org/2000/svg"><title>Facebook</title><g transform="translate(1 1)" fill="none" fill-rule="evenodd"><path d="M17.058 24.38v-7.928h2.66l.4-3.09h-3.06V11.39c0-.895.25-1.504 1.53-1.504h1.638V7.12C19.942 7.084 18.97 7 17.842 7c-2.36 0-3.974 1.44-3.974 4.084v2.28H11.2v3.088h2.668v7.928h3.19z" fill="#9396A7"></path><circle stroke="#9396A7" stroke-width="2" cx="16.2" cy="16" r="16"></circle></g></svg>
            </a>
          </li>
          <li>
            <a href="https://twitter.com/FundingcircleDE" target="_blank">
              <svg width="35" height="34" viewBox="0 0 35 34" xmlns="http://www.w3.org/2000/svg"><title>Twitter</title><g transform="translate(1 1)" fill="none" fill-rule="evenodd"><path d="M24.242 9.34c-.66.4-1.386.69-2.164.845-.62-.678-1.505-1.102-2.486-1.102-1.88 0-3.404 1.564-3.404 3.492 0 .274.03.54.088.796-2.83-.145-5.34-1.534-7.02-3.65-.294.518-.462 1.12-.462 1.758 0 1.21.6 2.28 1.516 2.907-.558-.017-1.084-.176-1.544-.436v.042c0 1.693 1.174 3.105 2.733 3.424-.286.082-.587.124-.898.124-.22 0-.434-.022-.64-.063.432 1.387 1.69 2.397 3.18 2.424-1.165.938-2.635 1.497-4.23 1.497-.274 0-.546-.016-.812-.048 1.507.988 3.298 1.567 5.22 1.567 6.266 0 9.69-5.32 9.69-9.936 0-.15-.002-.303-.008-.452.665-.492 1.243-1.107 1.698-1.807-.61.278-1.267.466-1.956.55.704-.43 1.244-1.115 1.498-1.93" fill="#9396A7"></path><circle stroke="#9396A7" stroke-width="2" cx="16.2" cy="16" r="16"></circle></g></svg>
            </a>
          </li>
          <li>
            <a href="https://www.linkedin.com/company/funding-circle-deutschland-gmbh" target="_blank">
              <svg width="34" height="34" viewBox="0 0 34 34" xmlns="http://www.w3.org/2000/svg"><title>LinkedIn</title><g transform="translate(1 1)" fill="none" fill-rule="evenodd"><path d="M8.843 13.048h3.04v9.634h-3.04v-9.634zm11.348-.093c2.162 0 3.86 1.386 3.86 4.37v5.357h-3.448v-4.986c0-1.305-.54-2.195-1.725-2.195-.907 0-1.412.602-1.646 1.18-.087.21-.074.5-.074.788v5.214H13.74s.045-8.83 0-9.634h3.416v1.512c.202-.662 1.293-1.605 3.035-1.605zM10.308 8.5c1.122 0 1.812.72 1.834 1.67 0 .934-.71 1.673-1.854 1.673h-.022c-1.1 0-1.814-.737-1.814-1.67 0-.952.735-1.673 1.857-1.673z" fill="#9396A7"></path><circle stroke="#9396A7" stroke-width="2" cx="16" cy="16" r="16"></circle></g></svg>
            </a>
          </li>
          <li>
            <a href="https://www.youtube.com/channel/UCRk6AKHQghQMEIh8nqHvWbw" target="_blank">
              <svg width="34" height="34" viewBox="0 0 34 34" xmlns="http://www.w3.org/2000/svg"><title>YouTube</title><g transform="translate(1 1)" fill="none" fill-rule="evenodd"><path d="M10.327 10h10.88c1.838 0 3.328 1.48 3.328 3.308v5.658c0 1.827-1.49 3.308-3.328 3.308h-10.88C8.49 22.274 7 20.794 7 18.966v-5.658C7 11.48 8.49 10 10.327 10zm8.8 6.137l-5.69-3.308v6.616l5.69-3.31z" fill="#9396A7"></path><circle stroke="#9396A7" stroke-width="2" cx="16" cy="16" r="16"></circle></g></svg>
            </a>
          </li>
        </ul>
      </div>
    </div>
  </section>
</footer>

Minimal footer for maximum conversion

<footer class="footer">
  <section class="footer__inner">
    <div class="footer__row-1">
      <div class="footer__copy-legal">
        Funding Circle Limited is authorised and regulated by the Financial Conduct Authority under firm registration number 722513. Funding Circle is not covered by the Financial Services Compensation Scheme. Registered in England (Co. No. 06968588) with registered office at 71 Queen Victoria Street, London, EC4V 4AY.
      </div>
    </div>
    <div class="footer__row-2">
      <div>
        <ul class="footer__list footer__list--inline footer__links">
          <li><a href="">Terms of use</a></li>
          <li><a href="">Intermediaries </a></li>
          <li>AGB: <a href="">Unternehmer</a> | <a href="">Anleger</a></li>
        </ul>
        <p class="footer__copyright">Copyright &copy; Funding Circle 2015. All rights reserved.</p>
      </div>
    </div>
  </section>
</footer>