Paginations

<ul class="pagination">
  <li class="page-item">
    <a class="page-link" href="#" tabindex="-1" aria-disabled="true">
      <i class="material-icons ">keyboard_arrow_left</i>
    </a>
  </li>
  <li class="page-item"><a class="page-link" href="#">1</a></li>
  <li class="page-item active" aria-current="page">
    <a class="page-link" href="#">2 <span class="sr-only">(current)</span></a>
  </li>
  <li class="page-item"><a class="page-link" href="#">3</a></li>
  <li class="page-item">
    <a class="page-link" href="#">
      <i class="material-icons">keyboard_arrow_right</i>
    </a>
  </li>
</ul>

Sizes

<!-- small-->
<ul class="pagination">
  <li class="page-item">
    <a class="page-link" href="#" tabindex="-1" aria-disabled="true">
      <i class="material-icons ">keyboard_arrow_left</i>
    </a>
  </li>
  <li class="page-item"><a class="page-link" href="#">1</a></li>
  <li class="page-item active" aria-current="page">
    <a class="page-link" href="#">2 <span class="sr-only">(current)</span></a>
  </li>
  <li class="page-item"><a class="page-link" href="#">3</a></li>
  <li class="page-item">
    <a class="page-link" href="#">
      <i class="material-icons">keyboard_arrow_right</i>
    </a>
  </li>
</ul>


<!-- Large -->
<nav aria-label="navigation" class="mb-xl">
  <ul class="pagination pagination-lg">
    <li class="page-item">
      <a class="page-link" href="#" tabindex="-1" aria-disabled="true">
        <i class="material-icons">keyboard_arrow_left</i>
      </a>
    </li>
    <li class="page-item"><a class="page-link" href="#">1</a></li>
    <li class="page-item active" aria-current="page">
      <a class="page-link" href="#">2 <span class="sr-only">(current)</span></a>
    </li>
    <li class="page-item"><a class="page-link" href="#">3</a></li>
    <li class="page-item">
      <a class="page-link" href="#">
        <i class="material-icons">keyboard_arrow_right</i>
      </a>
    </li>
  </ul>
</nav>