<div class="paginating-container pagination-default">

    <ul class="pagination">
        <li class="prev"><a href="javascript:void(0);">Prev</a></li>
        <li><a href="javascript:void(0);">1</a></li>
        <li class="active"><a href="javascript:void(0);">2</a></li>
        <li><a href="javascript:void(0);">3</a></li>
        <li class="next"><a href="javascript:void(0);">Next</a></li>
    </ul>

</div>

<div class="paginating-container pagination-solid">

    <ul class="pagination">
        <li class="prev"><a href="javascript:void(0);">Prev</a></li>
        <li><a href="javascript:void(0);">1</a></li>
        <li class="active"><a href="javascript:void(0);">2</a></li>
        <li><a href="javascript:void(0);">3</a></li>
        <li class="next"><a href="javascript:void(0);">Next</a></li>
    </ul>

</div>

<div class="paginating-container pagination-solid">

    <ul class="pagination">
        <li  class="prev"><a href="javascript:void(0);"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-left"><polyline points="15 18 9 12 15 6"></polyline></svg></a></li>
        <li><a href="javascript:void(0);">1</a></li>
        <li class="active"><a href="javascript:void(0);">2</a></li>
        <li><a href="javascript:void(0);">3</a></li>
        <li class="next"><a href="javascript:void(0);"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-right"><polyline points="9 18 15 12 9 6"></polyline></svg></a></li>
    </ul>

</div>

<div class="pagination-no_spacing">

    <ul class="pagination">
        <li><a href="javascript:void(0);" class="prev"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-left"><polyline points="15 18 9 12 15 6"></polyline></svg></a></li>
        <li><a href="javascript:void(0);">1</a></li>
        <li><a href="javascript:void(0);" class="active">2</a></li>
        <li><a href="javascript:void(0);">3</a></li>
        <li><a href="javascript:void(0);" class="next"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-right"><polyline points="9 18 15 12 9 6"></polyline></svg></a></li>
    </ul>

</div>

<div class="pagination-custom_solid">
                                        
    <a href="javascript:void(0);" class="prev"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-left"><polyline points="15 18 9 12 15 6"></polyline></svg></a>

    <ul class="pagination">
        <li><a href="javascript:void(0);">1</a></li>
        <li><a href="javascript:void(0);" class="active">2</a></li>
        <li><a href="javascript:void(0);">3</a></li>
    </ul>

    <a href="javascript:void(0);" class="next"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-right"><polyline points="9 18 15 12 9 6"></polyline></svg></a>

</div>

<div class="pagination-custom_outline">

    <a href="javascript:void(0);" class="prev"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-left"><polyline points="15 18 9 12 15 6"></polyline></svg></a>

    <ul class="pagination">
        <li><a href="javascript:void(0);">1</a></li>
        <li class="active"><a href="javascript:void(0);">2</a></li>
        <li><a href="javascript:void(0);">3</a></li>
    </ul>

    <a href="javascript:void(0);" class="next"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-right"><polyline points="9 18 15 12 9 6"></polyline></svg></a>

</div>