Form with Custom Button Styles

<!DOCTYPE html>
<title>My Example</title>

<div class="button-form-container">
    
    <form action="#" method="post">

<div class="form-group">
            <h3>Standard Actions</h3>
            <div class="buttons">
                
                <button type="submit" class="btn btn-primary">Save Changes</button> 
                
                <button type="reset" class="btn btn-secondary">Cancel</button>
            </div>
        </div>

<div class="form-group">
            <h3>Alternative & Destructive Actions</h3>
            <div class="buttons">
                 <button type="button" class="btn btn-outline">Export Data</button>
                 <button type="button" class="btn btn-danger">Delete Account</button>
            </div>
        </div>

<div class="form-group">
            <h3>Buttons with Icons</h3>
            <div class="buttons">
                <button type="button" class="btn btn-primary">
                    <svg class="icon" viewBox="0 0 24 24" fill="currentColor"><path d="M5 20h14v-2H5v2zM19 9h-4V3H9v6H5l7 7 7-7z"></path></svg>
                    Download
                </button>
                 <button type="button" class="btn btn-danger">
                    <svg class="icon" viewBox="0 0 24 24" fill="currentColor"><path d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z"></path></svg>
                    Delete
                </button>
            </div>
        </div>
        
         <div class="form-group">
            <h3>Disabled State</h3>
            <div class="buttons">
                 <button type="submit" class="btn btn-primary" disabled>Submit (Disabled)</button>
            </div>
        </div>
        
         <div class="form-group">
            <h3>Full-Width Block Button</h3>
            <div class="buttons">
                 <button type="submit" class="btn btn-primary btn-block">Register Full Account</button>
            </div>
        </div>
        
    </form>
</div>