Icon Buttons
Icon Button Types
<a class="btn btn-primary" href="#" role="button"><i class="bi bi-house me-1"></i> Bootstrap icon</a>
<button class="btn btn-theme" type="submit"><i data-feather="home" class="me-1 align-middle"></i> Feather icon</button>
<a class="btn btn-theme btn-square" href="#" role="button"><i class="bi bi-house"></i></a>
<button class="btn btn-theme btn-square" type="submit"><i data-feather="home" class="vm"></i></button>
Button Icon Colors
<button type="button" class="btn btn-theme"><i data-feather="home" class="me-1 align-middle"></i> Theme</button>
<button type="button" class="btn btn-accent"><i data-feather="home" class="me-1 align-middle"></i> Accent</button>
<button type="button" class="btn btn-primary"><i data-feather="home" class="me-1 align-middle"></i> Primary</button>
<button type="button" class="btn btn-secondary"><i data-feather="home" class="me-1 align-middle"></i> Secondary</button>
<button type="button" class="btn btn-success"><i data-feather="home" class="me-1 align-middle"></i> Success</button>
<button type="button" class="btn btn-danger"><i data-feather="home" class="me-1 align-middle"></i> Danger</button>
<button type="button" class="btn btn-warning"><i data-feather="home" class="me-1 align-middle"></i> Warning</button>
<button type="button" class="btn btn-info"><i data-feather="home" class="me-1 align-middle"></i> Info</button>
<button type="button" class="btn btn-light"><i data-feather="home" class="me-1 align-middle"></i> Light</button>
<button type="button" class="btn btn-dark"><i data-feather="home" class="me-1 align-middle"></i> Dark</button>
<button type="button" class="btn btn-primary btn-square"><i data-feather="home" class="vm"></i></button>
<button type="button" class="btn btn-secondary btn-square"><i data-feather="home" class="vm"></i></button>
Button Icon Outlined
<button type="button" class="btn btn-outline-theme"><i data-feather="home" class="me-1 align-middle"></i> Theme</button>
<button type="button" class="btn btn-outline-accent"><i data-feather="home" class="me-1 align-middle"></i> Accent</button>
<button type="button" class="btn btn-outline-primary"><i data-feather="home" class="me-1 align-middle"></i> Primary</button>
<button type="button" class="btn btn-outline-secondary"><i data-feather="home" class="me-1 align-middle"></i> Secondary</button>
<button type="button" class="btn btn-outline-success"><i data-feather="home" class="me-1 align-middle"></i> Success</button>
<button type="button" class="btn btn-outline-danger"><i data-feather="home" class="me-1 align-middle"></i> Danger</button>
<button type="button" class="btn btn-outline-warning"><i data-feather="home" class="me-1 align-middle"></i> Warning</button>
<button type="button" class="btn btn-outline-info"><i data-feather="home" class="me-1 align-middle"></i> Info</button>
<button type="button" class="btn btn-outline-light"><i data-feather="home" class="me-1 align-middle"></i> Light</button>
<button type="button" class="btn btn-outline-dark"><i data-feather="home" class="me-1 align-middle"></i> Dark</button>
<button type="button" class="btn btn-outline-primary btn-square"><i data-feather="home" class="vm"></i></button>
<button type="button" class="btn btn-outline-secondary btn-square"><i data-feather="home" class="vm"></i></button>
Button Icon Light Colors
<button type="button" class="btn btn-light-color btn-theme"><i data-feather="home" class="me-1 align-middle"></i> Theme</button>
<button type="button" class="btn btn-light-color btn-accent"><i data-feather="home" class="me-1 align-middle"></i> Accent</button>
<button type="button" class="btn btn-light-color btn-primary"><i data-feather="home" class="me-1 align-middle"></i> Primary</button>
<button type="button" class="btn btn-light-color btn-secondary"><i data-feather="home" class="me-1 align-middle"></i> Secondary</button>
<button type="button" class="btn btn-light-color btn-success"><i data-feather="home" class="me-1 align-middle"></i> Success</button>
<button type="button" class="btn btn-light-color btn-danger"><i data-feather="home" class="me-1 align-middle"></i> Danger</button>
<button type="button" class="btn btn-light-color btn-warning"><i data-feather="home" class="me-1 align-middle"></i> Warning</button>
<button type="button" class="btn btn-light-color btn-info"><i data-feather="home" class="me-1 align-middle"></i> Info</button>
<button type="button" class="btn btn-light-color btn-light"><i data-feather="home" class="me-1 align-middle"></i> Light</button>
<button type="button" class="btn btn-light-color btn-dark"><i data-feather="home" class="me-1 align-middle"></i> Dark</button>
<button type="button" class="btn btn-light-color btn-success btn-square"><i data-feather="home" class="vm"></i></button>
<button type="button" class="btn btn-light-color btn-danger btn-square"><i data-feather="home" class="vm"></i></button>