### Pill Badges

#### Secondary Pill Badges

Use the `.badge` class, followed by`.badge-pill` with `.badge-secondary`class within element to create default pill badge.

59

#### Primary Pill Badges

Use the `.badge` class, followed by`.badge-pill` with `.badge-primary`class within element to create primary pill badge.

43

#### Success Pill Badges

Use the `.badge` class, followed by`.badge-pill` with `.badge-success`class within element to create success pill badge.

25

#### Danger Pill Badges

Use the `.badge` class, followed by `.badge-pill` with `.badge-danger`class within element to create danger pill badge.

78

#### Info Pill Badges

Use the `.badge` class, followed by `.badge-pill` with `.badge-info`class within element to create info pill badge.

57

#### Warning Pill Badges

Use the `.badge` class, followed by `.badge-pill` with `.badge-warning`class within element to create warning pill badge.

68

#### Custom Blue Grey Color Pill Badges

Use the `.badge` class, followed by`.bg-blue-grey`class within element to create blue grey label.

63

#### Pill Badges With Glow effect

#### Secondary Pill Badges

Use the `.badge` class, followed by `.badge-pill` with `.badge-glow`class within element to create glow styled pill badge.

59

#### Primary Pill Badges

Use the `.badge` class, followed by `.badge-pill` with `.badge-glow`class within element to create glow styled pill badge.

41

#### Success Pill Badges

Use the `.badge` class, followed by `.badge-pill` with `.badge-glow`class within element to create glow styled pill badge.

25

#### Danger Pill Badges

Use the `.badge` class, followed by `.badge-pill` with `.badge-glow`class within element to create glow styled pill badge.

78

#### Info Pill Badges

Use the `.badge` class, followed by `.badge-pill` with `.badge-glow`class within element to create glow styled pill badge.

57

#### Warning Pill Badges

Use the `.badge` class, followed by `.badge-pill` with `.badge-glow`class within element to create glow styled pill badge.

68

#### Custom Blue Grey Color Pill Badges

Use the `.badge` class, followed by `.badge-pill` with `.badge-glow`class within element to create glow styled pill badge.

63

#### Square Pill Badges

For square pill badges, use `.badge-square` class with `.badge` class.

#### Secondary Square Pill

15

#### Square Primary Pill

21

#### Square Success Pill

36

#### Pill Badges with Icons

#### Secondary Icon Pill

#### Primary Icon Pill

#### Success Icon Pill

#### Square Danger Icon Pill

#### Square Info Icon pill badge

#### Square Warning Icon Label

#### Pill Badges with Dropdown

#### Secondary Pill with Dropdown

#### Primary Pill with Dropdown

88

#### Success Pill with Dropdown

#### Square Danger Pill with Dropdown

#### Square Info Pill with Dropdown

33

#### Square Warning Pill with Dropdown

#### Bordered Pill Badges

#### Primary Pill Badges

Use the `.badge` class, followed by`.badge-border` with `.badge-primary`class within element to create primary pill badge.

43

#### Success Pill Badges

Use the `.badge` class, followed by`.badge-border` with `.badge-success`class within element to create success pill badge.

25

#### Danger Pill Badges

Use the `.badge` class, followed by `.badge-border` with `.badge-danger`class within element to create danger pill badge.

78

#### Info Pill Badges

Use the `.badge` class, followed by `.badge-border` with `.badge-info`class within element to create info pill badge.

57

#### Warning Pill Badges

Use the `.badge` class, followed by `.badge-border` with `.badge-warning`class within element to create warning pill badge.

68

#### Custom Brown Color Pill Badges

Use the `.badge` class, followed by `.badge-border` with `.bg-blue`class within element to create blue pill badge.

34

#### Pill Badges With Glow effect

#### Primary Pill Badges

Use the `.badge` class, followed by `.badge-border` with `.badge-glow`class within element to create glow styled pill badge.

41

#### Success Pill Badges

Use the `.badge` class, followed by `.badge-border` with `.badge-glow`class within element to create glow styled pill badge.

25

#### Danger Pill Badges

Use the `.badge` class, followed by `.badge-border` with `.badge-glow`class within element to create glow styled pill badge.

78

#### Info Pill Badges

Use the `.badge` class, followed by `.badge-border` with `.badge-glow`class within element to create glow styled pill badge.

57

#### Warning Pill Badges

Use the `.badge` class, followed by `.badge-border` with `.badge-glow`class within element to create glow styled pill badge.

68

#### Custom Brown Color Pill Badges

Use the `.badge` class, followed by `.badge-border` with `.badge-glow`class within element to create glow styled pill badge.

34

#### Square Pill

For square pill badges, use `.badge-square` class with `.badge` class.

#### Danger Square Pill

15

#### Square Primary Pill

21

#### Square Success Pill

36

#### Bordered Pill Badges with Icons

#### Pink Icon Pill

#### Primary Icon Pill

#### Success Icon Pill

#### Square Danger Icon Pill

#### Square Info Icon pill badge

#### Square Warning Icon Label

#### Bordered Pill Badges with Dropdown

#### Pill with Dropdown

#### Danger Pill with Dropdown

66

#### Success Pill with Dropdown

#### Square Purple Pill with Dropdown

#### Square Info Pill with Dropdown

55

#### Square Warning Pill with Dropdown

#### Theme Customizer

Customize & Preview in Real Time

##### Menu Color Options

##### Layout Options

Collapsed Menu
Fixed Layout
Boxed Layout
Static Layout
Native Scroll
Right Side Icons
Bordered Navigation
Flipped Navigation
Collapsible Navigation
Static Navigation
Brand Center
Static Top

##### Navigation Color Options

###### Solid

Default
Primary
Danger
Success
Blue
Cyan
Pink

###### Gradient

Default
Primary
Danger
Success
Blue
Cyan
Pink
Default
Primary
Danger
Success
Blue
Cyan
Pink

### Solid

Default
Primary
Danger
Success
Blue
Cyan
Pink

### Gradient

Default
Primary
Danger
Success
Blue
Cyan
Pink
Default
Primary
Danger
Success
Blue
Cyan
Pink
Buy Now