<h3>Flat Circle</h3>
<nav aria-label="Page navigation">
    <ul class="pagination pagination-plain">
        <li class="page-item">
            <a class="page-link" href="javascript:void(0)" aria-label="Previous">
                <span aria-hidden="true">&laquo;</span>
            </a>
        </li>
        <li class="page-item active"><a class="page-link" href="javascript:void(0)">1</a></li>
        <li class="page-item"><a class="page-link" href="javascript:void(0)">2</a></li>
        <li class="page-item"><a class="page-link" href="javascript:void(0)">3</a></li>
        <li class="page-item disabled"><a class="page-link" href="javascript:void(0)">4</a></li>
        <li class="page-item"><a class="page-link" href="javascript:void(0)">5</a></li>
        <li class="page-item">
            <a class="page-link" href="javascript:void(0)" aria-label="Next">
                <span aria-hidden="true">&raquo;</span>
            </a>
        </li>
    </ul>
</nav>

<h3>Shaded Circle</h3>
<nav aria-label="Page navigation">
    <ul class="pagination">
        ...
    </ul>
</nav>

<h3>Flat Rounded</h3>
<nav aria-label="Page navigation">
    <ul class="pagination pagination-round pagination-plain">
        ...
    </ul>
</nav>

<h3>Shaded Rounded</h3>
<nav aria-label="Page navigation">
    <ul class="pagination pagination-round">
        ...
    </ul>
</nav>

<h3>Flat Square</h3>
<nav aria-label="Page navigation">
    <ul class="pagination pagination-square pagination-plain">
        ...
    </ul>
</nav>

<h3>Shaded Square</h3>
<nav aria-label="Page navigation">
    <ul class="pagination pagination-square">
        ...
    </ul>
</nav>

<nav aria-label="Page navigation">
    <ul class="pagination pagination-success">
        ...
    </ul>
</nav>