Buttons

Buttons Style 1

                        
                            
<section class="element-page buttons dt-section">
    <div class="container">
        <div class="buttons-block elements-block">
            <div class="buttons1">
                <div class="row gy-5">
                    <div class="col-md-4 col-sm-6">
                        <div class="button-block">
                            <a title="Button-small" href="#" class="btn btn-primary btn-sm btn-custom1">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                            <a title="Button-medium" href="#" class="btn btn-primary btn-md btn-custom1">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                            <a title="Button-large" href="#" class="btn btn-primary btn-lg btn-custom1">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                        </div>
                    </div>
                    <div class="col-md-4 col-sm-6">
                        <div class="button-block">
                            <a title="Button-small" href="#" class="btn btn-secondary btn-sm btn-custom1">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>  
                            </a>
                            <a title="Button-medium" href="#" class="btn btn-secondary btn-md btn-custom1">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                            <a title="Button-large" href="#" class="btn btn-secondary btn-lg btn-custom1">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                        </div>
                    </div>
                    <div class="col-md-4 col-sm-6">
                        <div class="button-block">
                            <a title="Button-small" href="#" class="btn btn-dark btn-sm btn-custom1">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                            <a title="Button-medium" href="#" class="btn btn-dark btn-md btn-custom1">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                            <a title="Button-large" href="#" class="btn btn-dark btn-lg btn-custom1">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section> 

                        
                    
                    

Buttons Style 2

                        
                            
<section class="element-page buttons dt-section">
    <div class="container">
        <div class="buttons-block elements-block">
            <div class="buttons2">
                <div class="row gy-5">
                    <div class="col-md-4 col-sm-6">
                        <div class="button-block">
                            <a title="Button-small" href="#" class="btn btn-primary btn-sm btn-custom2">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                            <a title="Button-medium" href="#" class="btn btn-primary btn-md btn-custom2">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                            <a title="Button-large" href="#" class="btn btn-primary btn-lg btn-custom2">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                        </div>
                    </div>
                    <div class="col-md-4 col-sm-6">
                        <div class="button-block">
                            <a title="Button-small" href="#" class="btn btn-secondary btn-sm btn-custom2">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                            <a title="Button-medium" href="#" class="btn btn-secondary btn-md btn-custom2">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                            <a title="Button-large" href="#" class="btn btn-secondary btn-lg btn-custom2">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                        </div>
                    </div>
                    <div class="col-md-4 col-sm-6">
                        <div class="button-block">
                            <a title="Button-small" href="#" class="btn btn-dark btn-sm btn-custom2">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                            <a title="Button-medium" href="#" class="btn btn-dark btn-md btn-custom2">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                            <a title="Button-large" href="#" class="btn btn-dark btn-lg btn-custom2">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

                        
                    
                    

Buttons Style 3

                        
                            
<section class="element-page buttons dt-section">
    <div class="container">
        <div class="buttons-block elements-block">
            <div class="buttons3">
                <div class="row gy-5">
                    <div class="col-md-4 col-sm-6">
                        <div class="button-block">
                            <a title="Button-small" href="#" class="btn btn-primary btn-sm btn-custom3 ">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                            <a title="Button-medium" href="#" class="btn btn-primary btn-md btn-custom3 ">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg> 
                            </a>
                            <a title="Button-large" href="#" class="btn btn-primary btn-lg btn-custom3 ">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                        </div>
                    </div>
                    <div class="col-md-4 col-sm-6">
                        <div class="button-block">
                            <a title="Button-small" href="#" class="btn btn-secondary btn-sm btn-custom3">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                            <a title="Button-medium" href="#" class="btn btn-secondary btn-md btn-custom3">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                            <a title="Button-large" href="#" class="btn btn-secondary btn-lg btn-custom3">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                        </div>
                    </div>
                    <div class="col-md-4 col-sm-6">
                        <div class="button-block">
                            <a title="Button-small" href="#" class="btn btn-dark btn-sm  btn-custom3">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                            <a title="Button-medium" href="#" class="btn btn-dark btn-md  btn-custom3">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                            <a title="Button-large" href="#" class="btn btn-dark btn-lg  btn-custom3">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section> 

                        
                    
                    

Buttons Style 4

                        
                            
<section class="element-page buttons dt-section">
    <div class="container">
        <div class="buttons-block elements-block">
            <div class="buttons4">
                <div class="row gy-5">
                    <div class="col-md-4 col-sm-6">
                        <div class="button-block1">
                            <a title="Button-small" href="#" class="btn btn-primary btn-sm btn-custom4">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                            <a title="Button-medium" href="#" class="btn btn-primary btn-md btn-custom4">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                            <a title="Button-large" href="#" class="btn btn-primary btn-lg btn-custom4">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                        </div>
                    </div>
                    <div class="col-md-4 col-sm-6">
                        <div class="button-block1">
                            <a title="Button-small" href="#" class="btn btn-secondary btn-sm btn-custom4">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                            <a title="Button-medium" href="#" class="btn btn-secondary btn-md btn-custom4">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                            <a title="Button-large" href="#" class="btn btn-secondary btn-lg btn-custom4">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                        </div>
                    </div>
                    <div class="col-md-4 col-sm-6">
                        <div class="button-block1">
                            <a title="Button-small" href="#" class="btn btn-dark btn-sm btn-custom4">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                            <a title="Button-medium" href="#" class="btn btn-dark btn-md btn-custom4">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg>
                            </a>
                            <a title="Button-large" href="#" class="btn btn-dark btn-lg btn-custom4">Button 
                                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                    <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                </svg> 
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

                        
                    
                    

Buttons Style 5

                        
                            
<section class="element-page buttons dt-section">
    <div class="container">
        <div class="buttons-block elements-block">
            <div class="buttons5">
                <div class="row gy-5">
                    <div class="col-md-4 col-sm-6">
                        <div class="button-block2">
                            <a class="read primary btn-sm btn-custom5" title="Blog Details" href="#">Read More
                                <span class="svg-wrapper">
                                    <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                        <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                    </svg>
                                </span>
                            </a>
                            <a class="read primary btn-md btn-custom5" title="Blog Details" href="#">Read More
                                <span class="svg-wrapper">
                                    <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                        <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                    </svg>
                                </span>
                            </a>
                            <a class="read primary btn-lg btn-custom5" title="Blog Details" href="#">Read More
                                <span class="svg-wrapper">
                                    <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                        <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                    </svg>
                                </span>
                            </a>
                        </div>
                    </div>
                    <div class="col-md-4 col-sm-6">
                        <div class="button-block2">
                            <a class="read secondary btn-sm btn-custom5" title="Blog Details" href="#">Read More
                                <span class="svg-wrapper">
                                    <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                        <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                    </svg>
                                </span>
                            </a>
                            <a class="read secondary btn-md btn-custom5" title="Blog Details" href="#">Read More
                                <span class="svg-wrapper">
                                    <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                        <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                    </svg>
                                </span>
                            </a>
                            <a class="read secondary btn-lg btn-custom5" title="Blog Details" href="#">Read More
                                <span class="svg-wrapper">
                                    <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                        <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                    </svg>
                                </span>
                            </a>
                        </div>
                    </div>
                    <div class="col-md-4 col-sm-6">
                        <div class="button-block2">
                            <a class="read dark btn-sm btn-custom5" title="Blog Details" href="#">Read More
                                <span class="svg-wrapper">
                                    <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                        <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                    </svg>
                                </span>
                            </a>
                            <a class="read dark btn-md btn-custom5" title="Blog Details" href="#">Read More
                                <span class="svg-wrapper">
                                    <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                        <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                    </svg>
                                </span>
                            </a>
                            <a class="read dark btn-lg btn-custom5" title="Blog Details" href="#">Read More
                                <span class="svg-wrapper">
                                    <svg xmlns="http://www.w3.org/2000/svg" width="150" height="38" viewBox="0 0 150 38">
                                        <path data-name="Path 39868" d="M243.918,220.16v14.907H120.25v6.3H243.918v16.8l26.332-19.524Z" transform="translate(-120.25 -220.16)" fill="#ed485b" fill-rule="evenodd"/>
                                    </svg>
                                </span>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>