Icon Scroll

Icon scroll icons that prompt a user to scroll further down the page. Combine with positioning classes to affix to the buttom of your viewport. Give them a link <a href="#jump-here"></a> that points further down the page to an element with an ID <class id="jump-here"></class>. Or, incorporate javascript for animated scrolling such as https://labelle.github.io/evolution-patterns/patterns-library/interactions.html.


Scroll down
<div class="icon-scroll-chevron-container">
  <div class="icon-scroll-chevron"></div>
  <div class="icon-scroll-chevron"></div>
  <div class="icon-scroll-chevron"></div>
  <span class="icon-scroll-chevron-text">Scroll down</span>

This creates an animated chevron icon that prompts a user to scroll down the page.


<div class="icon-scroll-mousey-container">
  <div class="icon-scroll-mousey-scroll-downs">
  <div class="icon-scroll-mousey">
  <div class="icon-scroll-mousey-scroller"></div>

This creates an animated mouse icon that prompts a user to scroll down the page.