Lightweight Fast UI Component Framework – Grayshift

Author: yanchokraev
Views Total: 213 views
Official Page: Go to website
Last Update: June 4, 2021
License: MIT


Lightweight Fast UI Component Framework – Grayshift


Grayshift is a front-end framework that provides a number of UI components, page templates, and content blocks for building modern web apps.

UI Components:

  • Buttons
  • Cards
  • Collapse
  • Dropdowns
  • Forms
  • Input group
  • Modal
  • Navs
  • Navbar


  • Accordion
  • Blog
  • Contact Form
  • Features
  • Footer
  • Header
  • Navbar
  • Pricing
  • Sign in
  • Testimonials


  • Chat
  • Project Management
  • Blog
  • Forum

Install & Import:

1. Download and import the Grayshift.css in your HTML document.

<link rel="stylesheet" href="./css/grayshift.min.css" />
<!-- Or From CDN -->
<link rel="stylesheet" href="[email protected]/css/grayshift.min.css" />

2. Import the latest Bootstrap 5 framework and popper.js library if you need to use components.

<script src="/path/to/cdn/popper.min.js"></script>
<script src="/path/to/cdn/bootstrap.min.js"></script>



Grayshift Framework Card Component

Card Component

Grayshift Framework Modal Component

Modal Component

Grayshift Framework Buttons Component

Buttons Component

Grayshift Framework Form Block

Form Block

Grayshift Framework Pricing Table Block

Pricing Table Block

Grayshift Framework Header Nav Block

Header Nav Block

Grayshift Framework Chat Template

Chat Template

Grayshift Framework Project Management Template

Project Management Template

Grayshift Framework Forum Template

Forum Template


v1.0.2 (06/04/2021)

v1.0.1 (05/25/2021)

v1.0.0 (05/24/2021)

See also  Mouse hover to zoom image & Button

Leave a Reply

Your email address will not be published. Required fields are marked *