Solid Buttons
<div class="flex flex-wrap gap-4 xxl:gap-6">
<button class="btn-default">Default</button>
<button class="btn-primary">Primary</button>
<button class="btn-secondary">Secondary</button>
<button class="btn-info">Info</button>
<button class="btn-success">Success</button>
<button class="btn-warning">Warning</button>
<button class="btn-error">Error</button>
<button class="btn-disabled" disabled>Disabled</button>
</div>
Outline Buttons
<div class="flex flex-wrap gap-4 xxl:gap-6">
<button class="btn-default-outlined">Default</button>
<button class="btn-primary-outlined">Primary</button>
<button class="btn-secondary-outlined">Secondary</button>
<button class="btn-info-outlined">Info</button>
<button class="btn-success-outlined">Success</button>
<button class="btn-warning-outlined">Warning</button>
<button class="btn-error-outlined">Error</button>
<button class="btn-disabled-outlined" disabled>Disabled</button>
</div>
Subtle Buttons
<div class="flex flex-wrap gap-4 xxl:gap-6">
<button class="btn-default-soft">Default</button>
<button class="btn-primary-soft">Primary</button>
<button class="btn-secondary-soft">Secondary</button>
<button class="btn-info-soft">Info</button>
<button class="btn-success-soft">Success</button>
<button class="btn-warning-soft">Warning</button>
<button class="btn-error-soft">Error</button>
</div>
Text Buttons
<div class="flex flex-wrap">
<button class="btn-default-text">Default</button>
<button class="btn-primary-text">Primary</button>
<button class="btn-secondary-text">Secondary</button>
<button class="btn-info-text">Info</button>
<button class="btn-success-text">Success</button>
<button class="btn-warning-text">Warning</button>
<button class="btn-error-text">Error</button>
<button class="btn-disabled-text" disabled>Disabled</button>
</div>