Button

Displays a button.

Component Code 
<x-aui::button>Button</x-aui::button>

Variant examples

The button component comes in multiple variants

Default

Component Code 
<x-aui::button>Button</x-aui::button>

Secondary

Component Code 
<x-aui::button variant="secondary">Button</x-aui::button>

Destructive

Component Code 
<x-aui::button variant="destructive">Button</x-aui::button>

Outline

Component Code 
<x-aui::button variant="outline">Button</x-aui::button>

Ghost

Component Code 
<x-aui::button variant="ghost">Button</x-aui::button>

Link

Component Code 
<x-aui::button variant="link">Button</x-aui::button>

You can also use the none variant and style the button yourself

Size examples

The button component comes in multiple sizes

Default

Component Code 
<x-aui::button>Button</x-aui::button>

Icon

Component Code 
<x-aui::button size="icon" class="justify-center" variant="outline">
    <i class="fas fa-angle-right"></i>
</x-aui::button>

Small

Component Code 
<x-aui::button size="sm">Button</x-aui::button>

Large

Component Code 
<x-aui::button size="lg" variant="outline">
    <i class="far fa-envelope mr-2"></i>
    Login with Email
</x-aui::button>