Pagination

You can create a pagination element adding the .pagination class to a list and the .page-item class to each element from the list.

<ul class="pagination">
  <li class="page-item disabled">
    <a class="page-link" href="#a"><i class="fas fa-long-arrow-alt-left"></i></a>
  </li>
  <li class="page-item active">
    <a class="page-link" href="#a">1</a>
  </li>
  <li class="page-item">
    <a class="page-link" href="#a">2</a>
  </li>
  <li class="page-item">
    <a class="page-link" href="#a">3</a>
  </li>
  <li class="page-item">
    <a class="page-link" href="#a"><i class="fas fa-long-arrow-alt-right"></i></a>
  </li>
</ul>

Sizes

You can create a smaller pagination with the class .pagination-sm or a larger one with the class .pagination-lg.

<ul class="pagination pagination-lg">
  <li class="page-item disabled">
    <a class="page-link" href="#a"><i class="fas fa-long-arrow-alt-left"></i></a>
  </li>
  <li class="page-item active">
    <a class="page-link" href="#a">1</a>
  </li>
  <li class="page-item">
    <a class="page-link" href="#a">2</a>
  </li>
  <li class="page-item">
    <a class="page-link" href="#a">3</a>
  </li>
  <li class="page-item">
    <a class="page-link" href="#a"><i class="fas fa-long-arrow-alt-right"></i></a>
  </li>
</ul>

<ul class="pagination pagination-sm">
  <li class="page-item disabled">
    <a class="page-link" href="#a"><i class="fas fa-long-arrow-alt-left"></i></a>
  </li>
  <li class="page-item active">
    <a class="page-link" href="#a">1</a>
  </li>
  <li class="page-item">
    <a class="page-link" href="#a">2</a>
  </li>
  <li class="page-item">
    <a class="page-link" href="#a">3</a>
  </li>
  <li class="page-item">
    <a class="page-link" href="#a"><i class="fas fa-long-arrow-alt-right"></i></a>
  </li>
</ul>

To find out more about using pagination and all available options, check out the official Bootstrap 4 documentation.