The perfect UI library for styling your website
HTML-5, CSS-3, Vanilla JavaScript
To get the styles of the components, add the following line of code in the "head" tag of your html document
<link rel="stylesheet" href="https://matrix-ui.netlify.app/styles.css">To get the Font Awesome Icons, add the following line of code in the "head" tag of your html document
<script src="https://kit.fontawesome.com/52c15eb80a.js" crossorigin="anonymous"></script>- Success Alert
- Warning Alert
- Danger Alert
- Information Alert
- Differnt Sizes Avatar (Extra Small to Extra Large )
- Avatar with circular border
- Simple Badges
- Pill Badges
- Badge on Icons
- Badge on Avatar
- Simple Buttons
- Outlined Buttons
- Different sized buttons(Small & Large)
- Disabled Buttons
- Link buttons
- Icon Buttons
- Floated Action Button
- Vertical Card
- Card with Badge
- Card with Text Overlay
- Card with Dismiss
- Horizonatal Card
- Text Only card
- Simple Chips
- Chips with Avatar
- Drawer slides from left
- Four Columns Grid
- Three Columns Grid
- Two Columns Grid
- Single Columns Grid
- Full Width Responsive Image
- Round Image
- Square Image
- Labeled Inputs
- Success & Error Inputs
- Input List
- Textarea
- Checkboxes
- Radio buttons
- Log in Form
- Simple List
- Notification List
- Modal Example
- Delete Model
- Responsive Navbar
- Large Size Ratings
- Medium Size Ratings
- Small Size Ratings
- Simple Snackbar
- Different Sized Headings
- Types of Paragraph Text
- Some Extra styles(Text Mark, Text Strike Through & Text Light Weight)
