Mobile-first Bootstrap 4 UI Kit – Shards

Category: Frameworks , Javascript , Recommended | November 10, 2017
Author: DesignRevision
Views Total: 81
Official Page: Go to website
Last Update: November 10, 2017
License: MIT

Preview:

Mobile-first Bootstrap 4 UI Kit – Shards

Description:

Shards is a free, responsive UI toolkit which helps you create modern, mobile-friendly web apps using Bootstrap 4 framework. Sketch and SCSS files are included.

Elements and components included:

  • Elegant colors.
  • Typography.
  • Material and FontAwesome icon packs.
  • Form Controls.
  • Sliders.
  • Datepickers.
  • Card layout.
  • Buttons.
  • Progress Bars.
  • Modals.
  • Badges.
  • Alerts.
  • Tooltips & Popovers.
  • Navbars.

Basic usage:

Include the ‘shards.min.css’ to your Bootstrap 4 web page and you’re ready to go.

<!-- CSS Dependencies -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" integrity="sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M" crossorigin="anonymous">
<link rel="stylesheet" href="css/shards.min.css">

<!-- Optional JavaScript -->
<!-- JavaScript Dependencies: jQuery, Popper.js, Bootstrap JS, Shards JS -->
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" integrity="sha384-h0AbiXch4ZDo7tp9hKZ4TsHbi047NrKGLO3SEJAg45jXxnGIfYzk4Si90RDIqNm1" crossorigin="anonymous"></script>
<script src="js/shards.js"></script>

Read the full document for more information.