Amaze UI

A CSS component library to build & speed up your development process while building the elegant web apps.

Preview

Amaze-UI.mp4

Installation Guide

To start using the components in your personal projects use the below mentioned methods:

Link to HTML file:

  <link rel="stylesheet" href="https://amaze-ui.netlify.app/css/components.css">

Import in CSS file:

  @import url("https://amaze-ui.netlify.app/css/components.css");

Run Locally

Clone the project

  git clone https://github.com/sharmayatendra/Amaze-UI.git

Go to the project directory

  cd Amaze-UI

Tech Stack

Client - HTML , CSS

Hosted - Netlify

Features

Amaze-UI currently has 10 components which you can use in your personal projects.

Import the whole library or components according to your need.

• Avatar (https://amaze-ui.netlify.app/components/Avatar/avatar.html)
  • Different Sized Rounded Avatars
  • Rounded Avatars
• Alert (https://amaze-ui.netlify.app/components/Alert/alert.html)
  • Standard Alerts
  • Outline Alerts
• Badge (https://amaze-ui.netlify.app/components/Badge/badge.html)
  • Badge on Avatars
  • Badge on Icons
• Button (https://amaze-ui.netlify.app/components/Button/button.html)
  • Primary Buttons
  • Link Buttons
  • Icon Buttons
  • Floating Action Buttons
• Card (https://amaze-ui.netlify.app/components/Card/card.html)
  • Vertical Card
  • Card with badge
  • Card with dismiss
  • Card with Text-Overlay
  • Text only Card
  • Card with Shadow
• Image (https://amaze-ui.netlify.app/components/Image/image.html)
  • Responsive image
  • Rounded image
• Input (https://amaze-ui.netlify.app/components/Input/input.html)
  • Textbox Input
  • Validation & Errors
• List (https://amaze-ui.netlify.app/components/List/list.html)
  • Normal List
  • Stacked Checkbox List
• Navigation (https://amaze-ui.netlify.app/components/Navigation/navigation.html)
• Toast (https://amaze-ui.netlify.app/components/Toast/toast.html)
  • Baseline Toast
  • Stacked Toast
• Text Utilities (https://amaze-ui.netlify.app/components/Textutilities/textutilities.html)
  • Headings
  • Small Text
  • Grey Text
  • Centered Text
• Grid (https://amaze-ui.netlify.app/components/Grid/grid.html)
  • Grid-2 : Two items in a grid
  • Grid-3 : Three items
• Modal (https://amaze-ui.netlify.app/components/Modal/modal.html)
• Slider (https://amaze-ui.netlify.app/components/slider/slider.html)

Used By

This project is used by the following apps:

• Amaze-On

🔗 Connect With Me

• Portfolio

• Linkedin

• Twitter

Authors

• Yatendra Sharma