Buttons

Buttons are a middleman between the user and the product, and are charged with keeping the conversation between person and machine going.

Avatar

An avatar is a representation of who we are or our fictional character.

Alert

Alerts are push notifications

I am Primary alert
I am Secondary alert
I am Info alert
I am Warning Alert
I am Success alert
I am Danger alert

Badges

Badges in Web Design usually helps to highlight certain attributes of an item.

Images

To display responsive images

Cards

Cards act as a small rectangle associated to a singular thought. They are full of interactive elements such as text, links, buttons or images

Basic Card
I am Primary Card

Cards are a convenient means of displaying content composed of different types of objects. They’re also well-suited for presenting similar objects whose size or supported actions can vary considerably, like photos with captions of variable length.

Basic Card
I am Secondary Card

Cards are a convenient means of displaying content composed of different types of objects. They’re also well-suited for presenting similar objects whose size or supported actions can vary considerably, like photos with captions of variable length.

Basic Card
I am Success Card

Cards are a convenient means of displaying content composed of different types of objects. They’re also well-suited for presenting similar objects whose size or supported actions can vary considerably, like photos with captions of variable length.

Basic Card
I am Danger Card

Cards are a convenient means of displaying content composed of different types of objects. They’re also well-suited for presenting similar objects whose size or supported actions can vary considerably, like photos with captions of variable length.

Card With Links
X
I am Card With Links

Cards are a convenient means of displaying content composed of different types of objects. They’re also well-suited for presenting similar objects whose size or supported actions can vary considerably, like photos with captions of variable length.

CARD LINK 1 ANOTHER LINK 2
Card Images
X

Forms

Getting data from user

Toast

A small Message

React Mega Event
This is a toast message

Modal

A modal (also called a modal window or lightbox) is a web page element that displays in front of and deactivates all other page content.

Modal Title

The Modal plugin is a dialog box/popup window that is displayed on top of the current

Typography

Different font sizes

HEADING 1

HEADING 2

HEADING 3

HEADING 4

HEADING 5
HEADING 6

HEADING WITH MUTED TEXT

Stacked List Group

Display a list of text

  • Item 1
  • Item 2
  • Item 3
  • Item 4
  • Item 5

Spaced List Group

Display a list of text

  • Item 1
  • Item 2
  • Item 3
  • Item 4
  • Item 5